admin/cmc-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
Dhanraj
2024-09-28 20:48:18 +05:30
commit 8c4706dfde
930 changed files with 74928 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
src/app/root/root.component.css Normal file
View File

529
src/app/root/root.component.html Normal file
View File

@ -0,0 +1,529 @@
<div>
<section class="relative">
<div class="h-[750px] lg:h-[828px]">
<img src="/assets/cmc/ranipet-Kannigapuram-2022-06-15-main-entrance-signsWA-1.jpeg" class="h-full w-full object-cover" alt="" />
</div>
<div
class="absolute inset-0 z-[1] opacity-70"
style="background: linear-gradient(90deg, rgba(8, 17, 31, 0.95) 57.29%, rgba(8, 17, 31, 0.4) 100%)"
></div>
<div class="absolute inset-x-0 top-1/3 z-[1] -translate-y-1/2 text-white sm:top-1/2">
<div class="container">
<div class="max-w-[624px] text-center ltr:md:text-left rtl:md:text-right">
<h2 class="text-4xl font-black sm:text-5xl md:text-[70px] md:leading-[88px]">
<span class="text-secondary">Christian</span> Medical College, <span class="text-primary">Vellore</span>
</h2>
<p class="mt-4 text-lg font-semibold">
seeks to be a witness to the healing ministry of Christ, through excellence in education, service and research.
</p>
<!-- <button type="button" class="btn mt-8 bg-white py-[19px] px-8 text-black hover:bg-black hover:text-white md:mt-[60px]">BOOK Now</button> -->
</div>
</div>
</div>
<!-- <div class="absolute inset-x-0 bottom-0 z-[1] bg-black/50">
<div class="container">
<div class="book-form grid grid-cols-2 gap-4 py-8 sm:grid-cols-4 xl:grid-cols-5" data-aos="fade-up" data-aos-duration="1000">
<div class="relative">
<input
type="date"
placeholder="Check in"
class="h-14 w-full rounded-[20px] border-2 border-white bg-transparent py-[18px] px-4 font-semibold text-white outline-none placeholder:text-white"
/>
</div>
<div class="relative">
<input
type="date"
placeholder="Check out"
class="h-14 w-full rounded-[20px] border-2 border-white bg-transparent py-[18px] px-4 font-semibold text-white outline-none placeholder:text-white"
/>
</div>
<div class="relative">
<select
class="h-14 w-full appearance-none rounded-[20px] border-2 border-white bg-transparent py-3 font-semibold text-white outline-none ltr:pl-4 ltr:pr-10 rtl:pr-4 rtl:pl-10"
>
<option class="text-black">Adult</option>
<option class="text-black">1</option>
<option class="text-black">2</option>
<option class="text-black">3</option>
<option class="text-black">4</option>
</select>
<span class="absolute top-1/2 -translate-y-1/2 ltr:right-2.5 rtl:left-2.5">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M19 9L12 15L10.25 13.5M5 9L7.33333 11"
stroke="white"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</span>
</div>
<div class="relative">
<select
class="h-14 w-full appearance-none rounded-[20px] border-2 border-white bg-transparent py-3 font-semibold text-white outline-none ltr:pl-4 ltr:pr-10 rtl:pr-4 rtl:pl-10"
>
<option class="text-black">Children</option>
<option class="text-black">1</option>
<option class="text-black">2</option>
<option class="text-black">3</option>
<option class="text-black">4</option>
</select>
<span class="absolute top-1/2 -translate-y-1/2 ltr:right-2.5 rtl:left-2.5">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M19 9L12 15L10.25 13.5M5 9L7.33333 11"
stroke="white"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</span>
</div>
<div class="col-span-2 mx-auto sm:mx-0 xl:col-span-1">
<button type="button" class="btn bg-secondary py-[18px] text-white">Check Availability</button>
</div>
</div>
</div>
</div> -->
</section>
<section class="bg-[url(/assets/images/construction/services-bg-img.png)] bg-cover bg-center bg-no-repeat py-12 lg:py-24">
<div class="container">
<div class="heading text-center">
<h4 class="!font-black">Ranipet <span class="text-primary"> Campus
</span></h4>
<h6 class="mx-auto mt-2 max-w-[663px] !font-medium !text-gray dark:!text-white">
Level 1 Trauma Care Facility at Ranipet Campuss
</h6>
</div>
<div class="grid grid-cols-1 justify-between gap-10 sm:grid-cols-2 md:gap-16 lg:grid-cols-2" data-aos="fade-up" data-aos-duration="1000">
<div>
<span>
<svg class="h-[60px] w-[60px]" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_189_777)">
<path
d="M20.4 2.40002C16.4391 2.40002 13.2 5.63909 13.2 9.60002C13.2 11.9813 14.3719 14.1 16.1625 15.4125C15.2016 15.8953 14.325 16.5188 13.575 17.2875C12.7031 16.9782 11.775 16.8 10.8 16.8C6.17343 16.8 2.4 20.5735 2.4 25.2C2.4 28.1391 3.92343 30.75 6.225 32.25C2.55937 33.9844 -3.54272e-06 37.6969 -3.54272e-06 42V47.4C-0.00469104 47.7844 0.178121 48.1453 0.487496 48.375C0.487496 48.375 1.33593 48.975 2.9625 49.4625C4.58906 49.95 7.10156 50.4 10.8 50.4C14.4984 50.4 17.0109 49.95 18.6375 49.4625C18.8484 49.4016 19.0172 49.3407 19.2 49.275V54.6C19.1953 54.9844 19.3781 55.3453 19.6875 55.575C19.6875 55.575 20.5359 56.175 22.1625 56.6625C23.7891 57.15 26.3016 57.6 30 57.6C33.6984 57.6 36.2109 57.15 37.8375 56.6625C39.4641 56.175 40.3125 55.575 40.3125 55.575C40.6219 55.3453 40.8047 54.9844 40.8 54.6V49.275C40.9828 49.3407 41.1516 49.4016 41.3625 49.4625C42.9891 49.95 45.5016 50.4 49.2 50.4C52.8984 50.4 55.4109 49.95 57.0375 49.4625C58.6641 48.975 59.5125 48.375 59.5125 48.375C59.8219 48.1453 60.0047 47.7844 60 47.4V42C60 37.6969 57.4406 33.9844 53.775 32.25C56.0766 30.75 57.6 28.1391 57.6 25.2C57.6 20.5735 53.8266 16.8 49.2 16.8C48.1547 16.8 47.1609 17.011 46.2375 17.3625C45.4828 16.5703 44.5922 15.9094 43.6125 15.4125C45.4031 14.1 46.575 11.9813 46.575 9.60002C46.575 5.63909 43.3359 2.40002 39.375 2.40002C35.4141 2.40002 32.175 5.63909 32.175 9.60002C32.175 11.9813 33.3469 14.1 35.1375 15.4125C32.3812 16.7719 30.3656 19.3875 29.8875 22.5375C29.4094 19.3828 27.3984 16.7672 24.6375 15.4125C26.4281 14.1 27.6 11.9813 27.6 9.60002C27.6 5.63909 24.3609 2.40002 20.4 2.40002ZM20.4 4.80002C23.0672 4.80002 25.2 6.93284 25.2 9.60002C25.2 12.2672 23.0672 14.4 20.4 14.4C17.7328 14.4 15.6 12.2672 15.6 9.60002C15.6 6.93284 17.7328 4.80002 20.4 4.80002ZM39.375 4.80002C42.0422 4.80002 44.175 6.93284 44.175 9.60002C44.175 12.2672 42.0422 14.4 39.375 14.4C36.7078 14.4 34.575 12.2672 34.575 9.60002C34.575 6.93284 36.7078 4.80002 39.375 4.80002ZM20.4 16.8C24.4453 16.8 27.6 19.9547 27.6 24V24.375C24.15 25.4203 21.6 28.6172 21.6 32.4C21.6 35.3391 23.1234 37.95 25.425 39.45C23.9203 40.1625 22.6312 41.2078 21.6 42.4875V42C21.6 37.6969 19.0406 33.9844 15.375 32.25C17.6766 30.75 19.2 28.1391 19.2 25.2C19.2 22.4625 17.8641 20.025 15.825 18.4875C17.0719 17.4235 18.6187 16.8 20.4 16.8ZM39.375 16.8C41.2078 16.8 42.8016 17.4422 44.0625 18.5625C42.0844 20.1 40.8 22.5141 40.8 25.2C40.8 28.1391 42.3234 30.75 44.625 32.25C40.9594 33.9844 38.4 37.6969 38.4 42V42.4875C37.3687 41.2078 36.0797 40.1625 34.575 39.45C36.8766 37.95 38.4 35.3391 38.4 32.4C38.4 28.5328 35.7469 25.2657 32.175 24.3V24C32.175 19.9547 35.3297 16.8 39.375 16.8ZM10.8 19.2C11.7328 19.2 12.6 19.425 13.3875 19.8C15.4031 20.7657 16.8 22.8047 16.8 25.2C16.8 28.5282 14.1281 31.2 10.8 31.2C7.47187 31.2 4.8 28.5282 4.8 25.2C4.8 21.8719 7.47187 19.2 10.8 19.2ZM49.2 19.2C52.5281 19.2 55.2 21.8719 55.2 25.2C55.2 28.5282 52.5281 31.2 49.2 31.2C45.8719 31.2 43.2 28.5282 43.2 25.2C43.2 22.9828 44.3859 21.0657 46.1625 20.025C46.1719 20.0203 46.1906 20.0297 46.2 20.025C46.3781 19.9875 46.5422 19.9125 46.6875 19.8C46.7297 19.7813 46.7578 19.7438 46.8 19.725C46.8234 19.7157 46.8516 19.7016 46.875 19.6875C47.5922 19.3828 48.3703 19.2 49.2 19.2ZM30 26.4C33.3281 26.4 36 29.0719 36 32.4C36 35.7282 33.3281 38.4 30 38.4C26.6719 38.4 24 35.7282 24 32.4C24 29.0719 26.6719 26.4 30 26.4ZM10.8 33.6C15.4266 33.6 19.2 37.3735 19.2 42V46.6125C19.0219 46.7203 18.9516 46.8422 17.9625 47.1375C16.5891 47.55 14.3016 48 10.8 48C7.29843 48 5.01093 47.55 3.6375 47.1375C2.64843 46.8422 2.57812 46.7203 2.4 46.6125V42C2.4 37.3735 6.17343 33.6 10.8 33.6ZM49.2 33.6C53.8266 33.6 57.6 37.3735 57.6 42V46.6125C57.4219 46.7203 57.3516 46.8422 56.3625 47.1375C54.9891 47.55 52.7016 48 49.2 48C45.6984 48 43.4109 47.55 42.0375 47.1375C41.0484 46.8422 40.9781 46.7203 40.8 46.6125V42C40.8 37.3735 44.5734 33.6 49.2 33.6ZM30 40.8C34.6266 40.8 38.4 44.5735 38.4 49.2V53.8125C38.2219 53.9203 38.1516 54.0422 37.1625 54.3375C35.7891 54.75 33.5016 55.2 30 55.2C26.4984 55.2 24.2109 54.75 22.8375 54.3375C21.8484 54.0422 21.7781 53.9203 21.6 53.8125V49.2C21.6 44.5735 25.3734 40.8 30 40.8Z"
fill="#47BDFF"
/>
</g>
<defs>
<clipPath id="clip0_189_777">
<rect width="60" height="60" fill="white" />
</clipPath>
</defs>
</svg>
</span>
<a
href="javascript:"
class="relative inline-block py-5 text-2xl font-bold text-secondary transition line-clamp-1 hover:text-primary sm:py-8"
>
Over 100 years experience
<span
class="absolute top-1/2 -translate-y-1/2 text-[64px] font-extrabold text-black/[0.05] ltr:left-0 rtl:right-0 dark:text-white/[0.05]"
>01</span
>
</a>
<p class="text-lg font-medium">The Level 1 Trauma Care Facility with dedicated ambulance entry has started functioning at the CMC Vellore Ranipet Campus.The facility is located on the ground floor of Block D, co-located with the Cardiac Care Unit. It includes an Emergency Bay, 6 state-of-the-art trauma operation theatres, a radiology suite and 112 ward & ICU beds.</p>
</div>
<div>
<span>
<svg class="h-[60px] w-[60px]" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_189_771)">
<path
d="M15.6 2.40002C13.6266 2.40002 12 4.02659 12 6.00002C12 6.15471 12.0282 6.3094 12.0891 6.45471C11.311 6.16409 10.4766 6.00002 9.60002 6.00002C5.63909 6.00002 2.40002 9.23909 2.40002 13.2C2.40002 17.9344 6.30471 22.2094 9.9469 25.8938C11.7703 27.736 13.5703 29.4188 14.8688 30.825C15.5203 31.5235 16.0453 32.161 16.3735 32.6625C16.7063 33.1688 16.8 33.5391 16.8 33.6C16.8 34.2797 16.2797 34.8 15.6 34.8C15.1688 34.7953 14.7656 35.0203 14.5453 35.3953C14.3297 35.7703 14.3297 36.2297 14.5453 36.6047C14.7656 36.9797 15.1688 37.2047 15.6 37.2C16.8844 37.2 18.0141 36.5016 18.6516 35.475C19.8891 38.8782 21.3516 41.8266 23.1 44.025C23.7469 44.8453 24.4547 45.5625 25.2 46.1625V50.4H21.6C18.3 50.4 15.6 53.1 15.6 56.4V57.6H43.2V55.2L44.4 56.4C44.4 53.1 41.7 50.4 38.4 50.4H34.8V46.0969C35.5172 45.5157 36.1922 44.8266 36.825 44.0438C38.5875 41.836 40.0735 38.8688 41.3297 35.4422C41.9625 36.4875 43.1016 37.2 44.4 37.2C44.8313 37.2047 45.2344 36.9797 45.4547 36.6047C45.6703 36.2297 45.6703 35.7703 45.4547 35.3953C45.2344 35.0203 44.8313 34.7953 44.4 34.8C43.7203 34.8 43.2 34.2797 43.2 33.6C43.2 33.5391 43.2938 33.1688 43.6266 32.6625C43.9547 32.161 44.4797 31.5235 45.1313 30.825C46.4297 29.4188 48.2297 27.736 50.0532 25.8938C53.6953 22.2094 57.6 17.9344 57.6 13.2C57.6 9.23909 54.361 6.00002 50.4 6.00002C49.5235 6.00002 48.6891 6.16409 47.911 6.45471C47.9719 6.3094 48 6.15471 48 6.00002C48 4.02659 46.3735 2.40002 44.4 2.40002H15.6ZM15.6 4.80002H44.4C45.0797 4.80002 45.6 5.32034 45.6 6.00002C45.6 6.67971 45.0797 7.20003 44.4 7.20003H15.6C14.9203 7.20003 14.4 6.67971 14.4 6.00002C14.4 5.32034 14.9203 4.80002 15.6 4.80002ZM9.60002 8.40002C12.2578 8.40002 14.386 10.5235 14.4 13.1766C14.4 13.2 14.4 13.2235 14.4 13.2469C14.4047 13.2797 14.4047 13.3078 14.4047 13.336C14.7235 18.8203 15.5391 24.3657 16.8 29.386C16.7391 29.3203 16.6922 29.2594 16.6313 29.1938C15.2297 27.6844 13.4297 26.0063 11.6532 24.2063C8.09534 20.611 4.80002 16.5047 4.80002 13.2C4.80002 10.5375 6.93752 8.40002 9.60002 8.40002ZM50.4 8.40002C53.0625 8.40002 55.2 10.5375 55.2 13.2C55.2 16.5047 51.9047 20.611 48.3469 24.2063C46.5703 26.0063 44.7703 27.6844 43.3688 29.1938C43.2985 29.2688 43.2422 29.3391 43.1719 29.4188C44.4375 24.4172 45.2672 18.886 45.586 13.4063C45.5953 13.336 45.6 13.2703 45.6 13.2C45.6 10.5375 47.7375 8.40002 50.4 8.40002ZM16.7438 9.60002H43.2563C43.1297 18 41.761 26.9672 39.361 33.8578C38.1094 37.4625 36.5907 40.4953 34.95 42.5438C33.3094 44.5922 31.6407 45.6 29.9578 45.6C28.2703 45.6 26.611 44.5875 24.975 42.5297C23.3438 40.4766 21.8344 37.4344 20.5922 33.8203C18.2156 26.9203 16.8657 17.9532 16.7438 9.60002ZM29.6297 15.6C29.5266 16.275 28.7672 18.4735 25.4391 18.4735V20.836H28.8938V30H32.4V15.6H29.6297ZM32.4 47.5219V50.4H27.6V47.55C28.3547 47.8313 29.1375 48 29.9578 48C30.8063 48 31.6172 47.8219 32.4 47.5219ZM21.6 52.8H26.1985C26.3297 52.8235 26.461 52.8235 26.5875 52.8H33.3985C33.5297 52.8235 33.661 52.8235 33.7875 52.8H38.4C39.9328 52.8 40.9828 53.8641 41.5078 55.2H18.4922C19.0172 53.8641 20.0672 52.8 21.6 52.8Z"
fill="#47BDFF"
/>
</g>
<defs>
<clipPath id="clip0_189_771">
<rect width="60" height="60" fill="white" />
</clipPath>
</defs>
</svg>
</span>
<a
href="javascript:"
class="relative inline-block py-5 text-2xl font-bold text-secondary transition line-clamp-1 hover:text-primary sm:py-8"
>
Consecutive award winning
<span
class="absolute top-1/2 -translate-y-1/2 text-[64px] font-extrabold text-black/[0.05] ltr:left-0 rtl:right-0 dark:text-white/[0.05]"
>02</span
>
</a>
<p class="text-lg font-medium">Trauma is an unforeseen incident which is life or limb threatening. The immediate commencement of trauma care is important for life and limb saving. In this Context the Department of trauma surgery commits itself to offer quality services towards Primary assessment and surgical interventions for the Injured Victim in a comprehensive manner. The subsequent review and follow-up as Outpatient services.</p>
</div>
</div>
</div>
</section>
<app-root-about-us [isShown]="false"> </app-root-about-us>
<!-- <section class="relative py-12 lg:py-24">
<img src="/assets/images/hotel-resort/services1.svg" class="absolute bottom-0 ltr:left-0 rtl:right-0 rtl:rotate-y-180" alt="" />
<img src="/assets/images/hotel-resort/services2.svg" class="absolute bottom-0 ltr:right-0 rtl:left-0 rtl:rotate-y-180" alt="" />
<div class="container relative">
<div class="heading text-center">
<h4 class="!text-primary">Facilities & Services</h4>
<p class="mt-2.5 text-base font-semibold">With our service you may enjoy the finest life in our resort.</p>
</div>
<div class="mt-10 grid grid-cols-1 gap-[30px] sm:grid-cols-2 lg:grid-cols-4" data-aos="zoom-in" data-aos-duration="1000">
<div
class="group rounded-2xl border-2 border-dashed border-gray-dark/20 bg-white p-[30px] pl-5 duration-200 hover:border-secondary hover:bg-secondary/20 dark:border-white/20 dark:bg-gray-dark dark:hover:bg-secondary/20"
>
<span class="flex h-[60px] w-[60px] items-center justify-center rounded-full bg-secondary/10 group-hover:bg-black">
<svg width="35" height="26" viewBox="0 0 35 26" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M17.5557 24.0002H17.5777" stroke="#B476E5" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" />
<path
d="M12.3706 18.8155C13.7458 17.4408 15.6107 16.6685 17.5552 16.6685C19.4997 16.6685 21.3646 17.4408 22.7397 18.8155"
stroke="#B476E5"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M7.18481 13.6292C8.54672 12.2672 10.1636 11.1868 11.943 10.4497C13.7225 9.71263 15.6297 9.33325 17.5558 9.33325C19.4819 9.33325 21.3891 9.71263 23.1685 10.4497C24.948 11.1868 26.5648 12.2672 27.9267 13.6292"
stroke="#B476E5"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M2 8.4445C10.5908 -0.148167 24.5202 -0.148167 33.1661 8.4445"
stroke="#B476E5"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</span>
<h3 class="mt-5 text-xl font-bold text-black dark:text-white">High Speed Wifi</h3>
<p class="mt-2.5 text-base font-medium leading-8">Lorem ipsum dolor sit amet consectetur adipiscing elit ugue quam diam.</p>
</div>
<div
class="group rounded-2xl border-2 border-dashed border-gray-dark/20 bg-white p-[30px] pl-5 duration-200 hover:border-secondary hover:bg-secondary/20 dark:border-white/20 dark:bg-gray-dark dark:hover:bg-secondary/20"
>
<span class="flex h-[60px] w-[60px] items-center justify-center rounded-full bg-secondary/10 group-hover:bg-black">
<svg width="34" height="26" viewBox="0 0 34 26" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M8.76865 23.9999C10.6379 23.9999 12.1533 22.4846 12.1533 20.6153C12.1533 18.7461 10.6379 17.2307 8.76865 17.2307C6.89938 17.2307 5.38403 18.7461 5.38403 20.6153C5.38403 22.4846 6.89938 23.9999 8.76865 23.9999Z"
stroke="#B476E5"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M25.692 23.9999C27.5613 23.9999 29.0766 22.4846 29.0766 20.6153C29.0766 18.7461 27.5613 17.2307 25.692 17.2307C23.8227 17.2307 22.3074 18.7461 22.3074 20.6153C22.3074 22.4846 23.8227 23.9999 25.692 23.9999Z"
stroke="#B476E5"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M5.38461 20.6154H2V10.4615M2 10.4615L5.38461 2H20.6154L27.3846 10.4615M2 10.4615H27.3846M27.3846 10.4615H29.0769C29.9746 10.4615 30.8354 10.8181 31.4702 11.4529C32.1049 12.0876 32.4615 12.9485 32.4615 13.8461V20.6154H29.0769M22.3077 20.6154H12.1538M17.2308 10.4615V2"
stroke="#B476E5"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</span>
<h3 class="mt-5 text-xl font-bold text-black dark:text-white">Pick & Drop Facility</h3>
<p class="mt-2.5 text-base font-medium leading-8">Lorem ipsum dolor sit amet consectetur adipiscing elit ugue quam diam.</p>
</div>
<div
class="group rounded-2xl border-2 border-dashed border-gray-dark/20 bg-white p-[30px] pl-5 duration-200 hover:border-secondary hover:bg-secondary/20 dark:border-white/20 dark:bg-gray-dark dark:hover:bg-secondary/20"
>
<span class="flex h-[60px] w-[60px] items-center justify-center rounded-full bg-secondary/10 group-hover:bg-black">
<svg width="27" height="26" viewBox="0 0 27 26" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M22.7059 7.17651H4.58824C3.15879 7.17651 2 8.33531 2 9.76475V21.4118C2 22.8413 3.15879 24.0001 4.58824 24.0001H22.7059C24.1353 24.0001 25.2941 22.8413 25.2941 21.4118V9.76475C25.2941 8.33531 24.1353 7.17651 22.7059 7.17651Z"
stroke="#B476E5"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path d="M18.8232 2L13.6467 7.17648L8.47021 2" stroke="#B476E5" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" />
<path d="M17.5293 7.17651V24.0001" stroke="#B476E5" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" />
<path d="M21.4116 17.5293V17.5428" stroke="#B476E5" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" />
<path d="M21.4116 13.647V13.6605" stroke="#B476E5" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" />
</svg>
</span>
<h3 class="mt-5 text-xl font-bold text-black dark:text-white">Smart TV</h3>
<p class="mt-2.5 text-base font-medium leading-8">Lorem ipsum dolor sit amet consectetur adipiscing elit ugue quam diam.</p>
</div>
<div
class="group rounded-2xl border-2 border-dashed border-gray-dark/20 bg-white p-[30px] pl-5 duration-200 hover:border-secondary hover:bg-secondary/20 dark:border-white/20 dark:bg-gray-dark dark:hover:bg-secondary/20"
>
<span class="flex h-[60px] w-[60px] items-center justify-center rounded-full bg-secondary/10 group-hover:bg-black">
<svg width="36" height="20" viewBox="0 0 36 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M25.1097 5.55525C26.0914 5.55525 26.8873 4.75938 26.8873 3.77763C26.8873 2.79587 26.0914 2 25.1097 2C24.1279 2 23.332 2.79587 23.332 3.77763C23.332 4.75938 24.1279 5.55525 25.1097 5.55525Z"
stroke="#B476E5"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M7.33203 7.33309L14.4425 3.77783L20.6642 9.11071L17.9978 12.666"
stroke="#B476E5"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
/>
<path
d="M2 17.5549C2.55336 17.83 3.15989 17.9817 3.77763 17.9993C4.47001 18.0138 5.15551 17.8595 5.77492 17.5498C6.39434 17.2401 6.92906 16.7843 7.33288 16.2217C7.7367 15.6591 8.27142 15.2032 8.89084 14.8935C9.51025 14.5838 10.1958 14.4295 10.8881 14.4441C11.5805 14.4295 12.266 14.5838 12.8854 14.8935C13.5049 15.2032 14.0396 15.6591 14.4434 16.2217C14.8472 16.7843 15.3819 17.2401 16.0013 17.5498C16.6208 17.8595 17.3063 18.0138 17.9986 17.9993C18.691 18.0138 19.3765 17.8595 19.9959 17.5498C20.6154 17.2401 21.1501 16.7843 21.5539 16.2217C21.9577 15.6591 22.4924 15.2032 23.1118 14.8935C23.7313 14.5838 24.4168 14.4295 25.1091 14.4441C25.8015 14.4295 26.487 14.5838 27.1064 14.8935C27.7259 15.2032 28.2606 15.6591 28.6644 16.2217C29.0682 16.7843 29.6029 17.2401 30.2224 17.5498C30.8418 17.8595 31.5273 18.0138 32.2197 17.9993C32.8374 17.9817 33.4439 17.83 33.9973 17.5549"
stroke="#B476E5"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</span>
<h3 class="mt-5 text-xl font-bold text-black dark:text-white">Swimming Pool</h3>
<p class="mt-2.5 text-base font-medium leading-8">Lorem ipsum dolor sit amet consectetur adipiscing elit ugue quam diam.</p>
</div>
</div>
<div class="text-center">
<a routerLink="/services" class="btn mt-7 bg-secondary py-[18px] px-8 text-white">More Services</a>
</div>
</div>
</section> -->
<section
class="relative bg-[url(/assets/images/hotel-resort/counter-bg.jpg)] bg-cover bg-fixed bg-center bg-no-repeat after:absolute after:inset-0 after:bg-black/90"
>
<div class="container">
<div class="relative z-[1] grid grid-cols-2 gap-5 py-12 text-center sm:gap-7 md:grid-cols-4 lg:py-24" data-aos="fade-up" data-aos-duration="1000">
<div class="rounded-2xl bg-white/25 p-[5px]">
<div class="rounded-2xl bg-white py-10 dark:bg-black">
<div
[countUp]="25000"
[options]="{startVal :0 ,duration: 10,suffix: '+',enableScrollSpy:true,scrollSpyOnce : true}"
[reanimateOnClick]="false"
class="text-[34px] font-black leading-[42px] text-gray"
>
{{0}}
</div>
<p class="text-base font-bold text-black dark:text-white">Booking Month</p>
</div>
</div>
<div class="rounded-2xl bg-white/25 p-[5px]">
<div class="rounded-2xl bg-white py-10 dark:bg-black">
<div
[countUp]="3000"
[options]="{startVal :0 ,duration: 10,suffix: '+',enableScrollSpy:true,scrollSpyOnce : true}"
[reanimateOnClick]="false"
class="text-[34px] font-black leading-[42px] text-gray"
>
{{0}}
</div>
<p class="text-base font-bold text-black dark:text-white">Visitors daily</p>
</div>
</div>
<div class="rounded-2xl bg-white/25 p-[5px]">
<div class="rounded-2xl bg-white py-10 dark:bg-black">
<div
[countUp]="10000"
[options]="{startVal :0 ,duration: 10,suffix: '+',enableScrollSpy:true,scrollSpyOnce : true}"
[reanimateOnClick]="false"
class="text-[34px] font-black leading-[42px] text-gray"
>
{{0}}
</div>
<p class="text-base font-bold text-black dark:text-white">Positive feedback</p>
</div>
</div>
<div class="rounded-2xl bg-white/25 p-[5px]">
<div class="rounded-2xl bg-white py-10 dark:bg-black">
<div
[countUp]="2000"
[options]="{startVal :0 ,duration: 10,suffix: '+',enableScrollSpy:true,scrollSpyOnce : true}"
[reanimateOnClick]="false"
class="text-[34px] font-black leading-[42px] text-gray"
>
{{0}}
</div>
<p class="text-base font-bold text-black dark:text-white">Awards & honors</p>
</div>
</div>
</div>
</div>
</section>
<section class="py-12 dark:bg-gray-dark lg:py-24">
<div class="container">
<div class="relative z-10 lg:flex">
<div class="heading text-center lg:mb-0 lg:w-1/3 ltr:lg:pr-10 ltr:lg:text-left rtl:lg:pl-10 rtl:lg:text-right">
<h6>Get In Touch.</h6>
<h4 class="sm:!leading-[50px]">Ready to Get Started?</h4>
<div class="mx-auto mt-5 max-w-[330px] overflow-hidden" data-aos="fade-right" data-aos-duration="1000">
<img src="/assets/images/hotel-resort/frame.svg" alt="" class="w-full" />
</div>
</div>
<form action="" class="rounded-3xl bg-white px-4 py-12 dark:bg-[#101626] lg:w-2/3 lg:px-8">
<div class="grid gap-10 sm:grid-cols-2">
<div class="relative">
<input
type="text"
name="name"
class="w-full rounded-2xl border-2 border-gray/20 bg-transparent p-4 font-bold outline-none transition focus:border-secondary ltr:pr-12 rtl:pl-12"
/>
<label for="" class="absolute -top-3 bg-white px-2 font-bold ltr:left-6 rtl:right-6 dark:bg-[#101626] dark:text-white"
>Full Name</label
>
<svg
width="20"
height="22"
viewBox="0 0 20 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
class="absolute top-1/2 -translate-y-1/2 ltr:right-4 rtl:left-4 dark:text-white"
>
<path
d="M5.42855 5.57875C5.42855 8.10348 7.47525 10.1502 9.99998 10.1502C12.5247 10.1502 14.5714 8.10348 14.5714 5.57875C14.5714 3.05402 12.5247 1.00732 9.99998 1.00732"
stroke="currentColor"
stroke-width="1.8"
stroke-linecap="round"
/>
<path
d="M2 16.9328C2 15.9495 2.61812 15.0724 3.5441 14.7417V14.7417C7.71891 13.2507 12.2811 13.2507 16.4559 14.7417V14.7417C17.3819 15.0724 18 15.9495 18 16.9328V18.7014C18 19.9185 16.922 20.8535 15.7172 20.6813L13.8184 20.4101C11.2856 20.0483 8.71435 20.0483 6.18162 20.4101L4.28284 20.6813C3.07798 20.8535 2 19.9185 2 18.7014V16.9328Z"
stroke="currentColor"
stroke-width="1.8"
/>
</svg>
</div>
<div class="relative">
<input
type="email"
name="email"
class="w-full rounded-2xl border-2 border-gray/20 bg-transparent p-4 font-bold outline-none transition focus:border-secondary ltr:pr-12 rtl:pl-12"
/>
<label for="" class="absolute -top-3 bg-white px-2 font-bold ltr:left-6 rtl:right-6 dark:bg-[#101626] dark:text-white"
>Email Address</label
>
<svg
width="22"
height="21"
viewBox="0 0 22 21"
fill="none"
xmlns="http://www.w3.org/2000/svg"
class="absolute top-1/2 -translate-y-1/2 ltr:right-4 rtl:left-4 dark:text-white"
>
<path
d="M1 8.00732V7.00732C1 4.2459 3.23858 2.00732 6 2.00732H16C18.7614 2.00732 21 4.2459 21 7.00732V13.0073C21 15.7687 18.7614 18.0073 16 18.0073H6C3.23858 18.0073 1 15.7687 1 13.0073V12.0073"
stroke="currentColor"
stroke-width="1.8"
stroke-linecap="round"
/>
<path
d="M5 7.00732L9.8 10.6073C10.5111 11.1407 11.4889 11.1407 12.2 10.6073L17 7.00732"
stroke="currentColor"
stroke-width="1.8"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
</div>
<div class="relative">
<input
type="text"
name="mobile"
class="w-full rounded-2xl border-2 border-gray/20 bg-transparent p-4 font-bold outline-none transition focus:border-secondary ltr:pr-12 rtl:pl-12"
/>
<label for="" class="absolute -top-3 bg-white px-2 font-bold ltr:left-6 rtl:right-6 dark:bg-[#101626] dark:text-white"
>Mobile Number</label
>
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
class="absolute top-1/2 -translate-y-1/2 ltr:right-4 rtl:left-4 dark:text-white"
>
<path
d="M6.45241 1.40806C5.45292 0.783702 4.14202 0.887138 3.2983 1.73086L1.86856 3.1606C-0.302899 5.33207 1.73747 10.8931 6.42586 15.5815C11.1142 20.2699 16.6753 22.3102 18.8467 20.1388L20.2765 18.709C21.2635 17.722 21.2374 16.0956 20.2182 15.0764L18.0036 12.8619C16.9844 11.8426 15.358 11.8165 14.371 12.8036L14.0639 13.1107C13.531 13.6436 12.6713 13.6957 12.0713 13.2005C11.4925 12.7229 10.9159 12.208 10.3576 11.6497C9.79933 11.0914 9.28441 10.5149 8.80678 9.93607C8.31161 9.33601 8.36374 8.47631 8.89666 7.9434L9.20375 7.63631C9.98187 6.85819 10.1303 5.68271 9.65898 4.72062"
stroke="currentColor"
stroke-width="1.8"
stroke-linecap="round"
/>
</svg>
</div>
<div class="relative">
<input
type="text"
name="city"
class="w-full rounded-2xl border-2 border-gray/20 bg-transparent p-4 font-bold outline-none transition focus:border-secondary ltr:pr-12 rtl:pl-12"
/>
<label for="" class="absolute -top-3 bg-white px-2 font-bold ltr:left-6 rtl:right-6 dark:bg-[#101626] dark:text-white">City</label>
<svg
width="20"
height="22"
viewBox="0 0 20 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
class="absolute top-1/2 -translate-y-1/2 ltr:right-4 rtl:left-4 dark:text-white"
>
<path
d="M5.89416 2.31259C7.20149 1.48625 8.75475 1.00732 10.4211 1.00732C15.0719 1.00732 18.8421 4.73828 18.8421 9.34066C18.8421 15.0541 12.1053 21.0073 10.4211 21.0073C8.73684 21.0073 2 15.0541 2 9.34066C2 7.87581 2.38193 6.49924 3.05263 5.30315"
stroke="currentColor"
stroke-width="1.8"
stroke-linecap="round"
/>
<path
d="M13.4571 9.77392C13.5365 9.49702 13.579 9.20456 13.579 8.90216C13.579 7.15811 12.1651 5.74427 10.4211 5.74427C8.67702 5.74427 7.26318 7.15811 7.26318 8.90216C7.26318 10.6462 8.67702 12.0601 10.4211 12.0601C10.6633 12.0601 10.8991 12.0328 11.1256 11.9812"
stroke="currentColor"
stroke-width="1.8"
stroke-linecap="round"
/>
</svg>
</div>
</div>
<div class="relative mt-10">
<input
type="text"
name="message"
class="w-full rounded-2xl border-2 border-gray/20 bg-transparent p-4 font-bold outline-none transition focus:border-secondary ltr:pr-12 rtl:pl-12"
/>
<label for="" class="absolute -top-3 bg-white px-2 font-bold ltr:left-6 rtl:right-6 dark:bg-[#101626] dark:text-white">Message</label>
<svg
width="22"
height="22"
viewBox="0 0 22 22"
fill="none"
xmlns="http://www.w3.org/2000/svg"
class="absolute top-1/2 -translate-y-1/2 ltr:right-4 rtl:left-4 dark:text-white"
>
<path
d="M1 11.467V18.9267C1 19.7652 1.96993 20.2314 2.6247 19.7076L5.45217 17.4456C5.8068 17.1619 6.24742 17.0073 6.70156 17.0073H16C18.7614 17.0073 21 14.7687 21 12.0073V6.00732C21 3.2459 18.7614 1.00732 16 1.00732H6C3.23858 1.00732 1 3.2459 1 6.00732V7.62225"
stroke="currentColor"
stroke-width="1.8"
stroke-linecap="round"
/>
<circle cx="6.05005" cy="9.05713" r="1.25" fill="currentColor" />
<circle cx="11.05" cy="9.05713" r="1.25" fill="currentColor" />
<circle cx="16.05" cy="9.05713" r="1.25" fill="currentColor" />
</svg>
</div>
<div class="mt-10 text-center ltr:lg:text-right rtl:lg:text-left">
<button type="button" class="btn bg-gray px-12 capitalize text-white dark:bg-white dark:text-black dark:hover:bg-secondary">
Send Message
</button>
</div>
</form>
</div>
</div>
</section>
</div>

