index.html

   1 <!--
   2 ***********************************************************************
   3  * Title: PDosage
   4  * Description: Pediatric Dose Calculator
   5  * Author: Agnibho Mondal
   6  * Website: http://code.agnibho.com
   7  **********************************************************************
   8    Copyright (c) 2016 Agnibho Mondal
   9    All rights reserved
  10  **********************************************************************
  11    This file is part of PDosage.
  12
  13    PDosage is free software: you can redistribute it and/or modify
  14    it under the terms of the GNU General Public License as published by
  15    the Free Software Foundation, either version 3 of the License, or
  16    (at your option) any later version.
  17
  18    PDosage is distributed in the hope that it will be useful,
  19    but WITHOUT ANY WARRANTY; without even the implied warranty of
  20    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  21    GNU General Public License for more details.
  22
  23    You should have received a copy of the GNU General Public License
  24    along with PDosage. If not, see <http://www.gnu.org/licenses/>.
  25 ***********************************************************************
  26 -->
  27 <!DOCTYPE html>
  28 <html>
  29     <head>
  30         <title>PDosage</title>
  31         <link rel="icon" href="dist/logo.png">
  32         <meta charset="utf-8">
  33         <meta name="viewport" content="width=device-width, initial-scale=1.0">
  34         <style>
  35          .loader {
  36              position: absolute;
  37              left: 50%;
  38              top: 50%;
  39              border: 16px solid lavender;
  40              border-top: 16px solid #428bca;
  41              border-bottom: 16px solid #428bca;
  42              border-radius: 50%;
  43              width: 150px;
  44              height: 150px;
  45              margin: -75px 0 0 -75px;
  46              animation: spin 2s linear infinite;
  47          }
  48
  49          @keyframes spin {
  50              0% { transform: rotate(0deg); }
  51              100% { transform: rotate(360deg); }
  52          }
  53         </style>
  54
  55     </head>
  56     <body>
  57         <div class="loader"></div>
  58         <div class="container" style="display:none">
  59             <div class="text-primary">
  60                 <div class="jumbotron">
  61                     <h1>PDosage</h1>
  62                     <h2>Pediatric Dose Calculator</h2>
  63                 </div>
  64             </div>
  65             <div class="row" id="app">
  66                 <data-input :patient="patient"></data-input>
  67                 <div>
  68                     <ul class="nav nav-tabs">
  69                         <li class="active"><a href="#fav" data-toggle="tab">Favorites</a></li>
  70                         <li><a href="#all" data-toggle="tab">All Drugs</a></li>
  71                         <li><a href="#calc" data-toggle="tab">Calculator</a></li>
  72                         <li><a href="#about" data-toggle="tab">About</a></li>
  73                     </ul>
  74                     <div class="tab-content">
  75                         <div class="tab-pane active" id="fav">
  76                             <quick-view :patient="patient" :dosage="dosage" :favs="favs"></quick-view>
  77                         </div>
  78                         <div class="tab-pane" id="all">
  79                             <list-view :patient="patient" :dosage="dosage" :favs="favs"></list-all>
  80                         </div>
  81                         <div class="tab-pane" id="calc">
  82                             <calculator-view></calculator-view>
  83                         </div>
  84                         <div class="tab-pane" id="about">
  85                             <about-view></about-view>
  86                         </div>
  87                     </div>
  88                 </div>
  89             </div>
  90             <div class="alert alert-info">
  91                 <h3>Copyright &copy; <span class="copyright" data-start="2016">2016</span> Agnibho Mondal</h3>
  92                 <h4><a href="http://www.agnibho.com" style="text-decoration:none;color:inherit">www.agnibho.com</a></h4>
  93             </div>
  94         </div>
  95         <script src="dist/bundle.js"></script>
  96     </body>
  97 </html>