tigerphp
/
stagfe


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
							<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <title>X•Y•Z</title>

        <!-- Fonts -->
        <link href="https://fonts.googleapis.com/css?family=Nunito:200,600,700" rel="stylesheet">

        {{-- Bootstrap --}}
        <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
        <link rel="stylesheet" href="/css/bootstrap.min.css">

        <!-- Styles for patient home -->
        <style>
            html, body {
                background-color: #fff;
                color: #636b6f;
                font-family: 'Nunito', sans-serif;
                font-weight: 200;
                height: 100vh;
                margin: 0;
            }

            body {
                background-image: url(images/patient-home-banner.jpg);
                background-size: 100% auto;
                background-position: top center;
            }

            @media (max-width: 900px) {
                body {
                    background-size: auto 100%;
                }
            }

            h1 {
                color: #555;
                width: 50%;
                text-align: center;
            }

            @media (max-width: 900px) {
                h1 {
                    width: auto;
                    text-align: center;
                    font-size: 2rem;
                    text-shadow: 1px 1px 2px #c0e4e2;
                }
            }

            @media (max-width: 400px) {
                h1 {
                    font-size: 1.75rem;
                    text-shadow: 1px 1px 2px #c0e4e2;
                }
            }

            .form-container {
                width: 50%;
                margin-right: auto;
            }

            @media (max-width: 900px) {
                .form-container {
                    margin: auto;
                    width: 100%;
                }
            }

            .form-container .form {
                background: #ffffffd1;
                max-width: 400px;
                margin: auto;
                border-radius: 4px;
            }

            .form-container .form h3 {
                font-size: 1.3rem;
            }

            .border-success {
                border-color: #44bdad85 !important;
            }

            .text-dark {
                color: #555;
                font-weight: 600;
            }

            .form-container .form input {
                border-color: #44bdad85 !important;
            }

            .form-container .form input:focus {
                box-shadow: 0 0 0 0.2rem #44bdad85;
            }
        </style>
    </head>
    <body class="px-3 px-md-5 py-5">

    {{-- top text --}}
    <div class="d-flex">
        <h1 class="font-weight-bold">Consult your doctor from the comfort of your home!</h1>
    </div>

    <div class="d-flex mt-4 mt-sm-5">
        <div class="form-container">
            <div class="form">
                <h3 class="border-bottom border-success text-center font-weight-bold py-3 m-0">Start Meeting</h3>
                <p class="px-4 text-dark m-0 py-3">Please enter your name and date of birth to start a meeting.</p>
                <div class="px-4 mb-4" autofocus="true">
                    <input type="text" class="form-control py-3" placeholder="Your name">
                </div>
                <div class="px-4 mb-4">
                    <input type="date" class="form-control py-3" placeholder="Your date of birth">
                </div>
                <div class="px-4 pb-4">
                    <button class="btn btn-success font-weight-bold w-100">Start Meeting</button>
                </div>
            </div>
        </div>
    </div>

    </body>
</html>