23
src/app/root/root.component.spec.ts Normal file
View File

@ -0,0 +1,23 @@
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { RootComponent } from './root.component';
describe('RootComponent', () => {
let component: RootComponent;
let fixture: ComponentFixture<RootComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ RootComponent ]
})
.compileComponents();
fixture = TestBed.createComponent(RootComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

42
src/app/root/root.component.ts Normal file
View File

@ -0,0 +1,42 @@
import { Component } from '@angular/core';
import { Lightbox, LightboxConfig } from 'ngx-lightbox';
@Component({
moduleId: module.id,
selector: 'app-root',
templateUrl: './root.component.html',
styleUrls: ['./root.component.css']
})
export class RootComponent {
activeTab = 'cozy-room';
items = [
{ src: '/assets/images/hotel-resort/room1.jpg', thumb: '/assets/images/hotel-resort/room1.jpg', type: 'delux-room' },
{ src: '/assets/images/hotel-resort/room2.jpg', thumb: '/assets/images/hotel-resort/room2.jpg', type: 'delux-room' },
{ src: '/assets/images/hotel-resort/room3.jpg', thumb: '/assets/images/hotel-resort/room3.jpg', type: 'cozy-room' },
{ src: '/assets/images/hotel-resort/room4.jpg', thumb: '/assets/images/hotel-resort/room4.jpg', type: 'family-suit' },
{ src: '/assets/images/hotel-resort/room5.jpg', thumb: '/assets/images/hotel-resort/room5.jpg', type: 'family-suit' },
{ src: '/assets/images/hotel-resort/room6.jpg', thumb: '/assets/images/hotel-resort/room6.jpg', type: 'modern-room' },
];
constructor(private _lightbox: Lightbox, private _lightboxConfig: LightboxConfig) {
_lightboxConfig.enableTransition = false;
_lightboxConfig.wrapAround = true;
_lightboxConfig.showImageNumberLabel = true;
_lightboxConfig.showZoom = true;
_lightboxConfig.showRotate = true;
_lightboxConfig.albumLabel = '%1 of %2';
_lightboxConfig.positionFromTop = 0;
_lightboxConfig.disableScrolling = true;
}
open(img: string): void {
// open lightbox
const index = this.getItems().findIndex((d) => d.src.toLowerCase().includes(img.toLowerCase()));
this._lightbox.open(this.getItems(), index);
}
getItems() {
if (this.activeTab.toLowerCase() === 'cozy-room') {
return this.items;
}
const imgs = this.items.filter((d) => d.type.toLowerCase() === this.activeTab.toLowerCase()) || [];
return imgs;
}
}