go-quasar-partial-ssr/test/doctorDetail.html

196 lines
22 KiB
HTML

<!-- Page Team Single Start -->
<div class="page-doctor-single">
<div class="container">
<div class="row">
<div class="col-lg-4">
<!-- Team Single Sidebar Start -->
<div class="doctor-single-sidebar">
<!-- Team Sidebar Box Start -->
<div class="doctor-sidebar-box wow fadeInUp" style="visibility: visible; animation-name: fadeInUp;">
<!-- Team Sidebar Image Start -->
<div class="doctor-sidebar-image">
<figure class="image-anime">
<img src="./doctorDetail_files/team-1.jpg" alt="">
</figure>
</div>
<!-- Team Sidebar Image End -->
<!-- Team Sidebar Body Start -->
<div class="doctor-sidebar-body">
<ul>
<li><span>name:</span>Dr. Esther howard</li>
<li><span>position:</span>psychologist</li>
<li><span>phone:</span>+91- 123 456 7890</li>
<li><span>e-mail:</span>info@domain.com</li>
<li><span>experience:</span>16 years</li>
</ul>
</div>
<!-- Team Sidebar Body End -->
<!-- Team Sidebar Footer Start -->
<div class="doctor-sidebar-footer">
<span>follow us:</span>
<ul>
<li><a href="https://html.awaikenthemes.com/dispnsary/doctor-single.html#"><i class="fa-brands fa-x-twitter"></i></a></li>
<li><a href="https://html.awaikenthemes.com/dispnsary/doctor-single.html#"><i class="fa-brands fa-linkedin-in"></i></a></li>
<li><a href="https://html.awaikenthemes.com/dispnsary/doctor-single.html#"><i class="fa-brands fa-pinterest-p"></i></a></li>
</ul>
</div>
<!-- Team Sidebar Footer End -->
</div>
<!-- Team Sidebar Box End -->
</div>
<!-- Team Member Sidebar End -->
</div>
<div class="col-lg-8">
<!-- Team Single Content Start -->
<div class="doctor-single-content">
<div class="doctor-single-entry">
<!-- Team Member Info Start -->
<div class="doctor-member-info">
<h2 class="text-anime-style-3" data-cursor="-opaque" style="perspective: 400px;"><div class="split-line" style="display: block; text-align: start; position: relative;"><div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">P</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">e</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">r</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">s</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">o</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">n</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">a</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">l</div></div> <div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">b</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">i</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">o</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">g</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">r</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">a</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">p</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">h</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">y</div></div></div></h2>
<p class="wow fadeInUp" data-wow-delay="0.2s" style="visibility: visible; animation-delay: 0.2s; animation-name: fadeInUp;">Dr. Esther Howard is a highly experienced Psychologist with over 12 years of expertise in diagnosing and treating a wide range of eye conditions. She specializes in advanced procedures like cataract surgery, LASIK, and the management of glaucoma and retinal disorders. With a deep commitment to patient care, Dr. Carter ensures personalized treatment plans tailored to each individual's needs. Her focus on cutting-edge techniques and compassionate care has made her a trusted name in the field of ophthalmology. Whether conducting routine eye exams or performing intricate surgeries, Dr. Carter strives to enhance vision and improve the quality of life for her patients.</p>
</div>
<!-- Team Member Info End -->
<!-- Team Member Experience Start -->
<div class="doctor-member-experience">
<!-- Member Experience Info Start -->
<div class="member-experience-info">
<h2 class="text-anime-style-3" data-cursor="-opaque" style="perspective: 400px;"><div class="split-line" style="display: block; text-align: start; position: relative;"><div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">M</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">y</div></div> <div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">e</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">x</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">p</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">e</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">r</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">i</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">e</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">n</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">c</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">e</div></div></div></h2>
<div class="member-experience-info-item wow fadeInUp" style="visibility: visible; animation-name: fadeInUp;">
<h3>graduate intern - 2013 - 2020</h3>
<p>At Institution Name focused on family counseling and conflict resolution techniques.</p>
</div>
<div class="member-experience-info-item wow fadeInUp" data-wow-delay="0.2s" style="visibility: visible; animation-delay: 0.2s; animation-name: fadeInUp;">
<h3>licensed psychologist - 2020 - present</h3>
<p>At Institution Name focused on family counseling and conflict resolution techniques.</p>
</div>
</div>
<!-- Member Experience Info End -->
<!-- Team Member Skills Start -->
<div class="doctor-member-skills">
<h2 class="text-anime-style-3" data-cursor="-opaque" style="perspective: 400px;"><div class="split-line" style="display: block; text-align: start; position: relative;"><div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">M</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">y</div></div> <div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">s</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">k</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">i</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">l</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">l</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">s</div></div></div></h2>
<!-- Skills Progress Bar Start -->
<div class="skills-progress-bar">
<!-- Skill Item Start -->
<div class="skillbar" data-percent="56%">
<div class="skill-data">
<div class="skill-title">psychologist</div>
<div class="skill-no">56%</div>
</div>
<div class="skill-progress">
<div class="count-bar" style="width: 56%;"></div>
</div>
</div>
<!-- Skill Item End -->
</div>
<!-- Skills Progress Bar End -->
<!-- Skills Progress Bar Start -->
<div class="skills-progress-bar">
<!-- Skill Item Start -->
<div class="skillbar" data-percent="89%">
<div class="skill-data">
<div class="skill-title">success case</div>
<div class="skill-no">89%</div>
</div>
<div class="skill-progress">
<div class="count-bar" style="width: 89%;"></div>
</div>
</div>
<!-- Skill Item End -->
</div>
<!-- Skills Progress Bar End -->
<!-- Skills Progress Bar Start -->
<div class="skills-progress-bar">
<!-- Skill Item Start -->
<div class="skillbar" data-percent="85%">
<div class="skill-data">
<div class="skill-title">therapy specialist</div>
<div class="skill-no">85%</div>
</div>
<div class="skill-progress">
<div class="count-bar" style="width: 85%;"></div>
</div>
</div>
<!-- Skill Item End -->
</div>
<!-- Skills Progress Bar End -->
</div>
<!-- Team Member Skills End -->
</div>
<!-- Team Member Experience End -->
<!-- Team Member Expertice Start -->
<div class="doctor-member-expertise">
<h2 class="text-anime-style-3" data-cursor="-opaque" style="perspective: 400px;"><div class="split-line" style="display: block; text-align: start; position: relative;"><div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">M</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">y</div></div> <div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">e</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">x</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">p</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">e</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">r</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">t</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">i</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">s</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">e</div></div> <div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">a</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">r</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">e</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">a</div></div> <div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">&amp;</div></div> <div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">f</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">e</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">a</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">t</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">u</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">r</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">e</div></div></div></h2>
<p class="wow fadeInUp" data-wow-delay="0.2s" style="visibility: visible; animation-delay: 0.2s; animation-name: fadeInUp;">Esther specializes in cognitive-behavioral therapy (CBT), trauma recovery, and mindfulness techniques, offering tailored support for individuals dealing with anxiety, depression, and life transitions.</p>
<ul class="wow fadeInUp" data-wow-delay="0.4s" style="visibility: visible; animation-delay: 0.4s; animation-name: fadeInUp;">
<li>experienced professionals</li>
<li>client-centered approach</li>
<li>safe and confidential environment</li>
<li>commitment to growth</li>
</ul>
</div>
<!-- Team Member Expertice End -->
</div>
<!-- Doctor Contact Form Start -->
<div class="doctor-contact-form">
<!-- Section Title Start -->
<div class="section-title">
<h2 class="text-anime-style-3" data-cursor="-opaque" style="perspective: 400px;"><div class="split-line" style="display: block; text-align: start; position: relative;"><div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">G</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">e</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">t</div></div> <div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">i</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">n</div></div> <div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">t</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">o</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">u</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">c</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">h</div></div> <div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">w</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">i</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">t</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">h</div></div> <div style="position:relative;display:inline-block;"><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">m</div><div style="position: relative; display: inline-block; transform: translate(0px, 0px); opacity: 1;">e</div></div></div></h2>
</div>
<!-- Section Title End -->
<!-- Contact Form Start -->
<div class="contact-form">
<!-- Contact Form Start -->
<form id="contactForm" action="https://html.awaikenthemes.com/dispnsary/doctor-single.html#" method="POST" data-toggle="validator" class="wow fadeInUp" data-wow-delay="0.25s" novalidate="true" style="visibility: visible; animation-delay: 0.25s; animation-name: fadeInUp;">
<div class="row">
<div class="form-group col-md-12 mb-4">
<input type="text" name="name" class="form-control" id="name" placeholder="Enter Your Name" required="">
<div class="help-block with-errors"></div>
</div>
<div class="form-group col-md-6 mb-4">
<input type="email" name="email" class="form-control" id="email" placeholder="Enter Your Email" required="">
<div class="help-block with-errors"></div>
</div>
<div class="form-group col-md-6 mb-4">
<input type="text" name="phone" class="form-control" id="phone" placeholder="Enter Your Number" required="">
<div class="help-block with-errors"></div>
</div>
<div class="form-group col-md-12 mb-5">
<textarea name="message" class="form-control" id="message" rows="4" placeholder="Write Message.."></textarea>
<div class="help-block with-errors"></div>
</div>
<div class="col-md-12">
<button type="submit" class="btn-default disabled">submit now</button>
<div id="msgSubmit" class="h3 hidden"></div>
</div>
</div>
</form>
<!-- Contact Form End -->
</div>
<!-- Contact Form Start -->
</div>
<!-- Doctor Contact Form End -->
</div>
<!-- Team Single Content End -->
</div>
</div>
</div>
</div>
<!-- Page Team Single End -->