page about us & page contact us and responsive

2024-08-16 20:41:53 +03:30
parent fd3b82143b
commit d3f967ca67
22 changed files with 297 additions and 4 deletions
@@ -0,0 +1,12 @@
+import AboutUsPage from '@/components/aboutUs';
+import Layout from '@/components/layout';
+
+function AboutUs() {
+    return (
+        <Layout title='درباره ما' name='about-us'>
+            <AboutUsPage />
+        </Layout>
+    )
+}
+
+export default AboutUs
@@ -3,7 +3,7 @@ import Layout from '@/components/layout';

 function Clinics() {
    return (
-        <Layout title='کلینیک ها' name='specialties'>
+        <Layout title='کلینیک ها' name='clinics'>
            <ClinicsPage />
        </Layout>
    )
@@ -0,0 +1,30 @@
+import { TextField } from "@mui/material"
+
+function Field({ title, type, multiline, isPlaceHolder }) {
+    return (
+        <TextField
+            placeholder={isPlaceHolder && title}
+            label={!isPlaceHolder ? title : ''}
+            type={type || 'text'}
+            multiline={!!multiline}
+            rows={!!multiline ? 4 : 1}
+            className="!w-full !mx-auto !bg-[#FFF]"
+            sx={{
+                '& .MuiFormLabel-root': {
+                    top: '-4px !important'
+                },
+                '& .MuiInputBase-input': { padding: '12.5px 14px' },
+                '& .MuiInputBase-root': { borderRadius: '6px !important' },
+                '& .MuiOutlinedInput-notchedOutline': { border: '1px solid #E9ECEF !important' },
+                ".Mui-focused": {
+                    '& .MuiOutlinedInput-notchedOutline': {
+                        border: '1px solid #5559CE !important',
+                        transition: '0.5s all'
+                    }
+                }
+            }}
+        />
+    )
+}
+
+export default Field
@@ -0,0 +1,12 @@
+import ContactUsPage from '@/components/contactUs';
+import Layout from '@/components/layout';
+
+function ContactUs() {
+    return (
+        <Layout title='تماس با ما' name='contact-us'>
+            <ContactUsPage />
+        </Layout>
+    )
+}
+
+export default ContactUs
@@ -0,0 +1,18 @@
+import Image from 'next/image'
+import React from 'react'
+
+function Head() {
+    return (
+        <div className='bg-[#5559C2] rounded-lg w-full py-[24px] flex flex-col items-center justify-center gap-[16px]'>
+            <Image
+                src='/assets/images/logo-2.png'
+                height={46}
+                width={46}
+                alt='logo'
+            />
+            <p className="text-[#FAFAFA] text-[24px] font-bold">درباره نوبت ۷۲۴</p>
+        </div>
+    )
+}
+
+export default Head
@@ -0,0 +1,40 @@
+import AnimationTextHead from '@/app/component/AnimationTextHead';
+import UnderlineLG from '../icons/UnderlineLG';
+import TickOrangeA from '../icons/TickOrangeA';
+
+const ourServices = [
+    'برگزاری دوره های آنلاین',
+    'معرفی بهترین باشگاه های گردشگری',
+    'معرفی بهترین باشگاه های گردشگری',
+    'ارتباط با راهنمایان گردشگری',
+    'معرفی جاذبه های گردشگری',
+    'ارتباط با راهنمایان گردشگری',
+    'برگزاری تور ها و برنامه های متنوع',
+    'معرفی بومگردی های سراسر کشور',
+    'برگزاری تور ها و برنامه های متنوع'
+]
+
+function Services() {
+    return (
+        <div className='mt-[40px] px-[12%]'>
+            <div className='flex justify-center'>
+                <AnimationTextHead name='zoom-in-up' text='خدمات ما'>
+                    <UnderlineLG />
+                </AnimationTextHead>
+            </div>
+            <ul className='mt-[40px] grid grid-cols-3 gap-x-[72px] gap-y-[56px]'>
+                {ourServices.map((item, idx) => (
+                    <li
+                        key={idx}
+                        className='flex items-center justify-start gap-[8px]'
+                    >
+                        <TickOrangeA />
+                        <p className='text-[#525252] text-[16px] font-medium'>{item}</p>
+                    </li>
+                ))}
+            </ul>
+        </div>
+    )
+}
+
+export default Services
@@ -0,0 +1,14 @@
+import Head from "./Head";
+import Services from "./Services";
+
+function AboutUsPage() {
+    return (
+        <div className="pt-[120px] mt-[56px] padding-responsive">
+            <Head />
+            <p className="text-[#525252] text-[16px] font-normal text-center px-[15%] mt-[32px] leading-10">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد کرد، در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها، و شرایط سخت تایپ به پایان رسد و زمان مورد نیاز شامل حروفچینی دستاوردهای اصلی، و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.</p>
+            <Services />
+        </div>
+    )
+}
+
+export default AboutUsPage;
@@ -9,6 +9,7 @@ function Head() {
                    src='/assets/images/head-blogs-1.png'
                    width={600}
                    height={424}
+                    alt='head blog'
                />
                <p>روش های خانگی محافظت از پوست در تابستان</p>
            </div>
@@ -19,6 +20,7 @@ function Head() {
                            src='/assets/images/head-blogs-2.png'
                            width={600}
                            height={424}
+                            alt='head blog'
                        />
                        <p className='!text-[16px] !bottom-[20px] !right-[16px]'>فواید نوشیدن آب برای سلامتی</p>
                    </div>
@@ -27,6 +29,7 @@ function Head() {
                            src='/assets/images/head-blogs-3.png'
                            width={600}
                            height={424}
+                            alt='head blog'
                        />
                        <p className='!text-[16px] !bottom-[20px] !right-[16px]'>راهکارهای ساده برای درمان سر درد</p>
                    </div>
@@ -36,6 +39,7 @@ function Head() {
                        src='/assets/images/head-blogs-4.png'
                        width={600}
                        height={424}
+                        alt='head blog'
                    />
                    <p>تغذیه مناسب برای کاهش فشار خون</p>
                </div>
@@ -0,0 +1,45 @@
+'use client';
+
+import CallC from "../icons/CallC";
+import EmailC from "../icons/EmailC";
+import WhatsappC from "../icons/WhatsappC";
+import ContentContact from "./ContentContact";
+
+function Call() {
+
+    // const openURL = url => window.open(url);
+
+    return (
+        <div data-aos="flip-left"
+            className="lg:min-w-[calc(50%_+_70px)] bg-[#5559C2] lg:pl-[18%] h-fit pt-[16px] sm:pt-[29px] md:pt-[42px] lg:pt-[55px] 
+        bg-contact rounded-[8px] pb-[30px] sm:pb-[42px] md:pb-[55px] 
+        overflow-hidden lg:pb-[171px] px-[16px] sm:px-[27px] md:px-[39px] lg:px-[48px]">
+            <p className="text-[#FAFAFA] text-[20px] font-bold">تماس با ما</p>
+            <p
+                className="text-[#FAFAFA] leading-[26px] text-[16px] font-normal mt-6"
+            >سامانه نوبت 724 به مردم کمک می کند تا دسترسی آسان تر و سریع تری به خدمات پزشکی و درمانی داشته باشند.</p>
+            <ul className="flex flex-col mt-[68px] justify-start items-start gap-[32px]">
+                <ContentContact
+                    url='tel:900300400'
+                    text='تلفن تماس: ۰۲۱۳۶۳۵۴۵۹۸'
+                >
+                    <CallC />
+                </ContentContact>
+                <ContentContact
+                    url='https://wa.me/09124568794'
+                    text='واتساپ: ۰۹۱۲۴۵۶۸۷۹۴'
+                >
+                    <WhatsappC />
+                </ContentContact>
+                <ContentContact
+                    url='mailto:batome@gmail.com'
+                    text='ایمیل: batome@gmail.com'
+                >
+                    <EmailC />
+                </ContentContact>
+            </ul>
+        </div>
+    )
+}
+
+export default Call
@@ -0,0 +1,37 @@
+import Field from "@/app/component/Field"
+import { Button } from "@mui/material"
+import ArrowLeftC from "../icons/ArrowLeftC"
+
+function Connect() {
+    return (
+        <div
+            className="lg:min-w-[calc(50%_+_70px)] w-full lg:translate-x-[140px] bg-[#FFF] lg:p-[32px]
+                shadow-[0px_0px_28.6px_0px_rgba(147,_147,_147,_0.25)] mt-8 p-[16px] sm:p-[21px] md:p-[27px]"
+        >
+            <div data-aos="zoom-in">
+                <div className="flex flex-col justify-center items-center gap-[10px]">
+                    <p className="text-[#3B3B3B] text-[16px] font-bold">با ما در ارتباط باشید</p>
+                    <p className="text-[#525252] text-[14px] font-normal">نظرات و پیشنهادات خود را با ما در میان بگذارید.</p>
+                </div>
+                <div className="mt-[40px] flex flex-col gap-[20px]">
+                    <div className="flex flex-col sm:flex-row items-center justify-center gap-4">
+                        <Field title='نام و نام خانوادگی' type='text' />
+                        <Field title='شماره موبایل' type='text' />
+                    </div>
+                    <div>
+                        <Field title='پیام شما...' type='text' multiline={true} />
+                    </div>
+                </div>
+                <Button
+                    variant="contained"
+                    className="!mt-[40px] !py-[8px] !px-[34px] !flex !items-center !gap-[4px] !mr-auto"
+                >
+                    ارسال پیام
+                    <ArrowLeftC />
+                </Button>
+            </div>
+        </div>
+    )
+}
+
+export default Connect
@@ -0,0 +1,18 @@
+function ContentContact({ text, children, url }) {
+
+    const openURL = url => window.open(url);
+
+    return (
+        <li
+            className="flex cursor-pointer items-center justify-start gap-4"
+            onClick={() => openURL(url)}
+        >
+            <div className="p-2 rounded-[8px] bg-[#EBFAFA] grid place-items-center">
+                {children}
+            </div>
+            <p className="text-[#FFF] text-[14px] md:text-[18px] sm:text-[16px] lg:text-[20px] font-normal">{text}</p>
+        </li>
+    )
+}
+
+export default ContentContact
@@ -0,0 +1,13 @@
+import Call from "./Call"
+import Connect from "./Connect"
+
+function ContactUsPage() {
+    return (
+        <div className="w-full pt-[120px] mt-[56px] padding-responsive flex flex-col lg:flex-row items-center justify-between h-fit">
+            <Call />
+            <Connect />
+        </div>
+    )
+}
+
+export default ContactUsPage
@@ -1,3 +1,5 @@
+'use client';
+
 import { useState } from "react";
 import { Box, Button, Modal } from "@mui/material";

@@ -0,0 +1,10 @@
+function ArrowLeftC() {
+    return (
+        <svg xmlns="http://www.w3.org/2000/svg" width="21" height="20" viewBox="0 0 21 20" fill="none">
+            <path d="M8.4724 4.94168L3.41406 10L8.4724 15.0583" stroke="#EFEFEF" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
+            <path d="M17.5797 10H3.55469" stroke="#EFEFEF" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
+        </svg>
+    )
+}
+
+export default ArrowLeftC;
@@ -0,0 +1,9 @@
+function CallC() {
+    return (
+        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+            <path d="M21.97 18.33C21.97 18.69 21.89 19.06 21.72 19.42C21.55 19.78 21.33 20.12 21.04 20.44C20.55 20.98 20.01 21.37 19.4 21.62C18.8 21.87 18.15 22 17.45 22C16.43 22 15.34 21.76 14.19 21.27C13.04 20.78 11.89 20.12 10.75 19.29C9.6 18.45 8.51 17.52 7.47 16.49C6.44 15.45 5.51 14.36 4.68 13.22C3.86 12.08 3.2 10.94 2.72 9.81C2.24 8.67 2 7.58 2 6.54C2 5.86 2.12 5.21 2.36 4.61C2.6 4 2.98 3.44 3.51 2.94C4.15 2.31 4.85 2 5.59 2C5.87 2 6.15 2.06 6.4 2.18C6.66 2.3 6.89 2.48 7.07 2.74L9.39 6.01C9.57 6.26 9.7 6.49 9.79 6.71C9.88 6.92 9.93 7.13 9.93 7.32C9.93 7.56 9.86 7.8 9.72 8.03C9.59 8.26 9.4 8.5 9.16 8.74L8.4 9.53C8.29 9.64 8.24 9.77 8.24 9.93C8.24 10.01 8.25 10.08 8.27 10.16C8.3 10.24 8.33 10.3 8.35 10.36C8.53 10.69 8.84 11.12 9.28 11.64C9.73 12.16 10.21 12.69 10.73 13.22C11.27 13.75 11.79 14.24 12.32 14.69C12.84 15.13 13.27 15.43 13.61 15.61C13.66 15.63 13.72 15.66 13.79 15.69C13.87 15.72 13.95 15.73 14.04 15.73C14.21 15.73 14.34 15.67 14.45 15.56L15.21 14.81C15.46 14.56 15.7 14.37 15.93 14.25C16.16 14.11 16.39 14.04 16.64 14.04C16.83 14.04 17.03 14.08 17.25 14.17C17.47 14.26 17.7 14.39 17.95 14.56L21.26 16.91C21.52 17.09 21.7 17.3 21.81 17.55C21.91 17.8 21.97 18.05 21.97 18.33Z" stroke="#5559CE" strokeWidth="1.5" strokeMiterlimit="10" />
+        </svg>
+    )
+}
+
+export default CallC
@@ -0,0 +1,10 @@
+function EmailC() {
+    return (
+        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+            <path d="M17 20.5H7C4 20.5 2 19 2 15.5V8.5C2 5 4 3.5 7 3.5H17C20 3.5 22 5 22 8.5V15.5C22 19 20 20.5 17 20.5Z" stroke="#5559CE" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
+            <path d="M17 9L13.87 11.5C12.84 12.32 11.15 12.32 10.12 11.5L7 9" stroke="#5559CE" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
+        </svg>
+    )
+}
+
+export default EmailC
@@ -1,7 +1,7 @@
 function LinkedinB() {
    return (
        <svg className="transition-all duration-500" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18" fill="none">
-            <path d="M4.59572 2.27158C4.59921 2.71616 4.42757 3.14425 4.11792 3.46328C3.80827 3.78231 3.3855 3.96665 2.94101 3.97644C2.49745 3.96032 2.07704 3.7744 1.76668 3.4571C1.45632 3.1398 1.27974 2.71538 1.27344 2.27158C1.29261 1.83907 1.4756 1.43005 1.78529 1.12753C2.09498 0.824998 2.50817 0.651622 2.94101 0.642578C3.37257 0.651795 3.78429 0.825606 4.0919 1.12844C4.39951 1.43127 4.57975 1.84021 4.59572 2.27158ZM1.45215 7.00558C1.45215 6.02586 2.07572 6.17886 2.94101 6.17886C3.80629 6.17886 4.41701 6.02586 4.41701 7.00558V16.5507C4.41701 17.5433 3.79344 17.3401 2.94101 17.3401C2.08858 17.3401 1.45215 17.5433 1.45215 16.5507V7.00558ZM6.98844 7.00686C6.98844 6.45915 7.19158 6.25472 7.50915 6.19172C7.82801 6.12744 8.92215 6.19172 9.30401 6.19172C9.68587 6.19172 9.83887 6.81529 9.82601 7.28586C10.1526 6.84761 10.5861 6.50046 11.0852 6.27761C11.5842 6.05476 12.1321 5.96365 12.6764 6.01301C13.211 5.98037 13.7464 6.06053 14.2479 6.24828C14.7495 6.43604 15.2059 6.72718 15.5876 7.10281C15.9693 7.47845 16.2677 7.93016 16.4635 8.42863C16.6592 8.9271 16.7479 9.46116 16.7239 9.99615V16.5121C16.7239 17.5047 16.1132 17.3016 15.2466 17.3016C14.3813 17.3016 13.7706 17.5047 13.7706 16.5121V11.422C13.793 11.1601 13.7588 10.8964 13.6702 10.6488C13.5817 10.4013 13.441 10.1757 13.2575 9.9874C13.0741 9.79908 12.8523 9.65245 12.6071 9.55745C12.362 9.46246 12.0993 9.42133 11.8369 9.43686C11.5754 9.42998 11.3156 9.47874 11.0744 9.57992C10.8333 9.6811 10.6164 9.83239 10.4382 10.0238C10.2599 10.2151 10.1244 10.4422 10.0406 10.6899C9.95679 10.9376 9.92659 11.2003 9.95201 11.4606V16.5507C9.95201 17.5433 9.32844 17.3401 8.46315 17.3401C7.59787 17.3401 6.98715 17.5433 6.98715 16.5507V7.00558L6.98844 7.00686Z" stroke="#525252" stroke-linecap="round" stroke-linejoin="round" />
+            <path d="M4.59572 2.27158C4.59921 2.71616 4.42757 3.14425 4.11792 3.46328C3.80827 3.78231 3.3855 3.96665 2.94101 3.97644C2.49745 3.96032 2.07704 3.7744 1.76668 3.4571C1.45632 3.1398 1.27974 2.71538 1.27344 2.27158C1.29261 1.83907 1.4756 1.43005 1.78529 1.12753C2.09498 0.824998 2.50817 0.651622 2.94101 0.642578C3.37257 0.651795 3.78429 0.825606 4.0919 1.12844C4.39951 1.43127 4.57975 1.84021 4.59572 2.27158ZM1.45215 7.00558C1.45215 6.02586 2.07572 6.17886 2.94101 6.17886C3.80629 6.17886 4.41701 6.02586 4.41701 7.00558V16.5507C4.41701 17.5433 3.79344 17.3401 2.94101 17.3401C2.08858 17.3401 1.45215 17.5433 1.45215 16.5507V7.00558ZM6.98844 7.00686C6.98844 6.45915 7.19158 6.25472 7.50915 6.19172C7.82801 6.12744 8.92215 6.19172 9.30401 6.19172C9.68587 6.19172 9.83887 6.81529 9.82601 7.28586C10.1526 6.84761 10.5861 6.50046 11.0852 6.27761C11.5842 6.05476 12.1321 5.96365 12.6764 6.01301C13.211 5.98037 13.7464 6.06053 14.2479 6.24828C14.7495 6.43604 15.2059 6.72718 15.5876 7.10281C15.9693 7.47845 16.2677 7.93016 16.4635 8.42863C16.6592 8.9271 16.7479 9.46116 16.7239 9.99615V16.5121C16.7239 17.5047 16.1132 17.3016 15.2466 17.3016C14.3813 17.3016 13.7706 17.5047 13.7706 16.5121V11.422C13.793 11.1601 13.7588 10.8964 13.6702 10.6488C13.5817 10.4013 13.441 10.1757 13.2575 9.9874C13.0741 9.79908 12.8523 9.65245 12.6071 9.55745C12.362 9.46246 12.0993 9.42133 11.8369 9.43686C11.5754 9.42998 11.3156 9.47874 11.0744 9.57992C10.8333 9.6811 10.6164 9.83239 10.4382 10.0238C10.2599 10.2151 10.1244 10.4422 10.0406 10.6899C9.95679 10.9376 9.92659 11.2003 9.95201 11.4606V16.5507C9.95201 17.5433 9.32844 17.3401 8.46315 17.3401C7.59787 17.3401 6.98715 17.5433 6.98715 16.5507V7.00558L6.98844 7.00686Z" stroke="#525252" strokeLinecap="round" strokeLinejoin="round" />
        </svg>
    )
 }
@@ -1,7 +1,7 @@
 function MenuS() {
    return (
        <svg width="44" height="44" viewBox="0 0 44 44" fill="none" xmlns="http://www.w3.org/2000/svg">
-            <rect width="44" height="44" rx="22" fill="#FFD8C5" fill-opacity="0.5" />
+            <rect width="44" height="44" rx="22" fill="#FFD8C5" fillOpacity="0.5" />
            <path d="M27 20H29C31 20 32 19 32 17V15C32 13 31 12 29 12H27C25 12 24 13 24 15V17C24 19 25 20 27 20Z" stroke="#F17732" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
            <path d="M15 32H17C19 32 20 31 20 29V27C20 25 19 24 17 24H15C13 24 12 25 12 27V29C12 31 13 32 15 32Z" stroke="#F17732" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
            <path d="M16 20C18.2091 20 20 18.2091 20 16C20 13.7909 18.2091 12 16 12C13.7909 12 12 13.7909 12 16C12 18.2091 13.7909 20 16 20Z" stroke="#F17732" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
@@ -1,7 +1,7 @@
 function TelegramB() {
    return (
        <svg className="transition-all duration-500" xmlns="http://www.w3.org/2000/svg" width="18" height="16" viewBox="0 0 18 16" fill="none">
-            <path d="M17.4016 0.800049L0.601562 6.80005L5.40156 9.20005L12.6016 4.40005L7.80156 10.4L15.0016 15.2L17.4016 0.800049Z" stroke="#525252" stroke-linejoin="round" />
+            <path d="M17.4016 0.800049L0.601562 6.80005L5.40156 9.20005L12.6016 4.40005L7.80156 10.4L15.0016 15.2L17.4016 0.800049Z" stroke="#525252" strokeLinejoin="round" />
        </svg>
    )
 }
@@ -0,0 +1,9 @@
+function TickOrangeA() {
+    return (
+        <svg xmlns="http://www.w3.org/2000/svg" width="25" height="24" viewBox="0 0 25 24" fill="none">
+            <path d="M17.1804 10.0536L17.1805 10.0536L17.1864 10.0475C17.6605 9.55706 17.6689 8.77495 17.1804 8.28645C16.6952 7.80118 15.8986 7.80118 15.4133 8.28645L10.6269 13.0729L8.68043 11.1264C8.19517 10.6412 7.39858 10.6412 6.91332 11.1264C6.42806 11.6117 6.42806 12.4083 6.91332 12.8936L9.74332 15.7236C9.97602 15.9563 10.2928 16.09 10.6269 16.09C10.961 16.09 11.2777 15.9563 11.5104 15.7236L17.1804 10.0536ZM2.54688 12C2.54688 6.76614 6.81302 2.5 12.0469 2.5C17.2807 2.5 21.5469 6.76614 21.5469 12C21.5469 17.2339 17.2807 21.5 12.0469 21.5C6.81302 21.5 2.54688 17.2339 2.54688 12Z" fill="#F17732" stroke="#F17732" />
+        </svg>
+    )
+}
+
+export default TickOrangeA
@@ -0,0 +1,10 @@
+function WhatsappC() {
+    return (
+        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+            <path d="M6.9 20.6C8.4 21.5 10.2 22 12 22C17.5 22 22 17.5 22 12C22 6.5 17.5 2 12 2C6.5 2 2 6.5 2 12C2 13.8 2.5 15.5 3.3 17L2.44044 20.306C2.24572 21.0549 2.93892 21.7317 3.68299 21.5191L6.9 20.6Z" stroke="#5559CE" strokeWidth="1.5" strokeMiterlimit="10" strokeLinecap="round" strokeLinejoin="round" />
+            <path d="M16.5 14.8485C16.5 15.0105 16.4639 15.177 16.3873 15.339C16.3107 15.501 16.2116 15.654 16.0809 15.798C15.86 16.041 15.6167 16.2165 15.3418 16.329C15.0714 16.4415 14.7784 16.5 14.4629 16.5C14.0033 16.5 13.512 16.392 12.9937 16.1715C12.4755 15.951 11.9572 15.654 11.4434 15.2805C10.9251 14.9025 10.4339 14.484 9.9652 14.0205C9.501 13.5525 9.08187 13.062 8.70781 12.549C8.33826 12.036 8.04081 11.523 7.82449 11.0145C7.60816 10.5015 7.5 10.011 7.5 9.543C7.5 9.237 7.55408 8.9445 7.66224 8.6745C7.77041 8.4 7.94166 8.148 8.18052 7.923C8.46895 7.6395 8.78443 7.5 9.11793 7.5C9.24412 7.5 9.37031 7.527 9.48297 7.581C9.60015 7.635 9.70381 7.716 9.78493 7.833L10.8305 9.3045C10.9116 9.417 10.9702 9.5205 11.0108 9.6195C11.0513 9.714 11.0739 9.8085 11.0739 9.894C11.0739 10.002 11.0423 10.11 10.9792 10.2135C10.9206 10.317 10.835 10.425 10.7268 10.533L10.3843 10.8885C10.3348 10.938 10.3122 10.9965 10.3122 11.0685C10.3122 11.1045 10.3167 11.136 10.3257 11.172C10.3393 11.208 10.3528 11.235 10.3618 11.262C10.4429 11.4105 10.5826 11.604 10.7809 11.838C10.9837 12.072 11.2 12.3105 11.4344 12.549C11.6778 12.7875 11.9121 13.008 12.151 13.2105C12.3853 13.4085 12.5791 13.5435 12.7323 13.6245C12.7549 13.6335 12.7819 13.647 12.8135 13.6605C12.8495 13.674 12.8856 13.6785 12.9261 13.6785C13.0028 13.6785 13.0613 13.6515 13.1109 13.602L13.4534 13.2645C13.5661 13.152 13.6743 13.0665 13.7779 13.0125C13.8816 12.9495 13.9852 12.918 14.0979 12.918C14.1835 12.918 14.2737 12.936 14.3728 12.9765C14.472 13.017 14.5756 13.0755 14.6883 13.152L16.18 14.2095C16.2972 14.2905 16.3783 14.385 16.4279 14.4975C16.473 14.61 16.5 14.7225 16.5 14.8485Z" stroke="#5559CE" strokeWidth="1.5" strokeMiterlimit="10" />
+        </svg>
+    )
+}
+
+export default WhatsappC