Notes
Notes - notes.io |
<html lang="en">
<head>
<title>Pandamic Medical Help Portal</title>
<meta charset="UTF-8">
<meta charset="utf-8">
<link href="https://fonts.googleapis.com/css?family=Roboto:400,500|Open+Sans" rel="stylesheet">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"/>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"></script>
<script src="https://use.fontawesome.com/releases/v5.0.8/js/all.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
</head>
<style>
body {
margin:0;
padding:0;
font-family: 'Caliber' ,'Gill Sans', 'Gill Sans MT','Trebuchet MS', sans-serif;
}
.nav {
display:flex;
padding:10px;
background-color:darkgreen;
align-items:center;
}
h1{
color:white;
font-size:28pt;
padding:0 0 0 5px;
}
nav {
flex:1;
text-align:right;
}
a {
text-decoration: none;
color:whitesmoke;
}
nav ul {
display:inline-block;
list-style-type: none;
}
nav ul li{
display:inline-block;
margin:20px;
}
.sec {
background-color:#fff;
padding:5px 2px;
}
.sec form {
border-radius:40px;
width:200px;
margin:5px;
float:right;
}
.carousel-item {
height: 100vh;
min-height: 350px;
background: no-repeat center center scroll;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
.social a{
font-size: 4em;
padding: 2rem;
}
.fa-linkedin{
color:darkblue;
}
.fa-facebook{
color:#3b5998;
}
.fa-twitter{
color:#00aced;
}
.fa-instagram{
color:#517fa4;
}
.fa-youtube {
color:#bb0000;
}
.f2container {
background-color: #333333;
border:1px;
display: -webkit-flex;
margin:0%;
min-height: 250px;
width:100%;
}
h4{
font-size:20pt;
}
.f2container div{
padding:1px;
flex:1;
}
.myaccount li , a{
color:#fff;
padding:0;
list-style:none;
margin-right:0;
margin-left:0;
margin-top:10px;
}
.policy li , a{
color:#fff;
padding:0;
list-style:none;
margin-right:0;
margin-left:0;
margin-top:10px;
margin-bottom:20px;
}
.contactus li , a{
color:#fff;
padding:0;
list-style:none;
margin-right:0;
margin-left:0;
margin-top:10px;
}
.aboutus li , a{
color:#fff;
padding:0;
list-style:none;
margin-right:0;
margin-left:0;
margin-top:10px;
}
.social li , a{
color:#fff;
padding:0;
list-style:none;
margin-right:0;
margin-left:0;
margin-top:10px;
}
.search-container{
margin-left: 75%;
padding:15px;
border-radius: 10px;
}
.topnav .search-container button {
float: right;
padding: 6px;
margin-top: 8px;
margin-right: 16px;
background: #ddd;
font-size: 17px;
border: none;
cursor: pointer;
}
.topnav .search-container button:hover {
background: #ccc;
}
@media screen and (max-width: 600px) {
.topnav .search-container {
float: none;
}}
.img1{
height: 50px;
width:50px
}
.carousel-caption {
position: absolute;
bottom: 0;
left: 0;
color: #FFF;
background-color: rgba(0, 0, 0, .65);
padding: 50px 50px
}
/* login */
.login {
width: 400px;
margin: 16px auto;
font-size: 16px;
}
.login-header,
.login p {
margin-top: 0;
margin-bottom: 0;
}
.login-triangle {
width: 0;
margin-right: auto;
margin-left: auto;
border: 12px solid transparent;
border-bottom-color: rgb(15, 66, 107);
}
.login-header {
background: rgb(12, 77, 129);
padding: 20px;
font-size: 1.4em;
font-weight: normal;
text-align: center;
text-transform: uppercase;
color: #fff;
}
.login-container {
background: #ebebeb;
padding: 12px;
}
.login p {
padding: 12px;
}
.login input {
box-sizing: border-box;
display: block;
width: 100%;
border-width: 1px;
border-style: solid;
padding: 16px;
outline: 0;
font-family: inherit;
font-size: 0.95em;
}
.login input[type="email"],
.login input[type="password"] {
background: #fff;
border-color: #bbb;
color: #555;
}
.login input[type="email"]:focus,
.login input[type="password"]:focus {
border-color: #888;
}
.login input[type="submit"] {
background: rgb(1, 29, 51);
border-color: transparent;
color: #fff;
cursor: pointer;
}
.login input[type="submit"]:hover {
background: #17c;
}
.login input[type="submit"]:focus {
border-color: #05a;
}
.has-error input[type="email"],
.has-error input[type="password"] {
border-color: rgb(216, 12, 12);
color: rgb(230, 14, 14);
}
#back{
background-color: whitesmoke;
}
</style>
<body>
<!-- nav bar -->
<header >
<div class="nav">
<img class="img1" src="https://www.netclipart.com/pp/m/361-3616036_blood-donation-logo-png.png">
<h1>Pandamic Medical Help Portal</h1>
<nav>
<ul>
<li ><a href="#">Our Work</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Insights</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Contact Us</a></li>
</ul>
</nav>
</div>
</header>
<header>
<div class="search-container">
<form >
<input type="text" placeholder="Search for medicine.." name="search">
<button type="submit">Submit</button>
</form>
</div>
</header>
<br/><br/>
<!-- carousel -->
<div id="carousel-example-2" class="carousel slide carousel-fade" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carousel-example-2" data-slide-to="0" class="active"></li>
<li data-target="#carousel-example-2" data-slide-to="1"></li>
<li data-target="#carousel-example-2" data-slide-to="2"></li>
<li data-target="#carousel-example-2" data-slide-to="3"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="carousel-item active">
<div class="view">
<img class="d-block w-100" src="https://media.istockphoto.com/vectors/serene-blood-drop-donating-during-blood-donor-day-vector-id965805900?k=6&m=965805900&s=170667a&w=0&h=qSQaI1jXDAtCCv7aQkMP8kPmxfTbD_7mzqn04O6sO1g=" alt="First slide">
<div class="mask rgba-black-light"></div>
</div>
<div class="carousel-caption">
<h1 class="h3-responsive">If you really want to lend a hand, lend an arm.”</h1>
<h3>“You are not important because of how long you live, you are important because of how effective you live.”</h3>
</div>
</div>
<div class="carousel-item">
<div class="view">
<img class="d-block w-100 " src="https://3.bp.blogspot.com/-lc38LzJuKQ0/W3-dcfaPQFI/AAAAAAAAIAE/bDvEkcTPMBsuCyZiaAUxdxF5zwXOZnJ1gCLcBGAs/s1600/Photo%2B4.JPG" alt="Second slide">
<div class="mask rgba-black-strong"></div>
</div>
<div class="carousel-caption">
<h1 class="h3-responsive">Donate your blood for a reason, let the reason to be life.</h1>
<h3>We make a living by what we get. We make a life by what we give.”</h3>
</div>
</div>
<div class="carousel-item">
<div class="view">
<img class="d-block w-100 " src="https://th.bing.com/th/id/OIP.ou6YTfwfgPL3M7RHjnIk1gHaD8?pid=ImgDet&rs=1" alt="Third slide">
<div class="mask rgba-black-slight"></div>
</div>
<div class="carousel-caption">
<h1 class="h3-responsive">Your blood is replaceable. A life is not.</h1>
<h3>To give blood you need neither extra strength nor extra food, and you will save a life.h3>
</div>
</div>
<div class="carousel-item">
<div class="view">
<img class="d-block w-100 " src="https://images.all-free-download.com/images/graphiclarge/plasma_highdefinition_picture_168332.jpg" alt="Fourth slide">
<div class="mask rgba-black-strong"></div>
</div>
<div class="carousel-caption">
<h1 class="h3-responsive"><h1>Opportunities knock the door sometimes, so don’t let it go and donate blood.</h1>
<h3 >Never lose the opportunity for blood donation as it always chose someone special.</h3>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#carousel-example-2" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carousel-example-2" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div><br>
<!-- table-->
<div class="container-fluid padding">
<div class="row padding ">
<div class="col-md-6">
<div class="container">
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>Type</th>
<th>Location</th>
<th>From</th>
<th>To</th>
<th>Details</th>
</tr>
</thead>
<tbody>
<tr>
<td class="btn-primary">Blood</td>
<td class="btn-success">Vishakhapatnam</td>
<td class="btn-light">14-02-2022</td>
<td class="btn-secondary">20-02-2022</td>
<td class="btn-"><a style="color:black" href="#"> click here for more details</a></td>
</tr>
<tr>
<td class="btn-primary">Plasma</td>
<td class="btn-success">Nellore</td>
<td class="btn-light">04-03-2022</td>
<td class="btn-secondary">01-04-2022</td>
<td class="btn-"><a style="color:black" href="#"> click here for more details</a></td>
</tr>
<tr>
<td class="btn-primary">Blood</td>
<td class="btn-success">Kadapa</td>
<td class="btn-light">29-02-2022</td>
<td class="btn-secondary">20-03-2022</td>
<td class="btn-"><a style="color:black" href="#"> click here for more details</a></td>
</tr>
<tr>
<td class="btn-primary">Plasma</td>
<td class="btn-success">Kadapa</td>
<td class="btn-light">19-03-2022</td>
<td class="btn-secondary">30-03-2022</td>
<td class="btn-"><a style="color:black" href="#"> click here for more details</a></td>
</tr>
<tr>
<td class="btn-primary">Plasma</td>
<td class="btn-success">Eluru</td>
<td class="btn-light">29-02-2022</td>
<td class="btn-secondary">01-05-2022</td>
<td class="btn-"><a style="color:black" href="#"> click here for more details</a></td>
</tr>
<tr>
<td class="btn-primary">Blood</td>
<td class="btn-success">Srikakulam</td>
<td class="btn-light">01-04-2022</td>
<td class="btn-secondary">20-04-2022</td>
<td class="btn-"><a style="color:black" href="#"> click here for more details</a></td>
</tr>
</tbody>
</table>
<a style="color: darkblue;"href="#">See more...</a>
</div>
</div>
<!-- sign in and login page -->
<div class="col-md-6">
<form style="background-color: #bbb;" >
<fieldset >
<legend>ContactUs</legend>
<form #ContactUs = "ngForm">
<!--Name Block-->
<div class="form-group">
<label class="text-black " style="font-weight: 1000; font-family:'Times New Roman', Times, serif;" for="inputName">Name:</label>
<input type="text" class="form-control" required [(ngModel)]="user.name" id="inputName" name="name" placeholder="Name">
</div><br>
<!--Address Block-->
<div class="form-group">
<label class="text-black " style="font-weight: 1000; font-family:'Times New Roman', Times, serif;" for="inputAddress">Address:</label>
<input type="text" class="form-control" required [(ngModel)]="user.address" id="inputAddress" name="address" placeholder="Address">
</div><br>
<!--Email Block-->
<div class="form-group">
<label class="text-black " style="font-weight: 1000; font-family:'Times New Roman', Times, serif;" for="inputEmail">Email:</label>
<input type="text" class="form-control" required [(ngModel)]="user.email" id="inputEmail" name="email" placeholder="Email">
</div><br>
<!--Phone Block-->
<div class="form-group">
<label class="text-black " style="font-weight: 1000; font-family:'Times New Roman', Times, serif;" for="inputPhone">Phone Number:</label>
<input type="text" class="form-control" required [(ngModel)]="user.phone" id="inputPhone" name="phone" placeholder="Phone">
</div><br>
<!--Select Gender Block-->
<!--Gender Block-->
<div class="form-group">
<label class="text-black " style="font-weight: 1000; font-family:'Times New Roman', Times, serif;" for="select">Gender:</label>
<select id="select" required [(ngModel)]="user.gender" name="gender">
<option >select gender</option>
</select>
</div><br>
<!--Terms and Condition block-->
<div class="form-group checkbox">
<label>
<input type="checkbox" [(ngModel)]="user.terms" name="terms">Confirm that you have read the Terms and Conditions
</label>
</div>
<!--Buttons block-->
<div class="form-group">
<button type="reset" class="btn btn-default">Cancel</button>
<input type="submit" class="btn btn-success" [disabled]="!ContactUs.valid">
</div>
</fieldset>
</form>
<div class="login">
<h2 class="login-header">Log in</h2>
<form [formGroup]="loginForm" class="login-container" (ngSubmit)="login()">
<p [ngClass]="{'has-error': isSubmitted && formControls['email'].errors}">
<input class="form-control" type="email" placeholder="Email" formControlName="email">
</p>
<p [ngClass]="{'has-error': isSubmitted && formControls['password'].errors}">
<input class="form-control" type="password" placeholder="Password" formControlName="password">
</p>
<p>
<input type="submit" value="Log in">
</p>
</form>
</div>
</div>
</div>
</div>
</div>
<br/><br/>
<div id="back" class="container-fluid padding">
<div class="medium-12 columns">
<h3 style="text-align: center;">Fill the Form Below for Donation</h3>
<p style="text-align: center;">Share blood and give life.</p>
<br/><br/>
<div class="adjust">
<div class="row padding">
<div class="col-md-4">
<div class="form">
<div class="row expanded">
<p style="margin-left: 40px;">Donor Name*</p>
<input id="firstname" type="text" autocomplete="off" data-attribute="name" placeholder="John Smith" name="FIRST NAME" required="" aria-describedby="d0wnho-abide-error">
<label for="firstname"></label><span class="form-error" id="d0wnho-abide-error" role="alert">
</span>
</div>
</div>
</div>
<div class="col-md-4">
<div class="form">
<div class="row expanded">
<p>Email*</p>
<input id="mail" type="email" autocomplete="off" data-attribute="name" placeholder="E-mail" name="FIRST NAME" required="" aria-describedby="d0wnho-abide-error">
<label for="mail"></label><span class="form-error" id="d0wnho-abide-error" role="alert">
</span>
</div>
</div>
</div>
<div class="col-md-4">
<div class="form">
<div class="row expanded">
<p>Age*</p>
<input id="org" type="text" autocomplete="off" data-attribute="name" placeholder="age" name="FIRST NAME" required="" aria-describedby="d0wnho-abide-error">
<label for="org"></label><span class="form-error" id="d0wnho-abide-error" role="alert">
</span>
</div>
</div>
</div>
</div>
</div>
<br/>
<div class="container-fluid padding">
<div class="row padding">
<div class="col-md-4">
<div class="form">
<div class="row expanded">
<p style="margin-left: 25px;">Contact*</p>
<input id="contact" type="text" autocomplete="off" data-attribute="name" placeholder="mobile" name="FIRST NAME" required="" aria-describedby="d0wnho-abide-error">
<label for="contact"></label><span class="form-error" id="d0wnho-abide-error" role="alert">
</span>
</div>
</div>
</div>
<div class="col-md-4">
<div class="form">
<P>Blood Group*</P>
<select id="region">
<option value="Select" >Blood Group</option>
<option value="North America">A+</option>
<option value="South America">B+</option>
<option value="Europe">AB-</option>
<option value="Middle East">O+</option>
<option value="APAC">B-</option>
<option value="India">Other</option>
</select>
</div>
</div>
<div class="col-md-4">
<div class="form">
<P>Gender*</P>
<select id="enquiry">
<option value="Select" >Gender</option>
<option value="Alumni">Male</option>
<option value="Career Seekers">Female</option>
<option value="Investor Relations">Others</option>
</select>
</div>
</div>
<br/><br/>
<div class="container-fluid padding">
<div class="row padding">
<div class="col-md-12">
<div class="form">
<form style="margin-left: 14px;">
<label for="message">Address*</label>
<input type="text" id="message" name="message">
</form>
</div>
</div>
</div>
</div>
<br><br>
<div id="" class="columns large-2 medium-3 xlarge-text-right mt2 small-12">
<button href="javascript:void(0)" id="conversation_submit" data-open="" onclick="getConversationFormEmailCheck()" style="color: green;" title="SUBMIT" value="SUBMIT" data-attribute="formButtonTag" class="button submit mb0" enabled="">SUBMIT<i class="arrow-right"></i></button>
</div>
<div class="submit">
<br/><br/>
<div class="container-fluid padding">
<div class="medium-12 columns">
<h3 style="text-align: center;">Fill the Form Below for Receiving</h3>
<p style="text-align: center;">We are here to help you.</p>
<br/><br/>
<div class="adjust">
<div class="row padding">
<div class="col-md-4">
<div class="form">
<div class="row expanded">
<p style="margin-left: 40px;">Receiver Name*</p>
<input id="firstname" type="text" autocomplete="off" data-attribute="name" placeholder="John Smith" name="FIRST NAME" required="" aria-describedby="d0wnho-abide-error">
<label for="firstname"></label><span class="form-error" id="d0wnho-abide-error" role="alert">
</span>
</div>
</div>
</div>
<div class="col-md-4">
<div class="form">
<div class="row expanded">
<p>Email*</p>
<input id="mail" type="email" autocomplete="off" data-attribute="name" placeholder="E-mail" name="FIRST NAME" required="" aria-describedby="d0wnho-abide-error">
<label for="mail"></label><span class="form-error" id="d0wnho-abide-error" role="alert">
</span>
</div>
</div>
</div>
<div class="col-md-4">
<div class="form">
<div class="row expanded">
<p>Age*</p>
<input id="org" type="text" autocomplete="off" data-attribute="name" placeholder="age" name="FIRST NAME" required="" aria-describedby="d0wnho-abide-error">
<label for="org"></label><span class="form-error" id="d0wnho-abide-error" role="alert">
</span>
</div>
</div>
</div>
</div>
</div>
<br/>
<div class="container-fluid padding">
<div class="row padding">
<div class="col-md-4">
<div class="form">
<div class="row expanded">
<p style="margin-left: 25px;">Contact*</p>
<input id="contact" type="text" autocomplete="off" data-attribute="name" placeholder="mobile" name="FIRST NAME" required="" aria-describedby="d0wnho-abide-error">
<label for="contact"></label><span class="form-error" id="d0wnho-abide-error" role="alert">
</span>
</div>
</div>
</div>
<div class="col-md-4">
<div class="form">
<P>Blood Group*</P>
<select id="region">
<option value="Select" >Blood Group</option>
<option value="North America">A+</option>
<option value="South America">B+</option>
<option value="Europe">AB-</option>
<option value="Middle East">O+</option>
<option value="APAC">B-</option>
<option value="India">Other</option>
</select>
</div>
</div>
<div class="col-md-4">
<div class="form">
<P>Gender*</P>
<select id="enquiry">
<option value="Select" >Gender</option>
<option value="Alumni">Male</option>
<option value="Career Seekers">Female</option>
<option value="Investor Relations">Others</option>
</select>
</div>
</div>
<br/><br/>
<div class="container-fluid padding">
<div class="row padding">
<div class="col-md-12">
<div class="form">
<form style="margin-left: 14px;">
<label for="message">Address*</label>
<input type="text" id="message" name="message">
</form>
</div>
</div>
</div>
</div>
<br><br>
<div class="submit">
<div id="" class="columns large-2 medium-3 xlarge-text-right mt2 small-12">
<button href="javascript:void(0)" id="conversation_submit" data-open="" onclick="getConversationFormEmailCheck()" style="color: green;" title="SUBMIT" value="SUBMIT" data-attribute="formButtonTag" class="button submit mb0" enabled="">SUBMIT<i class="arrow-right"></i></button>
</div>
<div style="margin-left: 240px;" class="columns small-12">
<br>
This site is protected by reCAPTCHA and the Google <a style="color: #00aced;">Privacy Policy</a> and
<a style="color: #00aced;">Terms of Service</a> apply.
</div>
<br/>
</div>
<!--connect-->
<div style="background-color:gainsboro;" class="container-fluid padding">
<div class="row text-left padding">
<div class="col-12 social padding">
<a href="#"><i class="fab fa-linkedin"></i></a>
<a href="#"><i class="fab fa-facebook"></i></a>
<a href="#"><i class="fab fa-twitter"></i></a>
<a href="#"><i class="fab fa-instagram"></i></a>
<a href="#"><i class="fab fa-youtube"></i></a>
</div>
</div>
</div>
<br/><br/>
<!-- footer -->
<div class="f2container">
<div class ="foot1">
<ul class="myaccount">
<li><h4>LOCATIONS</h4></li>
<li><a href="#">Andhra Pradesh</a></li>
<li><a href="#">Telangana</a></li>
<li><a href="#">Uttar Pradesh</a></li>
<li><a href="#">Karnataka</a></li>
</ul>
</div>
<div class ="foot2">
<ul class="policy">
<li><h4>POLICIES</h4></li>
<li><a href="#">Payment Options</a></li>
<li><a href="#">Terms & Conditions of Use</a></li>
<li><a href="#">Terms & Conditions of Membership Program</a></li>
<li><a href="#">Privacy Policy</a></li>
<li><a href="#">Safety Checklist</a></li>
</ul>
</div>
<div class ="foot3">
<ul class="contactus">
<li><h4>CONTACT US</h4></li>
<li><a href="#">Customer Support</a></li>
<li><a href="#">Store Locators</a></li>
<li><a href="#">Help Center</a></li>
</ul>
</div>
<div class ="foot4">
<ul class="aboutus">
<li><h4>ABOUT US</h4></li>
<li><a href="#">Official Brand Store</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Careers</a></li>
</ul>
</div>
<div class ="foot5">
</div>
</div>
</body>
</html>
|
|
Notes.io is a web-based application for taking notes. You can take your notes and share with others people. If you like taking long notes, notes.io is designed for you. To date, over 8,000,000,000 notes created and continuing...
With notes.io;
- * You can take a note from anywhere and any device with internet connection.
- * You can share the notes in social platforms (YouTube, Facebook, Twitter, instagram etc.).
- * You can quickly share your contents without website, blog and e-mail.
- * You don't need to create any Account to share a note. As you wish you can use quick, easy and best shortened notes with sms, websites, e-mail, or messaging services (WhatsApp, iMessage, Telegram, Signal).
- * Notes.io has fabulous infrastructure design for a short link and allows you to share the note as an easy and understandable link.
Fast: Notes.io is built for speed and performance. You can take a notes quickly and browse your archive.
Easy: Notes.io doesn’t require installation. Just write and share note!
Short: Notes.io’s url just 8 character. You’ll get shorten link of your note when you want to share. (Ex: notes.io/q )
Free: Notes.io works for 12 years and has been free since the day it was started.
You immediately create your first note and start sharing with the ones you wish. If you want to contact us, you can use the following communication channels;
Email: [email protected]
Twitter: http://twitter.com/notesio
Instagram: http://instagram.com/notes.io
Facebook: http://facebook.com/notesio
Regards;
Notes.io Team
