<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <title>MeHealth</title>

    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta3/dist/js/bootstrap.bundle.min.js" integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf" crossorigin="anonymous"></script>
    <script src="https://kit.fontawesome.com/eb33f99750.js" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/home-style.css">
    <style>
        img{
            height: 70%;
            width: auto;
            margin-left: 10%;
            margin-bottom: 25px;
        }
        .btn{
            float: right;
            margin-bottom: 25px;
        }
    </style>
</head>
<body>

    <div class="wrapper">
   <!-- Sidebar Holder start -->
        <nav id="sidebar">
            <div class="sidebar-header">
                <h3><a class="hero-brand" href="/" title="Home"><img alt="MeHealth" src="img/logo.jpeg"></a></h3>
            </div>

            <ul class="list-unstyled components">
                <li>
                    <a href="/home">Covid Data</a>
                </li>
                <li>
                    <a href="/covid/home">Covid Detection</a>
                </li>
                <li>
                <li>
                    <a href="/covid/precautions">Precations</a>
                </li>
                <li>
                    <a href="/covid/after-precautions">Precations(after covid +ve)</a>
                </li> 
                <li>
                    <a href="/covid/plasma-donars">Plasma donars</a>
                </li>                
                </li>
                <li>
                    <a href="/depression/home">Depression Detection</a>
                </li>  
                <li>
                    <a href="/mealone">Chat bot</a>  
                </li>
                <li>
                    <a href="/live-consultation">Live Consultation</a>
                </li>
            </ul>

        </nav>
<!-- Sidebar Holder ends -->
        <!-- Page Content Holder -->
        <div id="content">
            <div class="container-fluid">

                <button type="button" id="sidebarCollapse" class="navbar-btn">
                    <span></span>
                    <span></span>
                    <span></span>
                </button>
                <button class="btn btn-dark d-inline-block d-lg-none ml-auto" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                    <i class="fas fa-align-justify"></i>
                </button>

                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                    <ul class="nav navbar-nav ml-auto">
                        <li class="nav-item active">
                            
                        </li>
                    </ul>
                </div>
            </div>
            <div class="container">
                    <h3>List of doctors avaliable</h3>
                    <a class="btn btn-primary" href="http://127.0.0.1:3000/">Go for a live Consultation</a>
                <div class="images">
                    <img src="img/doc1.jpeg" alt="">
                    <img src="img/doc2.jpeg" alt="">
                </div> 

            </div>
        </div>
    </div>
    <script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
    <!-- jQuery CDN - Slim version (=without AJAX) -->
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <!-- Popper.JS -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ" crossorigin="anonymous"></script>
    <!-- Bootstrap JS -->
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js" integrity="sha384-uefMccjFJAIv6A+rW+L4AHf99KvxDjWSu1z9VI8SKNVmz4sk7buKt/6v9KI65qnm" crossorigin="anonymous"></script>

    <script type="text/javascript">
        $(document).ready(function () {
            $('#sidebarCollapse').on('click', function () {
                $('#sidebar').toggleClass('active');
                $(this).toggleClass('active');
            });
        });
    </script>
</body>

</html>