login select completed
|
|
@ -0,0 +1,21 @@
|
||||||
|
{
|
||||||
|
"$schema": "https://ui.shadcn.com/schema.json",
|
||||||
|
"style": "new-york",
|
||||||
|
"rsc": true,
|
||||||
|
"tsx": true,
|
||||||
|
"tailwind": {
|
||||||
|
"config": "tailwind.config.ts",
|
||||||
|
"css": "src/app/globals.css",
|
||||||
|
"baseColor": "zinc",
|
||||||
|
"cssVariables": true,
|
||||||
|
"prefix": ""
|
||||||
|
},
|
||||||
|
"aliases": {
|
||||||
|
"components": "@/components",
|
||||||
|
"utils": "@/lib/utils",
|
||||||
|
"ui": "@/components/ui",
|
||||||
|
"lib": "@/lib",
|
||||||
|
"hooks": "@/hooks"
|
||||||
|
},
|
||||||
|
"iconLibrary": "lucide"
|
||||||
|
}
|
||||||
33
package.json
|
|
@ -9,16 +9,39 @@
|
||||||
"lint": "next lint"
|
"lint": "next lint"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"react": "19.0.0-rc-66855b96-20241106",
|
"@hookform/resolvers": "^3.9.1",
|
||||||
"react-dom": "19.0.0-rc-66855b96-20241106",
|
"@radix-ui/react-avatar": "^1.1.1",
|
||||||
"next": "15.0.3"
|
"@radix-ui/react-dialog": "^1.1.2",
|
||||||
|
"@radix-ui/react-label": "^2.1.0",
|
||||||
|
"@radix-ui/react-popover": "^1.1.2",
|
||||||
|
"@radix-ui/react-scroll-area": "^1.2.1",
|
||||||
|
"@radix-ui/react-slot": "^1.1.0",
|
||||||
|
"@radix-ui/react-switch": "^1.1.1",
|
||||||
|
"@radix-ui/react-toast": "^1.2.2",
|
||||||
|
"class-variance-authority": "^0.7.1",
|
||||||
|
"clsx": "^2.1.1",
|
||||||
|
"cmdk": "^1.0.0",
|
||||||
|
"flatpickr": "^4.6.13",
|
||||||
|
"lucide-react": "^0.462.0",
|
||||||
|
"next": "15.0.3",
|
||||||
|
"next-crypto": "^1.0.8",
|
||||||
|
"next-themes": "^0.4.3",
|
||||||
|
"react": "^18.3.1",
|
||||||
|
"react-apexcharts": "^1.6.0",
|
||||||
|
"react-dom": "^18.3.1",
|
||||||
|
"react-hook-form": "^7.53.2",
|
||||||
|
"react-phone-number-input": "^3.4.9",
|
||||||
|
"sonner": "^1.7.0",
|
||||||
|
"tailwind-merge": "^2.5.5",
|
||||||
|
"tailwindcss-animate": "^1.0.7",
|
||||||
|
"zod": "^3.23.8"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"typescript": "^5",
|
|
||||||
"@types/node": "^20",
|
"@types/node": "^20",
|
||||||
"@types/react": "^18",
|
"@types/react": "^18",
|
||||||
"@types/react-dom": "^18",
|
"@types/react-dom": "^18",
|
||||||
"postcss": "^8",
|
"postcss": "^8",
|
||||||
"tailwindcss": "^3.4.1"
|
"tailwindcss": "^3.4.1",
|
||||||
|
"typescript": "^5"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1 @@
|
||||||
|
<svg fill="none" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M14.5 13.5V5.41a1 1 0 0 0-.3-.7L9.8.29A1 1 0 0 0 9.08 0H1.5v13.5A2.5 2.5 0 0 0 4 16h8a2.5 2.5 0 0 0 2.5-2.5m-1.5 0v-7H8v-5H3v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1M9.5 5V2.12L12.38 5zM5.13 5h-.62v1.25h2.12V5zm-.62 3h7.12v1.25H4.5zm.62 3h-.62v1.25h7.12V11z" clip-rule="evenodd" fill="#666" fill-rule="evenodd"/></svg>
|
||||||
|
After Width: | Height: | Size: 391 B |
|
|
@ -0,0 +1 @@
|
||||||
|
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.27 14.1a6.5 6.5 0 0 0 3.67-3.45q-1.24.21-2.7.34-.31 1.83-.97 3.1M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m.48-1.52a7 7 0 0 1-.96 0H7.5a4 4 0 0 1-.84-1.32q-.38-.89-.63-2.08a40 40 0 0 0 3.92 0q-.25 1.2-.63 2.08a4 4 0 0 1-.84 1.31zm2.94-4.76q1.66-.15 2.95-.43a7 7 0 0 0 0-2.58q-1.3-.27-2.95-.43a18 18 0 0 1 0 3.44m-1.27-3.54a17 17 0 0 1 0 3.64 39 39 0 0 1-4.3 0 17 17 0 0 1 0-3.64 39 39 0 0 1 4.3 0m1.1-1.17q1.45.13 2.69.34a6.5 6.5 0 0 0-3.67-3.44q.65 1.26.98 3.1M8.48 1.5l.01.02q.41.37.84 1.31.38.89.63 2.08a40 40 0 0 0-3.92 0q.25-1.2.63-2.08a4 4 0 0 1 .85-1.32 7 7 0 0 1 .96 0m-2.75.4a6.5 6.5 0 0 0-3.67 3.44 29 29 0 0 1 2.7-.34q.31-1.83.97-3.1M4.58 6.28q-1.66.16-2.95.43a7 7 0 0 0 0 2.58q1.3.27 2.95.43a18 18 0 0 1 0-3.44m.17 4.71q-1.45-.12-2.69-.34a6.5 6.5 0 0 0 3.67 3.44q-.65-1.27-.98-3.1" fill="#666"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h16v16H0z"/></clipPath></defs></svg>
|
||||||
|
After Width: | Height: | Size: 1.0 KiB |
|
After Width: | Height: | Size: 138 KiB |
|
After Width: | Height: | Size: 1.3 KiB |
|
|
@ -0,0 +1,14 @@
|
||||||
|
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<circle cx="24" cy="24" r="24" fill="#EEF0F2"/>
|
||||||
|
<g clip-path="url(#clip0_38_23844)">
|
||||||
|
<path d="M36.0002 24.2661C36.0147 23.4411 35.9278 22.6174 35.7414 21.8128H24.2451V26.2661H30.9933C30.8655 27.0469 30.5778 27.7943 30.1476 28.4634C29.7174 29.1324 29.1536 29.7093 28.49 30.1593L28.4665 30.3085L32.1016 33.0681L32.3533 33.0928C34.6661 30.9994 35.9997 27.9193 35.9997 24.2661" fill="#4285F4"/>
|
||||||
|
<path d="M24.2449 36C27.5509 36 30.3264 34.9332 32.3539 33.0932L28.4898 30.1597C27.4559 30.8666 26.0681 31.36 24.2449 31.36C22.6965 31.3511 21.1902 30.8646 19.9398 29.9695C18.6894 29.0744 17.7584 27.8161 17.2789 26.3732L17.1354 26.3852L13.3556 29.2518L13.3062 29.3865C14.3241 31.3747 15.8864 33.0463 17.8183 34.2142C19.7502 35.3822 21.9755 36.0005 24.2454 36" fill="#34A853"/>
|
||||||
|
<path d="M17.2788 26.3733C17.011 25.6094 16.8728 24.8077 16.8697 24C16.8746 23.1936 17.0077 22.393 17.2642 21.6267L17.2574 21.4677L13.4312 18.5549L13.3061 18.6133C12.4473 20.2842 12 22.129 12 23.9999C12 25.8708 12.4473 27.7156 13.3061 29.3865L17.2788 26.3733Z" fill="#FBBC05"/>
|
||||||
|
<path d="M24.2449 16.64C25.9995 16.6133 27.6964 17.2537 28.9796 18.4267L32.4355 15.12C30.219 13.0822 27.2838 11.9642 24.2449 12C21.975 11.9995 19.7497 12.6177 17.8179 13.7856C15.886 14.9535 14.3237 16.625 13.3057 18.6132L17.2652 21.6267C17.7495 20.1841 18.6836 18.9268 19.9358 18.0321C21.1881 17.1374 22.6953 16.6505 24.2449 16.64Z" fill="#EB4335"/>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip0_38_23844">
|
||||||
|
<rect width="24" height="24" fill="white" transform="translate(12 12)"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.6 KiB |
|
|
@ -0,0 +1,4 @@
|
||||||
|
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<circle cx="24" cy="24.0001" r="24" fill="#2B96F0"/>
|
||||||
|
<path d="M33.0375 17.7376L34.4625 15.9376C34.875 15.4501 34.9875 15.0751 35.025 14.8876C33.9 15.5626 32.85 15.7876 32.175 15.7876H31.9125L31.7625 15.6376C30.8625 14.8501 29.7375 14.4376 28.5375 14.4376C25.9125 14.4376 23.85 16.6126 23.85 19.1251C23.85 19.2751 23.85 19.5001 23.8875 19.6501L24 20.4001L23.2125 20.3626C18.4125 20.2126 14.475 16.0876 13.8375 15.3751C12.7875 17.2501 13.3875 19.0501 14.025 20.1751L15.3 22.2751L13.275 21.1501C13.3125 22.7251 13.9125 23.9626 15.075 24.8626L16.0875 25.6126L15.075 26.0251C15.7125 27.9376 17.1375 28.7251 18.1875 29.0251L19.575 29.4001L18.2625 30.3001C16.1625 31.8001 13.5375 31.6876 12.375 31.5751C14.7375 33.2251 17.55 33.6001 19.5 33.6001C20.9625 33.6001 22.05 33.4501 22.3125 33.3376C32.8125 30.8626 33.3 21.4876 33.3 19.6126V19.3501L33.525 19.2001C34.8 18.0001 35.325 17.3626 35.625 16.9876C35.5125 17.0251 35.3625 17.1001 35.2125 17.1376L33.0375 17.7376Z" fill="white"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.1 KiB |
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<circle cx="24" cy="24.0001" r="24" fill="#212529"/>
|
||||||
|
<g clip-path="url(#clip0_38_23867)">
|
||||||
|
<path d="M24 12.6751C17.625 12.6751 12.375 17.8501 12.375 24.3001C12.375 29.4001 15.7125 33.7501 20.3625 35.3251C20.9625 35.4376 21.15 35.0626 21.15 34.8001C21.15 34.5376 21.15 33.7876 21.1125 32.7751C17.8875 33.5251 17.2125 31.2001 17.2125 31.2001C16.6875 29.8876 15.9 29.5126 15.9 29.5126C14.85 28.7626 15.9375 28.7626 15.9375 28.7626C17.1 28.8001 17.7375 29.9626 17.7375 29.9626C18.75 31.7626 20.475 31.2376 21.1125 30.9001C21.225 30.1501 21.525 29.6251 21.8625 29.3251C19.3125 29.0626 16.575 28.0501 16.575 23.6251C16.575 22.3501 17.0625 21.3376 17.775 20.5501C17.6625 20.2876 17.25 19.0876 17.8875 17.4751C17.8875 17.4751 18.9 17.1751 21.1125 18.6751C22.05 18.4126 23.025 18.2626 24.0375 18.2626C25.05 18.2626 26.0625 18.3751 26.9625 18.6751C29.175 17.2126 30.15 17.4751 30.15 17.4751C30.7875 19.0501 30.4125 20.2876 30.2625 20.5501C31.0125 21.3376 31.4625 22.3876 31.4625 23.6251C31.4625 28.0501 28.725 29.0626 26.175 29.3251C26.5875 29.7001 26.9625 30.4501 26.9625 31.5001C26.9625 33.0751 26.925 34.3126 26.925 34.6876C26.925 34.9876 27.15 35.3251 27.7125 35.2126C32.2875 33.6751 35.625 29.3626 35.625 24.2251C35.5875 17.8501 30.375 12.6751 24 12.6751Z" fill="white"/>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip0_38_23867">
|
||||||
|
<rect width="24" height="24" fill="white" transform="translate(12 12.0001)"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.5 KiB |
|
|
@ -0,0 +1,4 @@
|
||||||
|
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<circle cx="24" cy="24.0002" r="24" fill="#4DC1FF"/>
|
||||||
|
<path d="M35.625 18.6002C35.5125 20.8877 33.9375 24.0002 30.8625 27.9377C27.7125 32.0627 25.0125 34.1252 22.8375 34.1252C21.525 34.1252 20.3625 32.9252 19.3875 30.3752C18.75 28.1252 18.1875 25.8002 17.5125 23.4752C16.8375 21.0002 16.0875 19.7252 15.225 19.7252C15.075 19.7252 14.4375 20.1002 13.3875 20.8502L12.375 19.3502C13.5375 18.3377 14.6625 17.3252 15.825 16.2752C17.3625 14.9627 18.45 14.2502 19.275 14.2127C21.075 14.0627 22.1625 15.3377 22.6125 17.9252C23.025 20.7752 23.3625 22.5752 23.55 23.2502C24.075 25.6127 24.675 26.7752 25.2375 26.7752C25.725 26.7752 26.4375 26.0252 27.45 24.4877C28.4625 22.9502 28.9125 21.7502 29.025 20.9627C29.175 19.6502 28.6125 18.9377 27.45 18.9377C26.925 18.9377 26.325 19.0502 25.7625 19.3502C26.8875 15.6002 29.025 13.7627 32.25 13.8377C34.6125 13.9502 35.7375 15.5252 35.625 18.6002Z" fill="white"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1001 B |
|
|
@ -0,0 +1,11 @@
|
||||||
|
<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<circle cx="24" cy="24.0002" r="24" fill="#3162C9"/>
|
||||||
|
<g clip-path="url(#clip0_38_23887)">
|
||||||
|
<path d="M25.789 35.9983V25.0533H29.3269L29.8566 20.7878H25.789V18.0645C25.789 16.8295 26.1192 15.9879 27.8248 15.9879L30 15.9868V12.1719C29.6236 12.1201 28.3325 12.004 26.8304 12.004C23.6942 12.004 21.5471 13.9917 21.5471 17.6422V20.7879H18V25.0534H21.547V35.9984L25.789 35.9983Z" fill="white"/>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip0_38_23887">
|
||||||
|
<rect width="12" height="24" fill="white" transform="translate(18 12.0002)"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 631 B |
|
After Width: | Height: | Size: 402 KiB |
|
After Width: | Height: | Size: 457 KiB |
|
After Width: | Height: | Size: 392 KiB |
|
After Width: | Height: | Size: 256 KiB |
|
After Width: | Height: | Size: 402 KiB |
|
After Width: | Height: | Size: 427 KiB |
|
|
@ -0,0 +1,33 @@
|
||||||
|
<svg width="21" height="14" viewBox="0 0 21 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g clip-path="url(#clip0_22_27)">
|
||||||
|
<path d="M18.4739 0.411499H1.55556C0.696446 0.411499 0 1.10794 0 1.96705V12.1893C0 13.0484 0.696446 13.7449 1.55556 13.7449H18.4739C19.333 13.7449 20.0295 13.0484 20.0295 12.1893V1.96705C20.0295 1.10794 19.333 0.411499 18.4739 0.411499Z" fill="white"/>
|
||||||
|
<mask id="mask0_22_27" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="21" height="14">
|
||||||
|
<path d="M18.4739 0.411499H1.55556C0.696446 0.411499 0 1.10794 0 1.96705V12.1893C0 13.0484 0.696446 13.7449 1.55556 13.7449H18.4739C19.333 13.7449 20.0295 13.0484 20.0295 12.1893V1.96705C20.0295 1.10794 19.333 0.411499 18.4739 0.411499Z" fill="white"/>
|
||||||
|
</mask>
|
||||||
|
<g mask="url(#mask0_22_27)">
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M20.0295 0.411499H0V1.30039H20.0295V0.411499ZM20.0295 2.18928H0V3.07817H20.0295V2.18928ZM0 3.96705H20.0295V4.85594H0V3.96705ZM20.0295 5.74484H0V6.63372H20.0295V5.74484ZM0 7.52262H20.0295V8.41152H0V7.52262ZM20.0295 9.30037H0V10.1893H20.0295V9.30037ZM0 11.0781H20.0295V11.9671H0V11.0781ZM20.0295 12.856H0V13.7448H20.0295V12.856Z" fill="#D02F44"/>
|
||||||
|
<path d="M8.5841 0.411499H0V6.63372H8.5841V0.411499Z" fill="#46467F"/>
|
||||||
|
<g filter="url(#filter0_d_22_27)">
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M1.9074 1.74479C1.9074 1.99026 1.69389 2.18924 1.43051 2.18924C1.16713 2.18924 0.953613 1.99026 0.953613 1.74479C0.953613 1.49933 1.16713 1.30035 1.43051 1.30035C1.69389 1.30035 1.9074 1.49933 1.9074 1.74479ZM3.81497 1.74479C3.81497 1.99026 3.60146 2.18924 3.33809 2.18924C3.0747 2.18924 2.86119 1.99026 2.86119 1.74479C2.86119 1.49933 3.0747 1.30035 3.33809 1.30035C3.60146 1.30035 3.81497 1.49933 3.81497 1.74479ZM5.24566 2.18924C5.50903 2.18924 5.72255 1.99026 5.72255 1.74479C5.72255 1.49933 5.50903 1.30035 5.24566 1.30035C4.98228 1.30035 4.76876 1.49933 4.76876 1.74479C4.76876 1.99026 4.98228 2.18924 5.24566 2.18924ZM7.63012 1.74479C7.63012 1.99026 7.41661 2.18924 7.15322 2.18924C6.88985 2.18924 6.67634 1.99026 6.67634 1.74479C6.67634 1.49933 6.88985 1.30035 7.15322 1.30035C7.41661 1.30035 7.63012 1.49933 7.63012 1.74479ZM2.3843 3.07812C2.64768 3.07812 2.86119 2.87914 2.86119 2.63368C2.86119 2.38822 2.64768 2.18924 2.3843 2.18924C2.12092 2.18924 1.9074 2.38822 1.9074 2.63368C1.9074 2.87914 2.12092 3.07812 2.3843 3.07812ZM4.76876 2.63368C4.76876 2.87914 4.55525 3.07812 4.29187 3.07812C4.02849 3.07812 3.81497 2.87914 3.81497 2.63368C3.81497 2.38822 4.02849 2.18924 4.29187 2.18924C4.55525 2.18924 4.76876 2.38822 4.76876 2.63368ZM6.19944 3.07812C6.46282 3.07812 6.67634 2.87914 6.67634 2.63368C6.67634 2.38822 6.46282 2.18924 6.19944 2.18924C5.93606 2.18924 5.72255 2.38822 5.72255 2.63368C5.72255 2.87914 5.93606 3.07812 6.19944 3.07812ZM7.63012 3.52257C7.63012 3.76804 7.41661 3.96702 7.15322 3.96702C6.88985 3.96702 6.67634 3.76804 6.67634 3.52257C6.67634 3.27711 6.88985 3.07814 7.15322 3.07814C7.41661 3.07814 7.63012 3.27711 7.63012 3.52257ZM5.24566 3.96702C5.50903 3.96702 5.72255 3.76804 5.72255 3.52257C5.72255 3.27711 5.50903 3.07814 5.24566 3.07814C4.98228 3.07814 4.76876 3.27711 4.76876 3.52257C4.76876 3.76804 4.98228 3.96702 5.24566 3.96702ZM3.81497 3.52257C3.81497 3.76804 3.60146 3.96702 3.33809 3.96702C3.0747 3.96702 2.86119 3.76804 2.86119 3.52257C2.86119 3.27711 3.0747 3.07814 3.33809 3.07814C3.60146 3.07814 3.81497 3.27711 3.81497 3.52257ZM1.43051 3.96702C1.69389 3.96702 1.9074 3.76804 1.9074 3.52257C1.9074 3.27711 1.69389 3.07814 1.43051 3.07814C1.16713 3.07814 0.953613 3.27711 0.953613 3.52257C0.953613 3.76804 1.16713 3.96702 1.43051 3.96702ZM2.86119 4.41146C2.86119 4.65692 2.64768 4.8559 2.3843 4.8559C2.12092 4.8559 1.9074 4.65692 1.9074 4.41146C1.9074 4.166 2.12092 3.96702 2.3843 3.96702C2.64768 3.96702 2.86119 4.166 2.86119 4.41146ZM4.29187 4.8559C4.55525 4.8559 4.76876 4.65692 4.76876 4.41146C4.76876 4.166 4.55525 3.96702 4.29187 3.96702C4.02849 3.96702 3.81497 4.166 3.81497 4.41146C3.81497 4.65692 4.02849 4.8559 4.29187 4.8559ZM6.67634 4.41146C6.67634 4.65692 6.46282 4.8559 6.19944 4.8559C5.93606 4.8559 5.72255 4.65692 5.72255 4.41146C5.72255 4.166 5.93606 3.96702 6.19944 3.96702C6.46282 3.96702 6.67634 4.166 6.67634 4.41146ZM7.15322 5.74479C7.41661 5.74479 7.63012 5.54581 7.63012 5.30035C7.63012 5.05489 7.41661 4.8559 7.15322 4.8559C6.88985 4.8559 6.67634 5.05489 6.67634 5.30035C6.67634 5.54581 6.88985 5.74479 7.15322 5.74479ZM5.72255 5.30035C5.72255 5.54581 5.50903 5.74479 5.24566 5.74479C4.98228 5.74479 4.76876 5.54581 4.76876 5.30035C4.76876 5.05489 4.98228 4.8559 5.24566 4.8559C5.50903 4.8559 5.72255 5.05489 5.72255 5.30035ZM3.33809 5.74479C3.60146 5.74479 3.81497 5.54581 3.81497 5.30035C3.81497 5.05489 3.60146 4.8559 3.33809 4.8559C3.0747 4.8559 2.86119 5.05489 2.86119 5.30035C2.86119 5.54581 3.0747 5.74479 3.33809 5.74479ZM1.9074 5.30035C1.9074 5.54581 1.69389 5.74479 1.43051 5.74479C1.16713 5.74479 0.953613 5.54581 0.953613 5.30035C0.953613 5.05489 1.16713 4.8559 1.43051 4.8559C1.69389 4.8559 1.9074 5.05489 1.9074 5.30035Z" fill="url(#paint0_linear_22_27)"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<filter id="filter0_d_22_27" x="-3.04639" y="-1.69965" width="14.6765" height="12.4445" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||||
|
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||||
|
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||||
|
<feOffset dy="1"/>
|
||||||
|
<feGaussianBlur stdDeviation="2"/>
|
||||||
|
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.06 0"/>
|
||||||
|
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_22_27"/>
|
||||||
|
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_22_27" result="shape"/>
|
||||||
|
</filter>
|
||||||
|
<linearGradient id="paint0_linear_22_27" x1="0.953613" y1="1.30035" x2="0.953613" y2="5.74479" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop stop-color="white"/>
|
||||||
|
<stop offset="1" stop-color="#F0F0F0"/>
|
||||||
|
</linearGradient>
|
||||||
|
<clipPath id="clip0_22_27">
|
||||||
|
<rect width="20.2222" height="14" fill="white"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 5.9 KiB |
|
|
@ -0,0 +1,18 @@
|
||||||
|
<svg width="21" height="14" viewBox="0 0 21 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g clip-path="url(#clip0_22_42)">
|
||||||
|
<path d="M18.4773 0.605957H1.55545C0.803726 0.605957 0.194336 1.21535 0.194336 1.96707V12.1893C0.194336 12.941 0.803726 13.5504 1.55545 13.5504H18.4773C19.229 13.5504 19.8384 12.941 19.8384 12.1893V1.96707C19.8384 1.21535 19.229 0.605957 18.4773 0.605957Z" fill="white" stroke="#F3F4F6" stroke-width="0.5"/>
|
||||||
|
<mask id="mask0_22_42" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="-1" y="0" width="22" height="14">
|
||||||
|
<path d="M18.4773 0.605957H1.55545C0.803726 0.605957 0.194336 1.21535 0.194336 1.96707V12.1893C0.194336 12.941 0.803726 13.5504 1.55545 13.5504H18.4773C19.229 13.5504 19.8384 12.941 19.8384 12.1893V1.96707C19.8384 1.21535 19.229 0.605957 18.4773 0.605957Z" fill="white" stroke="white" stroke-width="0.5"/>
|
||||||
|
</mask>
|
||||||
|
<g mask="url(#mask0_22_42)">
|
||||||
|
<path d="M20.0328 0.411499H14.3091V13.7449H20.0328V0.411499Z" fill="#FF3131"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 13.7448H5.72372V0.411499H0V13.7448Z" fill="#FF3131"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.5736 6.51591C11.388 6.68884 11.0901 6.51985 11.1433 6.27182L11.4473 4.85581L10.4933 5.30026L10.0163 3.96692L9.53936 5.30026L8.58542 4.85581L8.8893 6.27182C8.94257 6.51985 8.64468 6.68884 8.45911 6.51591L8.2852 6.35383C8.18556 6.26105 8.03125 6.26105 7.9317 6.35383L7.63144 6.63358L6.67749 6.18915L7.15446 7.07803L6.88105 7.3328C6.77103 7.43532 6.77103 7.60963 6.88105 7.71215L8.10841 8.85584H9.53936L9.77783 10.1891H10.2548L10.4933 8.85584H11.9243L13.1516 7.71215C13.2617 7.60963 13.2617 7.43532 13.1516 7.3328L12.8782 7.07803L13.3551 6.18915L12.4012 6.63358L12.101 6.35383C12.0014 6.26105 11.847 6.26105 11.7475 6.35383L11.5736 6.51591Z" fill="#FF3131"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip0_22_42">
|
||||||
|
<rect width="20.2222" height="14" fill="white"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.9 KiB |
|
|
@ -0,0 +1,17 @@
|
||||||
|
<svg width="21" height="14" viewBox="0 0 21 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g clip-path="url(#clip0_22_57)">
|
||||||
|
<path d="M18.4773 0.605957H1.55545C0.803726 0.605957 0.194336 1.21535 0.194336 1.96707V12.1893C0.194336 12.941 0.803726 13.5504 1.55545 13.5504H18.4773C19.229 13.5504 19.8384 12.941 19.8384 12.1893V1.96707C19.8384 1.21535 19.229 0.605957 18.4773 0.605957Z" fill="white" stroke="#F3F4F6" stroke-width="0.5"/>
|
||||||
|
<mask id="mask0_22_57" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="-1" y="0" width="22" height="14">
|
||||||
|
<path d="M18.4773 0.605957H1.55545C0.803726 0.605957 0.194336 1.21535 0.194336 1.96707V12.1893C0.194336 12.941 0.803726 13.5504 1.55545 13.5504H18.4773C19.229 13.5504 19.8384 12.941 19.8384 12.1893V1.96707C19.8384 1.21535 19.229 0.605957 18.4773 0.605957Z" fill="white" stroke="white" stroke-width="0.5"/>
|
||||||
|
</mask>
|
||||||
|
<g mask="url(#mask0_22_57)">
|
||||||
|
<path d="M20.0331 0.411499H13.3555V13.7449H20.0331V0.411499Z" fill="#F44653"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 13.7448H6.67767V0.411499H0V13.7448Z" fill="#1035BB"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip0_22_57">
|
||||||
|
<rect width="20.2222" height="14" fill="white"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.2 KiB |
|
|
@ -0,0 +1,17 @@
|
||||||
|
<svg width="21" height="14" viewBox="0 0 21 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g clip-path="url(#clip0_22_71)">
|
||||||
|
<path d="M18.4738 0.60614H1.55545C0.803726 0.60614 0.194336 1.21553 0.194336 1.96725V12.1895C0.194336 12.9412 0.803726 13.5506 1.55545 13.5506H18.4738C19.2255 13.5506 19.8349 12.9412 19.8349 12.1895V1.96725C19.8349 1.21553 19.2255 0.60614 18.4738 0.60614Z" fill="white" stroke="#F3F4F6" stroke-width="0.5"/>
|
||||||
|
<mask id="mask0_22_71" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="-1" y="0" width="22" height="14">
|
||||||
|
<path d="M18.4738 0.60614H1.55545C0.803726 0.60614 0.194336 1.21553 0.194336 1.96725V12.1895C0.194336 12.9412 0.803726 13.5506 1.55545 13.5506H18.4738C19.2255 13.5506 19.8349 12.9412 19.8349 12.1895V1.96725C19.8349 1.21553 19.2255 0.60614 18.4738 0.60614Z" fill="white" stroke="white" stroke-width="0.5"/>
|
||||||
|
</mask>
|
||||||
|
<g mask="url(#mask0_22_71)">
|
||||||
|
<path d="M20.0293 0.411682H13.3528V13.7451H20.0293V0.411682Z" fill="#E43D4C"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 13.7451H6.67651V0.411682H0V13.7451Z" fill="#1BB65D"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip0_22_71">
|
||||||
|
<rect width="20.2222" height="14" fill="white"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.2 KiB |
|
|
@ -0,0 +1,34 @@
|
||||||
|
<svg width="21" height="14" viewBox="0 0 21 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g clip-path="url(#clip0_22_85)">
|
||||||
|
<path d="M18.4774 0.411499H1.55556C0.696446 0.411499 0 1.10794 0 1.96705V12.1893C0 13.0484 0.696446 13.7449 1.55556 13.7449H18.4774C19.3365 13.7449 20.033 13.0484 20.033 12.1893V1.96705C20.033 1.10794 19.3365 0.411499 18.4774 0.411499Z" fill="white"/>
|
||||||
|
<mask id="mask0_22_85" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="21" height="14">
|
||||||
|
<path d="M18.4774 0.411499H1.55556C0.696446 0.411499 0 1.10794 0 1.96705V12.1893C0 13.0484 0.696446 13.7449 1.55556 13.7449H18.4774C19.3365 13.7449 20.033 13.0484 20.033 12.1893V1.96705C20.033 1.10794 19.3365 0.411499 18.4774 0.411499Z" fill="white"/>
|
||||||
|
</mask>
|
||||||
|
<g mask="url(#mask0_22_85)">
|
||||||
|
<path d="M20.033 0.411499H0V13.7449H20.033V0.411499Z" fill="#0A17A7"/>
|
||||||
|
<path d="M-0.73999 0.152256H5.37038e-05H0.477031H0.55542L0.620678 0.195689L3.89426 2.37448H4.69983L8.45512 0.187479L8.84486 -0.0394897V0.411516V0.717082C8.84486 0.890593 8.75814 1.0526 8.61363 1.14873L8.47005 0.932904L8.61363 1.14874L5.50605 3.21706V3.84234L8.4104 6.16201C8.71365 6.40418 8.54239 6.893 8.15435 6.893C8.07347 6.893 7.99437 6.86908 7.92701 6.82425M-0.73999 0.152256L7.92701 6.82425L-0.73999 0.152256ZM-0.73999 0.152256L-0.161741 0.614093L3.07963 3.20292V3.82819L-0.143593 5.97346L-0.259205 6.05042V6.1893V6.63374V7.08475L0.130526 6.85777L3.88586 4.67077H4.69143L7.92701 6.82425M-0.73999 0.152256L8.07059 6.60843L7.92701 6.82425" fill="#FF2E3B"/>
|
||||||
|
<path d="M-0.73999 0.152256H5.37069e-05H0.477031H0.55542L0.620678 0.195689L3.89426 2.37448H4.69983L8.45512 0.187479L8.84487 -0.0394897V0.411516V0.717082C8.84487 0.890593 8.75814 1.0526 8.61363 1.14873L8.47005 0.932904L8.61363 1.14874L5.50605 3.21706V3.84234L8.4104 6.16201C8.71365 6.40418 8.54239 6.893 8.15435 6.893C8.07347 6.893 7.99437 6.86908 7.92701 6.82425M-0.73999 0.152256L7.92701 6.82425M-0.73999 0.152256L-0.161741 0.614093L3.07963 3.20292V3.82819L-0.143593 5.97346L-0.259205 6.05042V6.1893V6.63374V7.08475L0.130526 6.85777L3.88586 4.67077H4.69143L7.92701 6.82425M-0.73999 0.152256L8.07059 6.60843L7.92701 6.82425" stroke="white" stroke-width="0.666667"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 2.63372V4.4115H3.33884V6.55965C3.33884 6.84602 3.57099 7.07816 3.85736 7.07816H4.72822C5.01459 7.07816 5.24674 6.84602 5.24674 6.55965V4.4115H8.54404C8.83042 4.4115 9.06259 4.17935 9.06259 3.89298V3.15224C9.06259 2.86587 8.83042 2.63372 8.54404 2.63372H5.24674V0.411499H3.33884V2.63372H0Z" fill="url(#paint0_linear_22_85)"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 3.07816H3.81581V2.63372V0.411499H4.76977V2.63372V3.07816H8.58558V3.96705H4.76977V4.4115V6.63372H3.81581V4.4115V3.96705H0V3.07816Z" fill="url(#paint1_linear_22_85)"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M4.29302 11.3003L3.45195 11.7123L3.61258 10.8397L2.93213 10.2216L3.87249 10.0943L4.29302 9.30029L4.71357 10.0943L5.65392 10.2216L4.97348 10.8397L5.1341 11.7123L4.29302 11.3003Z" fill="white"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.3096 11.9671L13.635 12.1512L13.8326 11.5226L13.635 10.894L14.3096 11.0781L14.9841 10.894L14.7866 11.5226L14.9841 12.1512L14.3096 11.9671Z" fill="white"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M14.3096 3.52257L13.635 3.70667L13.8326 3.07812L13.635 2.44958L14.3096 2.63369L14.9841 2.44958L14.7866 3.07812L14.9841 3.70667L14.3096 3.52257Z" fill="white"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M17.1711 6.18932L16.4966 6.37342L16.6941 5.74488L16.4966 5.11633L17.1711 5.30043L17.8457 5.11633L17.6482 5.74488L17.8457 6.37342L17.1711 6.18932Z" fill="white"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M11.4475 7.07823L10.7729 7.26232L10.9706 6.63379L10.7729 6.00525L11.4475 6.18934L12.1221 6.00525L11.9245 6.63379L12.1221 7.26232L11.4475 7.07823Z" fill="white"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M15.7402 8.18925L15.4028 8.28134L15.5017 7.96704L15.4028 7.65277L15.7402 7.74482L16.0774 7.65277L15.9786 7.96704L16.0774 8.28134L15.7402 8.18925Z" fill="white"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<linearGradient id="paint0_linear_22_85" x1="0" y1="0.411499" x2="0" y2="7.07816" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop stop-color="white"/>
|
||||||
|
<stop offset="1" stop-color="#F0F0F0"/>
|
||||||
|
</linearGradient>
|
||||||
|
<linearGradient id="paint1_linear_22_85" x1="0" y1="0.411499" x2="0" y2="6.63372" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop stop-color="#FF2E3B"/>
|
||||||
|
<stop offset="1" stop-color="#FC0D1B"/>
|
||||||
|
</linearGradient>
|
||||||
|
<clipPath id="clip0_22_85">
|
||||||
|
<rect width="20.2222" height="14" fill="white"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 4.5 KiB |
|
|
@ -0,0 +1,19 @@
|
||||||
|
<svg width="21" height="14" viewBox="0 0 21 14" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g clip-path="url(#clip0_22_107)">
|
||||||
|
<path d="M18.4773 0.605957H1.55545C0.803726 0.605957 0.194336 1.21535 0.194336 1.96707V12.1893C0.194336 12.941 0.803726 13.5504 1.55545 13.5504H18.4773C19.229 13.5504 19.8384 12.941 19.8384 12.1893V1.96707C19.8384 1.21535 19.229 0.605957 18.4773 0.605957Z" fill="white" stroke="#F3F4F6" stroke-width="0.5"/>
|
||||||
|
<mask id="mask0_22_107" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="-1" y="0" width="22" height="14">
|
||||||
|
<path d="M18.4773 0.605957H1.55545C0.803726 0.605957 0.194336 1.21535 0.194336 1.96707V12.1893C0.194336 12.941 0.803726 13.5504 1.55545 13.5504H18.4773C19.229 13.5504 19.8384 12.941 19.8384 12.1893V1.96707C19.8384 1.21535 19.229 0.605957 18.4773 0.605957Z" fill="white" stroke="white" stroke-width="0.5"/>
|
||||||
|
</mask>
|
||||||
|
<g mask="url(#mask0_22_107)">
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 4.85594H20.033V0.411499H0V4.85594Z" fill="#FFA44A"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 13.7447H20.033V9.30029H0V13.7447Z" fill="#1A9F0B"/>
|
||||||
|
<path d="M10.0164 8.67075C10.9323 8.67075 11.7065 7.97472 11.7065 7.07819C11.7065 6.18168 10.9323 5.4856 10.0164 5.4856C9.10045 5.4856 8.32617 6.18168 8.32617 7.07819C8.32617 7.97472 9.10045 8.67075 10.0164 8.67075Z" fill="#181A93" fill-opacity="0.15" stroke="#181A93" stroke-width="0.666667"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M10.0166 7.52262C10.28 7.52262 10.4935 7.32363 10.4935 7.07817C10.4935 6.83271 10.28 6.63373 10.0166 6.63373C9.75313 6.63373 9.53955 6.83271 9.53955 7.07817C9.53955 7.32363 9.75313 7.52262 10.0166 7.52262Z" fill="#181A93"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip0_22_107">
|
||||||
|
<rect width="20.2222" height="14" fill="white"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.8 KiB |
|
After Width: | Height: | Size: 471 KiB |
|
After Width: | Height: | Size: 15 KiB |
|
|
@ -0,0 +1,6 @@
|
||||||
|
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path
|
||||||
|
d="M9.0002 12.825C8.83145 12.825 8.69082 12.7688 8.5502 12.6563L2.08145 6.30002C1.82832 6.0469 1.82832 5.65315 2.08145 5.40002C2.33457 5.1469 2.72832 5.1469 2.98145 5.40002L9.0002 11.2781L15.0189 5.34377C15.2721 5.09065 15.6658 5.09065 15.9189 5.34377C16.1721 5.5969 16.1721 5.99065 15.9189 6.24377L9.45019 12.6C9.30957 12.7406 9.16895 12.825 9.0002 12.825Z"
|
||||||
|
fill="#64748B"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 493 B |
|
|
@ -0,0 +1,6 @@
|
||||||
|
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path
|
||||||
|
d="M15.7504 2.9812H14.2879V2.36245C14.2879 2.02495 14.0066 1.71558 13.641 1.71558C13.2754 1.71558 12.9941 1.99683 12.9941 2.36245V2.9812H4.97852V2.36245C4.97852 2.02495 4.69727 1.71558 4.33164 1.71558C3.96602 1.71558 3.68477 1.99683 3.68477 2.36245V2.9812H2.25039C1.29414 2.9812 0.478516 3.7687 0.478516 4.75308V14.5406C0.478516 15.4968 1.26602 16.3125 2.25039 16.3125H15.7504C16.7066 16.3125 17.5223 15.525 17.5223 14.5406V4.72495C17.5223 3.7687 16.7066 2.9812 15.7504 2.9812ZM1.77227 8.21245H4.16289V10.9968H1.77227V8.21245ZM5.42852 8.21245H8.38164V10.9968H5.42852V8.21245ZM8.38164 12.2625V15.0187H5.42852V12.2625H8.38164V12.2625ZM9.64727 12.2625H12.6004V15.0187H9.64727V12.2625ZM9.64727 10.9968V8.21245H12.6004V10.9968H9.64727ZM13.8379 8.21245H16.2285V10.9968H13.8379V8.21245ZM2.25039 4.24683H3.71289V4.83745C3.71289 5.17495 3.99414 5.48433 4.35977 5.48433C4.72539 5.48433 5.00664 5.20308 5.00664 4.83745V4.24683H13.0504V4.83745C13.0504 5.17495 13.3316 5.48433 13.6973 5.48433C14.0629 5.48433 14.3441 5.20308 14.3441 4.83745V4.24683H15.7504C16.0316 4.24683 16.2566 4.47183 16.2566 4.75308V6.94683H1.77227V4.75308C1.77227 4.47183 1.96914 4.24683 2.25039 4.24683ZM1.77227 14.5125V12.2343H4.16289V14.9906H2.25039C1.96914 15.0187 1.77227 14.7937 1.77227 14.5125ZM15.7504 15.0187H13.8379V12.2625H16.2285V14.5406C16.2566 14.7937 16.0316 15.0187 15.7504 15.0187Z"
|
||||||
|
fill="#64748B"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.5 KiB |
|
|
@ -0,0 +1,6 @@
|
||||||
|
<svg class="fill-current" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M17.6875 4.125L14.4062 0.875C14.1875 0.65625 13.875 0.53125 13.5625 0.53125H7.875C6.96875 0.53125 6.21875 1.28125 6.21875 2.1875V13.5937C6.21875 14.5 6.96875 15.25 7.875 15.25H16.375C17.2812 15.25 18.0312 14.5 18.0312 13.5937V4.96875C18.0312 4.65625 17.9062 4.34375 17.6875 4.125ZM14.4687 2.9375L15.6562 4.125H14.4687V2.9375ZM16.375 13.8437H7.875C7.75 13.8437 7.625 13.7187 7.625 13.5937V2.1875C7.625 2.0625 7.75 1.9375 7.875 1.9375H13.0625V4.8125C13.0625 5.1875 13.375 5.53125 13.7812 5.53125H16.625V13.625C16.625 13.75 16.5 13.8437 16.375 13.8437Z" fill="#FFFFFF"/>
|
||||||
|
<path d="M13.7812 7.03125H9.65625C9.28125 7.03125 8.9375 7.34375 8.9375 7.75C8.9375 8.15625 9.25 8.46875 9.65625 8.46875H13.7812C14.1562 8.46875 14.5 8.15625 14.5 7.75C14.5 7.34375 14.1562 7.03125 13.7812 7.03125Z" fill="#FFFFFF"/>
|
||||||
|
<path d="M13.7812 9.65625H9.65625C9.28125 9.65625 8.9375 9.96875 8.9375 10.375C8.9375 10.75 9.25 11.0937 9.65625 11.0937H13.7812C14.1562 11.0937 14.5 10.7813 14.5 10.375C14.4687 9.96875 14.1562 9.65625 13.7812 9.65625Z" fill="#FFFFFF"/>
|
||||||
|
<path d="M13.0625 16.25C12.6875 16.25 12.3438 16.5625 12.3438 16.9687V17.8125C12.3438 17.9375 12.2188 18.0625 12.0938 18.0625H3.625C3.5 18.0625 3.375 17.9375 3.375 17.8125V6.375C3.375 6.25 3.5 6.125 3.625 6.125H4.6875C5.0625 6.125 5.40625 5.8125 5.40625 5.40625C5.40625 5 5.09375 4.6875 4.6875 4.6875H3.625C2.71875 4.6875 1.96875 5.4375 1.96875 6.34375V17.8125C1.96875 18.7188 2.71875 19.4687 3.625 19.4687H12.125C13.0313 19.4687 13.7812 18.7188 13.7812 17.8125V16.9687C13.7812 16.5625 13.4687 16.25 13.0625 16.25Z" fill="#FFFFFF"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.7 KiB |
|
|
@ -0,0 +1,10 @@
|
||||||
|
<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g clip-path="url(#clip0_512_11103)">
|
||||||
|
<path d="M8.83697 5.88205C8.8368 7.05058 9.18468 8.19267 9.83625 9.16268C10.4878 10.1327 11.4135 10.8866 12.4953 11.3284C13.5772 11.7701 14.766 11.8796 15.9103 11.6429C17.0546 11.4062 18.1025 10.8341 18.9203 9.99941V10.0834C18.9203 14.7243 15.1584 18.4862 10.5175 18.4862C5.87667 18.4862 2.11475 14.7243 2.11475 10.0834C2.11475 5.44259 5.87667 1.68066 10.5175 1.68066H10.6016C10.042 2.22779 9.59754 2.88139 9.29448 3.60295C8.99143 4.32451 8.83587 5.09943 8.83697 5.88205ZM3.7953 10.0834C3.79469 11.5833 4.29571 13.0403 5.21864 14.2226C6.14157 15.4049 7.4334 16.2446 8.88857 16.608C10.3437 16.9715 11.8787 16.8379 13.2491 16.2284C14.6196 15.6189 15.7469 14.5686 16.4516 13.2446C15.1974 13.54 13.8885 13.5102 12.6492 13.1578C11.4098 12.8054 10.281 12.1422 9.36988 11.2311C8.45877 10.32 7.79557 9.19119 7.44318 7.95181C7.0908 6.71243 7.06093 5.40357 7.3564 4.1494C6.28049 4.72259 5.38073 5.57759 4.75343 6.62288C4.12614 7.66817 3.79495 8.86438 3.7953 10.0834Z" fill="#757693"/>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip0_512_11103">
|
||||||
|
<rect width="20.1667" height="20.1667" fill="#757693" transform="translate(0.434204)"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.2 KiB |
|
|
@ -0,0 +1,10 @@
|
||||||
|
<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<g clip-path="url(#clip0_1_1131)">
|
||||||
|
<path d="M11 16.4998C9.54133 16.4998 8.14238 15.9204 7.11093 14.8889C6.07948 13.8575 5.50002 12.4585 5.50002 10.9998C5.50002 9.54115 6.07948 8.1422 7.11093 7.11075C8.14238 6.0793 9.54133 5.49984 11 5.49984C12.4587 5.49984 13.8577 6.0793 14.8891 7.11075C15.9206 8.1422 16.5 9.54115 16.5 10.9998C16.5 12.4585 15.9206 13.8575 14.8891 14.8889C13.8577 15.9204 12.4587 16.4998 11 16.4998ZM11 14.6665C11.9725 14.6665 12.9051 14.2802 13.5927 13.5926C14.2804 12.9049 14.6667 11.9723 14.6667 10.9998C14.6667 10.0274 14.2804 9.09475 13.5927 8.40711C12.9051 7.71948 11.9725 7.33317 11 7.33317C10.0276 7.33317 9.09493 7.71948 8.4073 8.40711C7.71966 9.09475 7.33335 10.0274 7.33335 10.9998C7.33335 11.9723 7.71966 12.9049 8.4073 13.5926C9.09493 14.2802 10.0276 14.6665 11 14.6665ZM10.0834 0.916504H11.9167V3.6665H10.0834V0.916504ZM10.0834 18.3332H11.9167V21.0832H10.0834V18.3332ZM3.2221 4.51809L4.51827 3.22192L6.46252 5.16617L5.16635 6.46234L3.2221 4.519V4.51809ZM15.5375 16.8335L16.8337 15.5373L18.7779 17.4816L17.4818 18.7778L15.5375 16.8335ZM17.4818 3.221L18.7779 4.51809L16.8337 6.46234L15.5375 5.16617L17.4818 3.22192V3.221ZM5.16635 15.5373L6.46252 16.8335L4.51827 18.7778L3.2221 17.4816L5.16635 15.5373ZM21.0834 10.0832V11.9165H18.3334V10.0832H21.0834ZM3.66669 10.0832V11.9165H0.916687V10.0832H3.66669Z" fill="#757693"/>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip0_1_1131">
|
||||||
|
<rect width="22" height="22" fill="white"/>
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 1.5 KiB |
|
After Width: | Height: | Size: 94 KiB |
|
After Width: | Height: | Size: 56 KiB |
|
|
@ -0,0 +1,30 @@
|
||||||
|
<svg width="350" height="350" viewBox="0 0 350 350" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M33.5825 294.844L30.5069 282.723C25.0538 280.414 19.4747 278.414 13.7961 276.732L13.4079 282.365L11.8335 276.159C4.79107 274.148 0 273.263 0 273.263C0 273.263 6.46998 297.853 20.0448 316.653L35.8606 319.429L23.5737 321.2C25.2813 323.253 27.1164 325.196 29.0681 327.019C48.8132 345.333 70.8061 353.736 78.1898 345.787C85.5736 337.838 75.5526 316.547 55.8074 298.235C49.6862 292.557 41.9968 288.001 34.2994 284.415L33.5825 294.844Z" fill="#F2F2F2"/>
|
||||||
|
<path d="M62.8332 281.679L66.4705 269.714C62.9973 264.921 59.2562 260.327 55.2652 255.954L52.019 260.576L53.8812 254.45C48.8923 249.092 45.2489 245.86 45.2489 245.86C45.2489 245.86 38.0686 270.253 39.9627 293.358L52.0658 303.903L40.6299 299.072C41.0301 301.712 41.596 304.324 42.3243 306.893C49.7535 332.77 64.2336 351.323 74.6663 348.332C85.0989 345.341 87.534 321.939 80.1048 296.063C77.8019 288.041 73.5758 280.169 68.8419 273.123L62.8332 281.679Z" fill="#F2F2F2"/>
|
||||||
|
<path d="M243.681 82.9153H241.762V30.3972C241.762 26.4054 240.975 22.4527 239.447 18.7647C237.918 15.0768 235.677 11.7258 232.853 8.90314C230.028 6.0805 226.674 3.84145 222.984 2.31385C219.293 0.786245 215.337 0 211.343 0H99.99C91.9222 0 84.1848 3.20256 78.48 8.90314C72.7752 14.6037 69.5703 22.3354 69.5703 30.3972V318.52C69.5703 322.512 70.3571 326.465 71.8859 330.153C73.4146 333.841 75.6553 337.192 78.48 340.015C81.3048 342.837 84.6582 345.076 88.3489 346.604C92.0396 348.131 95.9952 348.918 99.99 348.918H211.343C219.41 348.918 227.148 345.715 232.852 340.014C238.557 334.314 241.762 326.582 241.762 318.52V120.299H243.68L243.681 82.9153Z" fill="#E6E6E6"/>
|
||||||
|
<path d="M212.567 7.9054H198.033C198.701 9.54305 198.957 11.3199 198.776 13.0793C198.595 14.8387 197.984 16.5267 196.997 17.9946C196.01 19.4625 194.676 20.6652 193.114 21.4967C191.552 22.3283 189.809 22.7632 188.039 22.7632H124.247C122.477 22.7631 120.734 22.3281 119.172 21.4964C117.61 20.6648 116.277 19.462 115.289 17.9942C114.302 16.5263 113.691 14.8384 113.511 13.079C113.33 11.3197 113.585 9.54298 114.254 7.9054H100.678C94.6531 7.9054 88.8749 10.297 84.6146 14.5542C80.3543 18.8113 77.9609 24.5852 77.9609 30.6057V318.31C77.9609 324.331 80.3543 330.105 84.6146 334.362C88.8749 338.619 94.6531 341.011 100.678 341.011H212.567C218.592 341.011 224.37 338.619 228.63 334.362C232.891 330.105 235.284 324.331 235.284 318.31V30.6053C235.284 24.5848 232.891 18.811 228.63 14.554C224.37 10.297 218.592 7.9054 212.567 7.9054Z" fill="white"/>
|
||||||
|
<path d="M142.368 122.512C142.368 120.501 142.898 118.526 143.904 116.784C144.911 115.043 146.359 113.597 148.102 112.592C146.36 111.587 144.383 111.057 142.371 111.057C140.358 111.057 138.381 111.586 136.639 112.591C134.896 113.596 133.448 115.042 132.442 116.784C131.436 118.525 130.906 120.501 130.906 122.512C130.906 124.522 131.436 126.498 132.442 128.239C133.448 129.981 134.896 131.427 136.639 132.432C138.381 133.437 140.358 133.966 142.371 133.966C144.383 133.966 146.36 133.436 148.102 132.431C146.359 131.426 144.911 129.981 143.905 128.24C142.898 126.499 142.368 124.523 142.368 122.512Z" fill="#CCCCCC"/>
|
||||||
|
<path d="M156.779 122.512C156.778 120.501 157.308 118.526 158.315 116.784C159.321 115.043 160.769 113.597 162.513 112.592C160.77 111.587 158.793 111.057 156.781 111.057C154.769 111.057 152.792 111.586 151.049 112.591C149.306 113.596 147.859 115.042 146.852 116.784C145.846 118.525 145.316 120.501 145.316 122.512C145.316 124.522 145.846 126.498 146.852 128.239C147.859 129.981 149.306 131.427 151.049 132.432C152.792 133.437 154.769 133.966 156.781 133.966C158.793 133.966 160.77 133.436 162.513 132.431C160.769 131.426 159.322 129.981 158.315 128.24C157.308 126.499 156.779 124.523 156.779 122.512Z" fill="#CCCCCC"/>
|
||||||
|
<path d="M170.862 133.966C177.192 133.966 182.325 128.838 182.325 122.512C182.325 116.186 177.192 111.057 170.862 111.057C164.531 111.057 159.398 116.186 159.398 122.512C159.398 128.838 164.531 133.966 170.862 133.966Z" fill="#3056D3"/>
|
||||||
|
<path d="M190.017 158.289H123.208C122.572 158.288 121.962 158.035 121.512 157.586C121.062 157.137 120.809 156.527 120.809 155.892V89.1315C120.809 88.496 121.062 87.8866 121.512 87.4372C121.962 86.9878 122.572 86.735 123.208 86.7343H190.017C190.653 86.735 191.263 86.9878 191.713 87.4372C192.163 87.8866 192.416 88.496 192.416 89.1315V155.892C192.416 156.527 192.163 157.137 191.713 157.586C191.263 158.035 190.653 158.288 190.017 158.289ZM123.208 87.6937C122.826 87.6941 122.46 87.8457 122.19 88.1154C121.92 88.385 121.769 88.7507 121.768 89.132V155.892C121.769 156.274 121.92 156.639 122.19 156.909C122.46 157.178 122.826 157.33 123.208 157.33H190.017C190.399 157.33 190.765 157.178 191.035 156.909C191.304 156.639 191.456 156.274 191.457 155.892V89.132C191.456 88.7507 191.304 88.385 191.035 88.1154C190.765 87.8457 190.399 87.6941 190.017 87.6937H123.208Z" fill="#CCCCCC"/>
|
||||||
|
<path d="M204.934 209.464H102.469V210.423H204.934V209.464Z" fill="#CCCCCC"/>
|
||||||
|
<path d="M105.705 203.477C107.492 203.477 108.941 202.029 108.941 200.243C108.941 198.457 107.492 197.01 105.705 197.01C103.918 197.01 102.469 198.457 102.469 200.243C102.469 202.029 103.918 203.477 105.705 203.477Z" fill="#3056D3"/>
|
||||||
|
<path d="M204.934 241.797H102.469V242.757H204.934V241.797Z" fill="#CCCCCC"/>
|
||||||
|
<path d="M105.705 235.811C107.492 235.811 108.941 234.363 108.941 232.577C108.941 230.791 107.492 229.344 105.705 229.344C103.918 229.344 102.469 230.791 102.469 232.577C102.469 234.363 103.918 235.811 105.705 235.811Z" fill="#3056D3"/>
|
||||||
|
<path d="M203.062 278.617H170.68C170.121 278.617 169.584 278.394 169.189 277.999C168.793 277.604 168.571 277.068 168.57 276.509V265.168C168.571 264.609 168.793 264.073 169.189 263.678C169.584 263.283 170.121 263.06 170.68 263.06H203.062C203.621 263.06 204.158 263.283 204.553 263.678C204.949 264.073 205.171 264.609 205.172 265.168V276.509C205.171 277.068 204.949 277.604 204.553 277.999C204.158 278.394 203.621 278.617 203.062 278.617Z" fill="#3056D3"/>
|
||||||
|
<path d="M116.263 203.477C118.05 203.477 119.499 202.029 119.499 200.243C119.499 198.457 118.05 197.01 116.263 197.01C114.476 197.01 113.027 198.457 113.027 200.243C113.027 202.029 114.476 203.477 116.263 203.477Z" fill="#3056D3"/>
|
||||||
|
<path d="M126.818 203.477C128.605 203.477 130.054 202.029 130.054 200.243C130.054 198.457 128.605 197.01 126.818 197.01C125.031 197.01 123.582 198.457 123.582 200.243C123.582 202.029 125.031 203.477 126.818 203.477Z" fill="#3056D3"/>
|
||||||
|
<path d="M116.263 235.811C118.05 235.811 119.499 234.363 119.499 232.577C119.499 230.791 118.05 229.344 116.263 229.344C114.476 229.344 113.027 230.791 113.027 232.577C113.027 234.363 114.476 235.811 116.263 235.811Z" fill="#3056D3"/>
|
||||||
|
<path d="M126.818 235.811C128.605 235.811 130.054 234.363 130.054 232.577C130.054 230.791 128.605 229.344 126.818 229.344C125.031 229.344 123.582 230.791 123.582 232.577C123.582 234.363 125.031 235.811 126.818 235.811Z" fill="#3056D3"/>
|
||||||
|
<path d="M264.742 229.309C264.972 229.414 265.193 229.537 265.404 229.678L286.432 220.709L287.183 215.174L295.585 215.123L295.089 227.818L267.334 235.153C267.275 235.345 267.205 235.535 267.124 235.719C266.722 236.574 266.077 237.292 265.269 237.783C264.46 238.273 263.525 238.514 262.58 238.475C261.636 238.436 260.723 238.119 259.958 237.563C259.193 237.008 258.61 236.239 258.28 235.353C257.951 234.467 257.892 233.504 258.108 232.584C258.325 231.664 258.809 230.829 259.5 230.183C260.19 229.538 261.056 229.11 261.989 228.955C262.922 228.799 263.879 228.922 264.742 229.309Z" fill="#FFB8B8"/>
|
||||||
|
<path d="M298.642 344.352H292.894L290.16 322.198L298.643 322.198L298.642 344.352Z" fill="#FFB8B8"/>
|
||||||
|
<path d="M288.788 342.711H299.873V349.685H281.809C281.809 347.835 282.544 346.062 283.853 344.754C285.162 343.446 286.937 342.711 288.788 342.711Z" fill="#1C2434"/>
|
||||||
|
<path d="M320.995 342.729L315.274 343.292L310.379 321.513L318.822 320.682L320.995 342.729Z" fill="#FFB8B8"/>
|
||||||
|
<path d="M311.028 342.061L322.059 340.975L322.744 347.916L304.766 349.685C304.676 348.774 304.767 347.854 305.033 346.977C305.299 346.101 305.735 345.285 306.317 344.577C306.898 343.869 307.614 343.283 308.422 342.851C309.23 342.419 310.116 342.151 311.028 342.061Z" fill="#1C2434"/>
|
||||||
|
<path d="M300.242 191.677C306.601 191.677 311.757 186.525 311.757 180.17C311.757 173.815 306.601 168.663 300.242 168.663C293.882 168.663 288.727 173.815 288.727 180.17C288.727 186.525 293.882 191.677 300.242 191.677Z" fill="#FFB8B8"/>
|
||||||
|
<path d="M291.607 339.872C291.113 339.873 290.635 339.7 290.256 339.383C289.877 339.066 289.623 338.626 289.537 338.139C286.562 321.636 276.838 267.676 276.605 266.181C276.6 266.147 276.597 266.112 276.598 266.077V262.054C276.597 261.907 276.643 261.764 276.729 261.645L278.013 259.847C278.074 259.761 278.154 259.689 278.247 259.639C278.34 259.588 278.444 259.559 278.549 259.554C285.874 259.211 309.86 258.206 311.019 259.652C312.183 261.106 311.772 265.512 311.678 266.38L311.682 266.471L322.459 335.337C322.543 335.886 322.408 336.446 322.082 336.896C321.756 337.347 321.265 337.65 320.717 337.742L313.986 338.85C313.485 338.931 312.971 338.829 312.539 338.563C312.107 338.297 311.784 337.885 311.63 337.401C309.548 330.754 302.568 308.393 300.149 299.741C300.133 299.686 300.099 299.639 300.051 299.607C300.004 299.576 299.946 299.563 299.89 299.571C299.834 299.579 299.782 299.608 299.745 299.651C299.708 299.694 299.688 299.749 299.689 299.806C299.81 308.054 300.102 329.098 300.203 336.366L300.214 337.148C300.218 337.678 300.023 338.191 299.668 338.584C299.313 338.978 298.823 339.224 298.295 339.274L291.804 339.863C291.738 339.869 291.672 339.872 291.607 339.872Z" fill="#1C2434"/>
|
||||||
|
<path d="M292.933 196.201C290.924 197.395 289.721 199.588 289.031 201.821C287.754 205.953 286.985 210.226 286.741 214.545L286.012 227.475L276.984 261.755C284.809 268.37 289.322 266.867 299.855 261.455C310.387 256.044 311.591 263.26 311.591 263.26L313.697 234.092L316.706 202.219C316.031 201.407 315.266 200.672 314.427 200.03C311.645 197.868 308.409 196.366 304.962 195.636C301.516 194.906 297.948 194.967 294.528 195.815L292.933 196.201Z" fill="#3056D3"/>
|
||||||
|
<path d="M290.001 236.232C290.244 236.324 290.479 236.434 290.704 236.562L311.497 226.163L311.842 220.529L320.419 219.938L320.878 232.781L293.092 241.963C292.865 242.935 292.347 243.816 291.608 244.487C290.868 245.158 289.941 245.588 288.951 245.72C287.96 245.852 286.953 245.68 286.063 245.226C285.173 244.772 284.442 244.058 283.968 243.179C283.494 242.301 283.299 241.298 283.409 240.306C283.519 239.313 283.928 238.378 284.583 237.624C285.238 236.869 286.107 236.332 287.075 236.084C288.043 235.835 289.063 235.887 290.001 236.232Z" fill="#FFB8B8"/>
|
||||||
|
<path d="M316.556 202.365C321.672 204.17 322.573 223.716 322.573 223.716C316.554 220.409 309.332 225.821 309.332 225.821C309.332 225.821 307.827 220.709 306.022 214.094C305.477 212.233 305.412 210.265 305.832 208.372C306.253 206.479 307.147 204.724 308.429 203.269C308.429 203.269 311.44 200.56 316.556 202.365Z" fill="#3056D3"/>
|
||||||
|
<path d="M310.566 183.213C309.132 182.066 307.174 184.151 307.174 184.151L306.026 173.828C306.026 173.828 298.853 174.687 294.261 173.542C289.67 172.396 288.953 177.7 288.953 177.7C288.716 175.557 288.668 173.399 288.81 171.248C289.096 168.667 292.827 166.087 299.427 164.366C306.026 162.646 309.47 170.101 309.47 170.101C314.061 172.395 312.001 184.36 310.566 183.213Z" fill="#1C2434"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 11 KiB |
|
|
@ -0,0 +1,84 @@
|
||||||
|
<svg width="562" height="562" viewBox="0 0 562 562" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M129.784 380.251L108.079 381.734C109.065 381.7 110.03 382.04 110.779 382.687C120.099 390.683 80.5459 457.713 67.3633 455.384C66.6787 455.127 66.0362 454.77 65.457 454.324C72.536 461.403 90.0162 445.866 97.0618 437.073C106.17 425.741 119.408 420.66 132.429 418.807C136.281 408.297 134.962 389.239 129.784 380.251Z" fill="#3C50E0"/>
|
||||||
|
<path d="M451.821 541.159C442.29 533.166 428.313 523.323 415.816 519.663L409.771 507.696C400.036 512.746 389.177 515.24 378.214 514.942L381.073 519.655C378.851 525.962 377.446 532.528 376.893 539.192C376.799 540.391 377.081 541.59 377.699 542.621C378.317 543.653 379.241 544.467 380.343 544.95C381.073 545.273 381.865 545.438 382.662 545.44C404.32 545.493 423.221 545.705 450.107 545.758C450.507 545.76 450.902 545.67 451.261 545.495C451.621 545.32 451.935 545.065 452.18 544.749C452.426 544.434 452.595 544.066 452.676 543.675C452.757 543.283 452.747 542.879 452.646 542.492C452.515 541.973 452.227 541.508 451.821 541.159Z" fill="#3C50E0"/>
|
||||||
|
<path d="M187.082 218.867C187.641 217.68 188.568 216.706 189.725 216.089C190.883 215.471 192.208 215.244 193.505 215.44C194.802 215.637 196 216.246 196.923 217.178C197.846 218.11 198.443 219.315 198.626 220.614C194.646 220.085 190.78 219.502 187.082 218.867Z" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M231.123 209.864C231.126 207.903 230.741 205.96 229.992 204.147C229.242 202.334 228.142 200.687 226.755 199.301C225.368 197.914 223.721 196.814 221.908 196.065C220.095 195.316 218.152 194.931 216.191 194.934H109.512C107.551 194.932 105.608 195.316 103.796 196.066C101.983 196.815 100.336 197.915 98.9492 199.302C97.5623 200.688 96.4627 202.335 95.7133 204.148C94.9639 205.96 94.5795 207.903 94.582 209.864V270.596C94.5795 272.558 94.9639 274.5 95.7133 276.313C96.4627 278.125 97.5623 279.772 98.9492 281.159C100.336 282.546 101.983 283.646 103.796 284.395C105.608 285.144 107.551 285.529 109.512 285.526H216.199C220.159 285.527 223.957 283.955 226.759 281.156C228.144 279.769 229.243 278.122 229.992 276.31C230.741 274.498 231.125 272.557 231.123 270.596V260.541C218.944 260.75 206.765 260.078 194.689 258.537L198.465 265.089H127.04L149.436 226.277C145.222 224.975 140.965 223.812 136.674 222.791C130.169 221.227 131.226 219.786 132.279 219.56C136.123 219.014 140.023 218.978 143.876 219.454L143.675 219.279C142.948 218.649 142.223 218.022 141.546 217.389C134.578 210.873 135.052 208.192 145.576 213.788C148.364 215.36 151.219 216.807 154.135 218.125L155.735 215.372L158.26 219.797C163.82 221.915 170.199 223.833 176.08 224.875C177.392 222.311 178.992 219.904 180.848 217.701C183.031 218.114 184.714 218.429 186.902 218.8C187.46 217.611 188.386 216.635 189.544 216.017C190.701 215.398 192.028 215.17 193.326 215.366C194.623 215.563 195.823 216.173 196.746 217.107C197.668 218.04 198.265 219.247 198.446 220.547C209.287 221.999 220.19 222.916 231.123 223.284V209.864Z" fill="#3C50E0"/>
|
||||||
|
<path fill-rule="evenodd" clip-rule="evenodd" d="M508.205 138.489C508.21 135.534 507.336 132.645 505.695 130.188C504.054 127.731 501.72 125.818 498.989 124.691C497.176 123.941 495.234 123.556 493.273 123.559H386.594C384.632 123.555 382.689 123.939 380.876 124.688C379.063 125.437 377.416 126.537 376.029 127.924C374.642 129.311 373.542 130.958 372.793 132.771C372.044 134.584 371.66 136.527 371.664 138.489V207.721C380.346 209.547 386.589 210.335 387.43 210.023C404.846 203.569 420.629 192.763 436.618 178.89C438.39 179.307 440.093 179.974 441.677 180.871C446.707 177.111 454.31 169.411 456.005 165.76C457.261 162.379 459.23 159.309 461.779 156.758H462.615C464.313 157.817 462.351 166.607 461.451 170.261C466.763 166.634 471.359 162.056 475.007 156.758C477.125 153.898 479.508 150.88 480.673 151.568C482.314 152.536 481.116 157.003 480.511 158.837C479.435 162.05 477.847 165.067 475.806 167.772C478.097 170.57 476.963 175.567 474.803 178.162C477.498 179.277 476.492 183.823 473.875 186.911C476.283 186.827 476.935 191.367 474.218 193.981L474.193 193.998C472.936 194.918 470.584 196.646 458.022 205.525C458.385 207.615 458.491 209.497 458.435 211.57C450.308 218.432 441.721 224.482 432.8 230.003H493.284C495.245 230.005 497.187 229.62 498.998 228.869C500.81 228.119 502.456 227.019 503.842 225.632C505.228 224.245 506.327 222.598 507.076 220.786C507.825 218.974 508.208 217.031 508.205 215.071V138.489Z" fill="#3C50E0"/>
|
||||||
|
<path d="M440.961 224.702C438.869 226.118 436.75 227.495 434.607 228.833C434.376 229.881 434.463 230.975 434.855 231.975C435.247 232.974 435.927 233.835 436.809 234.447C437.692 235.059 438.736 235.396 439.81 235.413C440.883 235.431 441.938 235.129 442.84 234.546C443.741 233.96 444.448 233.119 444.869 232.13C445.291 231.141 445.408 230.049 445.207 228.993C445.005 227.937 444.494 226.965 443.738 226.201C442.982 225.437 442.015 224.915 440.961 224.702Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M168.234 285.526C168.236 286.596 167.92 287.641 167.326 288.53C166.732 289.42 165.887 290.112 164.898 290.521C164.16 290.828 163.363 290.968 162.564 290.929C161.765 290.89 160.985 290.674 160.28 290.297C159.575 289.919 158.962 289.39 158.487 288.746C158.012 288.103 157.686 287.362 157.532 286.577C157.377 285.793 157.398 284.984 157.593 284.209C157.789 283.434 158.154 282.712 158.662 282.095C159.17 281.478 159.809 280.982 160.532 280.641C161.255 280.301 162.045 280.126 162.844 280.128C164.272 280.137 165.639 280.709 166.648 281.72C167.657 282.731 168.227 284.098 168.234 285.526Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M194.701 258.576C187.929 257.726 181.199 256.578 174.529 255.134C173.46 251.763 172.75 248.289 172.411 244.769C167.421 243.555 162.3 242.968 157.166 243.021C145.778 243.339 149.641 240.374 153.562 239.05C157.901 237.62 168.439 235.396 164.468 232.431C161.926 231.213 160.008 230.201 158.537 229.365C155.56 228.179 152.52 227.155 149.432 226.299L127.035 265.089H198.461L194.701 258.576Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M389.816 141.56V156.758H474.904C477.022 153.899 479.388 150.905 480.57 151.569C481.459 152.067 481.685 154.004 481.046 156.758H489.993V141.56H389.816Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M309.436 172.323L309.277 172.482L312.455 178.892C317.962 177.516 322.036 175.397 322.357 171.367C321.632 175.024 313.059 173.257 309.436 172.323Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M333.268 240.31L332.95 244.599L323.195 236.603C326.501 237.975 329.861 239.211 333.268 240.31Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M268.039 249.047C269.572 248.041 271.216 246.929 272.961 245.658L274.02 229.984L268.039 249.047Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M284.823 330.534C282.326 326.261 280.537 321.611 279.527 316.766L286.358 353.936C288.053 350.759 289.703 347.526 291.283 344.182L284.823 330.534Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M277.886 254.604C271.37 252.277 270.682 249.1 276.93 246.611L277.886 254.604Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M328.347 246.664L327.023 254.71C330.465 253.492 332.531 252.01 332.531 250.424C332.531 249.047 331.048 247.776 328.347 246.664Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M129.787 380.251L119.781 380.887C122.376 374.797 126.453 374.426 129.787 380.251Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M132.434 418.798C130.051 425.15 126.082 426.474 122.484 420.914C125.75 419.987 129.074 419.28 132.434 418.798Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M67.419 455.384C62.0457 453.171 64.0468 444.116 67.2017 435.875C72.8314 421.148 85.2448 400.499 96.1169 389.421C104.213 381.168 112.878 378.225 112.162 388.089C110.86 406.062 78.9879 457.418 67.419 455.384Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M311.137 144.949C310.853 143.5 310.124 142.175 309.052 141.159C307.979 140.143 306.616 139.488 305.153 139.283C305.491 138.09 305.51 136.83 305.207 135.627C304.904 134.425 304.291 133.323 303.428 132.433C302.564 131.543 301.481 130.896 300.288 130.557C299.095 130.218 297.834 130.199 296.631 130.501C296.487 129.24 296.007 128.041 295.242 127.028C294.477 126.015 293.454 125.226 292.28 124.743C291.106 124.26 289.823 124.103 288.567 124.287C287.31 124.47 286.127 124.989 285.14 125.789C284.706 124.922 284.099 124.155 283.356 123.533C282.613 122.912 281.75 122.45 280.82 122.176C279.891 121.902 278.915 121.823 277.954 121.942C276.993 122.062 276.066 122.378 275.232 122.871C274.117 123.531 273.206 124.487 272.598 125.63C271.637 124.8 270.469 124.245 269.218 124.025C267.967 123.804 266.68 123.925 265.493 124.375C264.305 124.825 263.261 125.588 262.471 126.582C261.681 127.577 261.174 128.766 261.004 130.025C259.811 129.684 258.548 129.663 257.344 129.966C256.139 130.268 255.036 130.882 254.145 131.747C253.253 132.611 252.606 133.695 252.267 134.889C251.928 136.084 251.91 137.347 252.214 138.55C250.956 138.699 249.761 139.181 248.752 139.947C247.743 140.713 246.958 141.735 246.477 142.907C245.996 144.079 245.838 145.359 246.018 146.612C246.198 147.866 246.71 149.049 247.501 150.038C246.341 150.616 245.363 151.503 244.673 152.6C243.984 153.698 243.611 154.965 243.594 156.261C243.578 157.557 243.919 158.832 244.58 159.947C245.242 161.062 246.197 161.973 247.342 162.58C246.501 163.538 245.935 164.706 245.705 165.96C245.474 167.214 245.588 168.506 246.033 169.701C246.478 170.895 247.239 171.947 248.234 172.744C249.229 173.541 250.422 174.053 251.685 174.227C251.344 175.421 251.323 176.683 251.625 177.888C251.928 179.092 252.542 180.195 253.406 181.086C254.271 181.978 255.355 182.625 256.549 182.964C257.744 183.303 259.006 183.322 260.21 183.017C260.352 184.279 260.83 185.479 261.595 186.492C262.36 187.506 263.383 188.295 264.558 188.776C265.733 189.258 267.015 189.415 268.271 189.231C269.528 189.047 270.711 188.529 271.698 187.73C272.277 188.889 273.164 189.865 274.262 190.553C275.36 191.241 276.625 191.614 277.921 191.63C279.216 191.647 280.491 191.306 281.605 190.646C282.72 189.986 283.631 189.032 284.24 187.889C285.198 188.728 286.366 189.292 287.619 189.522C288.873 189.751 290.165 189.637 291.359 189.192C292.552 188.747 293.604 187.988 294.401 186.994C295.198 186 295.711 184.809 295.887 183.547C296.896 183.831 297.957 183.889 298.991 183.715C300.026 183.541 301.009 183.14 301.87 182.541C303.545 175.28 304.8 167.928 305.63 160.523C296.99 155.228 301.288 147.982 305.789 152.421C308.384 155.016 307.907 149.668 306.318 145.802C307.848 145.186 309.489 144.895 311.137 144.949Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M479.727 466.663L468.343 442.304C468.153 441.928 467.857 441.615 467.492 441.405C467.127 441.194 466.709 441.095 466.288 441.118C465.867 441.142 465.463 441.288 465.124 441.538C464.785 441.788 464.526 442.132 464.379 442.527C464.182 443.056 464.198 443.64 464.424 444.157L475.809 468.516C475.926 468.781 476.095 469.021 476.305 469.22C476.516 469.42 476.764 469.575 477.035 469.678C477.307 469.78 477.597 469.826 477.887 469.814C478.177 469.801 478.462 469.731 478.724 469.606C478.987 469.483 479.223 469.308 479.416 469.092C479.609 468.875 479.756 468.621 479.847 468.346C479.942 468.072 479.979 467.781 479.959 467.492C479.938 467.203 479.86 466.921 479.727 466.663Z" fill="#9D8EFB"/>
|
||||||
|
<path d="M35.8047 545.766H526.207" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M342.898 308.455C346.438 308.454 349.833 307.048 352.336 304.546C354.84 302.044 356.248 298.65 356.251 295.111V246.082" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M246 259.317V295.058C246.004 298.169 247.088 301.182 249.066 303.583" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M219.906 355.048V285.049" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M334.219 434.417H241.412C237.142 434.425 232.968 433.16 229.421 430.782C225.875 428.405 223.118 425.025 221.504 421.072" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M382.349 249.629V412.868C382.36 413.86 382.287 414.852 382.137 415.833" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M382.191 124.194C381.487 119.068 378.914 114.383 374.966 111.039C371.018 107.695 365.973 105.929 360.801 106.079H241.455C238.671 105.982 235.895 106.444 233.292 107.44C230.689 108.435 228.313 109.943 226.304 111.873C224.294 113.803 222.692 116.118 221.594 118.678C220.495 121.239 219.921 123.994 219.906 126.78V195.411" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M231.123 223.337V209.864C231.126 207.903 230.741 205.96 229.992 204.147C229.242 202.334 228.142 200.687 226.755 199.301C225.368 197.914 223.721 196.814 221.908 196.065C220.095 195.316 218.152 194.931 216.191 194.934H109.512C107.551 194.932 105.608 195.316 103.796 196.066C101.983 196.815 100.336 197.915 98.9492 199.302C97.5623 200.688 96.4627 202.335 95.7133 204.148C94.9639 205.96 94.5795 207.903 94.582 209.864V270.596C94.5795 272.558 94.9639 274.5 95.7133 276.313C96.4627 278.125 97.5623 279.772 98.9492 281.159C100.336 282.546 101.983 283.646 103.796 284.395C105.608 285.144 107.551 285.529 109.512 285.526H157.424M231.123 260.376V270.596C231.126 272.557 230.742 274.499 229.993 276.311C229.244 278.123 228.145 279.769 226.759 281.156C225.373 282.543 223.727 283.643 221.916 284.393C220.104 285.142 218.162 285.528 216.202 285.526H168.137" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M434.661 228.883C434.599 229.251 434.564 229.624 434.555 229.998C434.547 230.705 434.679 231.406 434.945 232.062C435.21 232.717 435.603 233.314 436.1 233.816C436.598 234.319 437.19 234.717 437.843 234.989C438.496 235.261 439.196 235.4 439.903 235.399C441.334 235.392 442.704 234.821 443.715 233.81C444.727 232.798 445.298 231.428 445.305 229.998C445.306 228.763 444.879 227.566 444.097 226.611C443.315 225.656 442.226 225.001 441.015 224.758" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M154.203 218.019L155.736 215.371L158.278 219.766" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M187.082 218.866C187.641 217.68 188.568 216.706 189.725 216.088C190.883 215.471 192.208 215.244 193.505 215.44C194.802 215.636 196 216.246 196.923 217.178C197.846 218.11 198.443 219.315 198.626 220.614C194.646 220.084 190.78 219.502 187.082 218.866Z" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M194.701 258.629L198.461 265.089H127.035L149.432 226.277" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M371.652 207.727V138.492C371.647 135.537 372.52 132.648 374.161 130.191C375.801 127.734 378.135 125.821 380.866 124.693C382.678 123.943 384.621 123.557 386.582 123.559H493.272C496.227 123.554 499.117 124.428 501.574 126.069C504.031 127.71 505.946 130.044 507.073 132.776C507.823 134.587 508.208 136.53 508.205 138.492V215.054C508.209 218.008 507.336 220.898 505.695 223.355C504.054 225.811 501.719 227.725 498.988 228.852C497.176 229.602 495.233 229.987 493.272 229.984H445.439" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M395.109 123.559C395.079 115.545 391.875 107.87 386.199 102.214C380.522 96.5574 372.836 93.3803 364.823 93.3782H236.954C232.977 93.3767 229.038 94.1591 225.363 95.6806C221.687 97.2021 218.348 99.433 215.535 102.246C212.723 105.058 210.492 108.398 208.97 112.073C207.449 115.748 206.667 119.687 206.668 123.665V194.934" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M206.668 369.607V285.526" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M340.041 446.702H236.949C229.991 446.703 223.246 444.308 217.846 439.92C212.447 435.532 208.723 429.419 207.301 422.608" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M395.105 249.629V416.415C395.108 422.987 392.971 429.38 389.016 434.629" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M474.957 156.758H389.816V141.56H489.993V156.758H481.099" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M462.621 164.966H468.022" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M389.816 209.07V164.966H456.373" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M477.658 164.966H489.997V211.982H458.016" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M439.9 235.385V290.927C439.9 295.642 438.972 300.31 437.168 304.665C435.364 309.021 432.72 312.978 429.387 316.312C426.054 319.646 422.096 322.29 417.741 324.094C413.386 325.898 408.718 326.827 404.003 326.827H349.891" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M238.809 326.799H198.787C189.264 326.791 180.134 323.003 173.403 316.267C166.672 309.531 162.891 300.397 162.891 290.874" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M162.855 441.565V471.587" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M177.865 456.576H147.844" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M322.458 171.359C321.557 174.907 313.818 173.329 311.181 172.752L309.23 172.292C310.903 176.044 312.491 178.889 312.491 178.889" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M334.645 196.629C329.361 194.703 324.244 192.348 319.345 189.586C317.952 188.843 316.723 187.827 315.732 186.599C314.74 185.37 314.006 183.955 313.573 182.437C313.199 181.269 312.884 180.051 312.511 178.884C317.299 177.682 321.778 175.91 322.466 171.359C323.302 165.879 318.684 157.583 311.296 145.005C309.6 144.924 307.906 145.194 306.318 145.796C307.854 149.662 308.392 154.993 305.789 152.415C301.302 147.956 296.998 155.222 305.63 160.517C305.206 164.912 304.515 168.987 303.776 173.117C303.37 176.301 302.733 179.451 301.87 182.543C300.841 184.68 299.339 186.553 297.476 188.022C295.614 189.49 293.441 190.514 291.123 191.016C286.998 192.212 283.058 193.975 279.418 196.255C301.338 207.163 334.601 196.629 334.601 196.629H334.645Z" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M332.95 244.599L323.195 236.55C326.473 237.938 329.812 239.175 333.203 240.257" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M332.527 250.424C333.037 243.434 332.884 245.725 333.216 240.257C351.101 245.688 369.568 248.98 388.229 250.064C392.318 250.334 396.407 249.531 400.09 247.734C420.865 237.614 440.744 226.508 458.439 211.57C458.821 197.389 448.788 181.841 436.622 178.889C420.633 192.763 404.85 203.568 387.434 210.023C385.57 210.714 357.276 206.012 334.593 196.629" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M268.039 249.047L274.02 229.984L272.961 245.658" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M272.588 250.279L272.95 245.658C264.191 252.195 254.3 257.059 243.776 260.005C220.581 261.567 197.282 259.928 174.535 255.134C170.355 241.795 171.62 228.71 180.837 217.701C201.084 221.538 221.646 223.471 242.254 223.473C257.187 214.683 267.881 203.298 279.424 196.255" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M279.314 266.837C279.314 266.837 252.949 283.249 242.525 321.267L210.753 368.76C185.414 374.357 156.069 376.241 124.727 376.093" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M286.304 353.989L279.473 316.819" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M283.549 287.432C280.009 294.002 278.231 301.376 278.389 308.837C278.546 316.298 280.634 323.59 284.449 330.004C284.706 330.433 291.28 344.193 291.28 344.193" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M132.433 418.798C119.409 420.649 106.163 425.727 97.0658 437.064C88.3202 447.964 73.4208 459.522 66.1133 454.865" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M276.977 246.611L279.307 266.836C294.297 262.968 310.023 262.968 325.014 266.836L328.38 246.664" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M327.016 254.71C330.458 253.492 332.524 252.012 332.524 250.424C332.524 249.047 331.044 247.773 328.393 246.664C316.858 241.831 288.631 241.851 276.981 246.611C275.086 247.386 272.109 248.935 272.656 250.92C273.029 252.277 274.908 253.567 277.881 254.604" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M469.504 173.979C470.669 172.814 474.111 169.745 475.805 167.786" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M456.789 173.171C458.484 172.164 460.072 171.22 461.446 170.261" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M474.804 178.162L469.559 182.755" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M469.918 190.539C469.918 190.539 472.931 187.696 473.864 186.916" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M325.008 266.837C364.826 355.313 378.856 418.171 416.873 503.198C402.57 513.367 389.784 515.26 372.451 514.792L291.282 344.193L286.305 353.989C276.676 370.811 265.716 386.834 253.529 401.906C249.371 407.31 244.166 411.821 238.225 415.168C232.284 418.516 225.73 420.632 218.954 421.39C188.449 424.917 157.706 425.929 127.035 424.417" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M409.771 507.696L415.808 519.663C428.305 523.317 442.326 533.113 451.813 541.159C452.223 541.504 452.517 541.967 452.654 542.484C452.791 543.002 452.765 543.55 452.579 544.052C452.397 544.555 452.063 544.99 451.624 545.297C451.185 545.604 450.662 545.767 450.127 545.766C423.229 545.741 404.328 545.488 382.681 545.449C381.883 545.445 381.094 545.277 380.364 544.956C379.633 544.635 378.976 544.167 378.434 543.581C377.892 542.995 377.477 542.304 377.215 541.55C376.953 540.796 376.85 539.996 376.912 539.2C377.483 532.517 378.908 525.934 381.145 519.61L378.236 514.897" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M122.482 420.908C124.508 424.041 126.662 424.988 128.569 424.083C133.56 421.722 134.658 409.311 134.658 403.701C134.658 395.401 132.122 377.163 125.21 376.124C123.193 375.82 121.253 377.436 119.781 380.881" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M105.478 382.567C102.012 384.315 98.848 386.608 96.1083 389.359C86.2249 399.638 78.1664 411.527 72.2793 424.514C66.8391 436.011 63.4278 447.245 64.6568 452.418C65.4929 455.98 68.4193 456.091 71.6467 454.344C87.4602 445.782 119.21 389.964 110.776 382.687C110.017 382.116 109.098 381.798 108.148 381.777C107.198 381.755 106.263 382.031 105.478 382.567Z" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M312.459 264.506C312.459 264.506 310.341 289.445 315.803 301.942C321.266 314.438 399.832 511.826 399.832 511.826" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M283.87 329.316C272.005 349.234 259.103 368.516 245.217 387.082C236.393 398.322 222.132 401.444 207.891 402.489C183.543 404.306 159.11 404.713 134.715 403.707" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M168.223 285.526C168.224 286.596 167.908 287.641 167.314 288.53C166.72 289.42 165.875 290.112 164.887 290.52C164.148 290.828 163.351 290.967 162.552 290.929C161.753 290.89 160.973 290.674 160.268 290.296C159.563 289.919 158.95 289.389 158.475 288.746C158 288.103 157.674 287.362 157.521 286.577C157.366 285.793 157.386 284.984 157.582 284.209C157.777 283.434 158.142 282.712 158.65 282.095C159.158 281.478 159.797 280.982 160.52 280.641C161.244 280.301 162.033 280.126 162.833 280.128C164.261 280.137 165.627 280.709 166.636 281.72C167.645 282.73 168.215 284.098 168.223 285.526Z" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M53.8047 239.41L63.1774 252.648L74.1889 233.479" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M306.318 145.796C307.907 149.662 308.392 154.994 305.789 152.416C301.302 147.956 296.999 155.222 305.63 160.517C305.206 164.86 304.515 168.99 303.777 173.117C303.361 176.3 302.724 179.449 301.87 182.543C300.688 183.364 299.285 183.807 297.846 183.814C297.187 183.807 296.532 183.718 295.895 183.549C295.766 184.494 295.447 185.404 294.957 186.222C294.467 187.04 293.815 187.751 293.043 188.31C292.27 188.869 291.391 189.266 290.461 189.475C289.53 189.685 288.567 189.704 287.629 189.53C286.375 189.299 285.206 188.733 284.248 187.891C283.641 189.037 282.73 189.992 281.615 190.654C280.5 191.315 279.225 191.656 277.929 191.64C276.633 191.623 275.366 191.25 274.269 190.561C273.171 189.871 272.284 188.893 271.707 187.733C270.719 188.529 269.536 189.046 268.28 189.229C267.024 189.413 265.743 189.255 264.569 188.774C263.395 188.292 262.372 187.504 261.607 186.492C260.841 185.48 260.362 184.28 260.218 183.02C259.015 183.323 257.753 183.304 256.559 182.965C255.365 182.626 254.281 181.978 253.417 181.087C252.553 180.196 251.938 179.093 251.636 177.889C251.333 176.686 251.353 175.423 251.693 174.229C250.431 174.055 249.239 173.542 248.244 172.745C247.25 171.948 246.49 170.897 246.044 169.702C245.599 168.508 245.486 167.216 245.716 165.962C245.946 164.709 246.511 163.541 247.351 162.583C246.206 161.975 245.252 161.064 244.591 159.949C243.93 158.834 243.59 157.559 243.606 156.263C243.622 154.968 243.995 153.702 244.684 152.604C245.373 151.506 246.35 150.62 247.51 150.041C246.72 149.051 246.21 147.869 246.03 146.615C245.851 145.362 246.01 144.084 246.491 142.912C246.971 141.741 247.756 140.719 248.764 139.953C249.771 139.186 250.965 138.703 252.223 138.553C251.918 137.349 251.936 136.087 252.275 134.892C252.614 133.698 253.262 132.614 254.153 131.749C255.044 130.885 256.148 130.27 257.352 129.968C258.556 129.666 259.819 129.686 261.013 130.027C261.184 128.769 261.691 127.581 262.481 126.587C263.271 125.593 264.315 124.831 265.502 124.381C266.689 123.93 267.976 123.809 269.227 124.03C270.477 124.25 271.645 124.804 272.607 125.632C273.215 124.488 274.126 123.533 275.24 122.872C276.355 122.212 277.63 121.871 278.926 121.888C280.222 121.904 281.488 122.277 282.585 122.966C283.683 123.654 284.57 124.632 285.148 125.791C286.136 124.997 287.319 124.482 288.573 124.3C289.827 124.118 291.107 124.276 292.28 124.757C293.453 125.238 294.475 126.024 295.24 127.035C296.005 128.045 296.485 129.242 296.631 130.501C297.834 130.199 299.096 130.218 300.289 130.557C301.482 130.897 302.565 131.544 303.429 132.435C304.292 133.325 304.907 134.428 305.209 135.631C305.512 136.834 305.493 138.095 305.153 139.289C306.617 139.492 307.98 140.148 309.053 141.164C310.125 142.179 310.854 143.505 311.137 144.955C309.49 144.897 307.849 145.184 306.318 145.796Z" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M450.548 82.7903L429.316 103.969" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M450.497 104.022L429.371 82.7903" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M479.774 466.663C479.897 466.923 479.967 467.205 479.981 467.493C479.994 467.781 479.95 468.069 479.852 468.339C479.753 468.61 479.602 468.859 479.407 469.071C479.212 469.283 478.977 469.454 478.715 469.575C478.455 469.698 478.172 469.768 477.885 469.781C477.597 469.795 477.309 469.751 477.038 469.652C476.768 469.554 476.519 469.403 476.307 469.208C476.095 469.013 475.924 468.777 475.803 468.516L464.471 444.16C464.276 443.649 464.281 443.082 464.485 442.574C464.689 442.067 465.078 441.654 465.573 441.42C466.067 441.186 466.632 441.147 467.155 441.312C467.677 441.476 468.118 441.831 468.389 442.307L479.774 466.663Z" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M459.809 429.121L466.425 443.26" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M443.398 393.963C440.798 395.176 438.5 396.951 436.669 399.159C434.838 401.368 433.519 403.955 432.808 406.734C432.097 409.513 432.012 412.415 432.557 415.232C433.103 418.048 434.267 420.708 435.965 423.021C438.237 426.11 441.374 428.457 444.979 429.765C448.584 431.073 452.495 431.284 456.22 430.371C459.945 429.458 463.315 427.462 465.907 424.635C468.498 421.808 470.194 418.277 470.78 414.487C471.362 410.694 470.806 406.813 469.183 403.336C467.003 398.677 463.063 395.074 458.229 393.317C453.395 391.56 448.061 391.792 443.398 393.963Z" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M220.179 41.3558C219.215 41.2471 218.482 41.1329 218.089 40.0655C217.531 38.6134 216.575 37.4039 217.782 36.133C218.927 34.9838 219.569 33.428 219.569 31.8061C219.569 30.1843 218.927 28.6285 217.782 27.4793L214.819 24.5752C213.671 23.4349 212.118 22.795 210.5 22.795C208.881 22.795 207.328 23.4349 206.18 24.5752C204.97 25.7848 203.699 24.8177 202.306 24.2715C201.926 24.1297 201.6 23.8732 201.373 23.5375C201.145 23.2019 201.028 22.8038 201.038 22.3986C201.041 21.5951 200.885 20.799 200.578 20.0562C200.272 19.3133 199.822 18.6384 199.254 18.0702C198.686 17.5021 198.011 17.052 197.268 16.7459C196.525 16.4398 195.729 16.2837 194.926 16.2867H190.745C189.942 16.2845 189.147 16.4411 188.404 16.7475C187.662 17.0539 186.987 17.504 186.42 18.072C185.852 18.6401 185.402 19.3147 185.096 20.0573C184.79 20.7998 184.634 21.5955 184.636 22.3986C184.636 24.0931 183.061 24.3495 181.671 24.9403C181.307 25.0993 180.904 25.1437 180.514 25.0675C180.125 24.9913 179.768 24.7982 179.491 24.5139C178.343 23.3736 176.79 22.7337 175.171 22.7337C173.553 22.7337 172 23.3736 170.852 24.5139L167.808 27.4793C166.661 28.627 166.016 30.1834 166.016 31.8061C166.016 33.4289 166.661 34.9853 167.808 36.133C169.018 37.3425 168.051 38.6134 167.502 40.0655C167.36 40.4457 167.104 40.7725 166.768 41.0003C166.433 41.228 166.034 41.3455 165.629 41.3363C164.826 41.3345 164.03 41.4913 163.288 41.7979C162.546 42.1044 161.871 42.5546 161.304 43.1225C160.736 43.6905 160.286 44.365 159.98 45.1074C159.674 45.8497 159.517 46.6452 159.52 47.4483L159.581 51.6288C159.579 52.4317 159.736 53.227 160.042 53.9692C160.348 54.7114 160.798 55.3858 161.366 55.9537C161.934 56.5215 162.608 56.9717 163.35 57.2784C164.092 57.5851 164.887 57.7422 165.69 57.7407C167.385 57.7407 167.641 59.3154 168.232 60.7061C168.403 61.0755 168.453 61.489 168.378 61.8888C168.302 62.2886 168.102 62.6547 167.808 62.9357C166.664 64.0821 166.021 65.6357 166.021 67.2556C166.021 68.8754 166.664 70.429 167.808 71.5754L170.774 74.5408C171.922 75.6811 173.475 76.321 175.093 76.321C176.712 76.321 178.265 75.6811 179.413 74.5408C180.623 73.3285 181.894 74.2955 183.287 74.8418C183.666 74.9857 183.992 75.243 184.219 75.5787C184.447 75.9144 184.565 76.312 184.558 76.7175C184.554 77.5225 184.71 78.3203 185.016 79.0648C185.323 79.8093 185.773 80.4858 186.342 81.0553C186.911 81.6248 187.587 82.076 188.331 82.3829C189.076 82.6898 189.873 82.8463 190.678 82.8433L194.915 82.782C195.717 82.7827 196.512 82.6251 197.253 82.3181C197.995 82.0111 198.668 81.5608 199.235 80.993C199.802 80.4252 200.252 79.7511 200.557 79.0092C200.863 78.2674 201.02 77.4725 201.018 76.6701C201.018 74.9756 202.593 74.7359 203.986 74.1283C204.356 73.9579 204.77 73.9074 205.17 73.9839C205.569 74.0603 205.935 74.2599 206.216 74.5547C207.365 75.695 208.917 76.3349 210.536 76.3349C212.154 76.3349 213.707 75.695 214.856 74.5547L217.76 71.5894C218.9 70.4408 219.54 68.888 219.54 67.2695C219.54 65.651 218.9 64.0982 217.76 62.9496C216.55 61.7401 217.517 60.4692 218.064 59.0171C218.207 58.6381 218.465 58.3126 218.8 58.0852C219.136 57.8577 219.534 57.7394 219.939 57.7463C220.745 57.7511 221.543 57.5962 222.288 57.2906C223.033 56.9851 223.71 56.5349 224.281 55.966C224.851 55.3972 225.302 54.721 225.61 53.9766C225.917 53.2321 226.074 52.4341 226.071 51.6288V47.4483C226.071 45.8666 225.457 44.3466 224.358 43.2097C223.258 42.0727 221.76 41.4079 220.179 41.3558Z" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M192.799 65.1152C189.712 65.1152 186.694 64.1998 184.128 62.4849C181.561 60.7699 179.561 58.3324 178.379 55.4806C177.198 52.6287 176.889 49.4906 177.491 46.4631C178.094 43.4356 179.58 40.6546 181.763 38.4719C183.945 36.2892 186.726 34.8027 189.754 34.2005C192.781 33.5983 195.919 33.9074 198.771 35.0887C201.623 36.27 204.061 38.2704 205.776 40.837C207.491 43.4036 208.406 46.4211 208.406 49.5079C208.413 51.5595 208.014 53.5921 207.232 55.4888C206.45 57.3855 205.301 59.1089 203.85 60.5595C202.4 62.0102 200.676 63.1595 198.78 63.9414C196.883 64.7233 194.85 65.1222 192.799 65.1152Z" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M480.514 158.837C481.119 157.003 482.317 152.535 480.676 151.568C479.511 150.88 477.128 153.898 475.01 156.758C471.362 162.055 466.766 166.633 461.454 170.261C462.354 166.607 464.316 157.817 462.619 156.758H461.782C459.233 159.309 457.264 162.379 456.008 165.76C454.313 169.411 446.71 177.111 441.68 180.871C446.028 183.551 449.741 187.143 452.564 191.4C455.386 195.657 457.249 200.476 458.025 205.525C470.667 196.587 472.969 194.898 474.221 193.981C476.938 191.367 476.286 186.827 473.878 186.91C476.495 183.822 477.501 179.277 474.806 178.162C476.966 175.567 478.1 170.57 475.809 167.772C477.85 165.067 479.438 162.049 480.514 158.837Z" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M172.414 244.799C167.424 243.579 162.302 242.978 157.164 243.01C145.779 243.333 149.639 240.346 153.563 239.039C157.897 237.592 168.44 235.385 164.469 232.419C161.877 231.202 160.009 230.19 158.538 229.354C151.383 226.741 144.082 224.55 136.671 222.79C130.166 221.227 131.222 219.786 132.276 219.56C136.12 219.013 140.019 218.978 143.873 219.454C143.078 218.766 142.284 218.08 141.543 217.389C134.575 210.873 135.049 208.192 145.573 213.788C155.029 219.2 165.348 222.939 176.076 224.842" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M169.866 234.855C168.051 234.077 166.25 233.265 164.465 232.419" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M143.883 219.449C146.949 221.957 156.982 228.462 158.548 229.348" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
<path d="M108.336 381.751L129.796 380.251" stroke="#120071" stroke-width="2.80102" stroke-linecap="round" stroke-linejoin="round"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 34 KiB |
|
|
@ -0,0 +1,53 @@
|
||||||
|
<svg width="176" height="32" viewBox="0 0 176 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M44 9.17592H50.2773V27.1572H54.032V9.17592H60.3093V5.71459H44V9.17592Z" fill="#1C2434"/>
|
||||||
|
<path d="M64.4999 27.5386C66.7585 27.5386 68.7239 26.5119 69.3399 25.0159L69.6039 27.1572H72.7425V18.3572C72.7425 14.3386 70.3372 12.2266 66.4359 12.2266C62.5052 12.2266 59.9239 14.2799 59.9239 17.4186H62.9745C62.9745 15.8933 64.1479 15.0133 66.2599 15.0133C68.0785 15.0133 69.2519 15.8053 69.2519 17.7706V18.0932L64.9105 18.4159C61.4785 18.6799 59.5425 20.3519 59.5425 23.0213C59.5425 25.7492 61.4199 27.5386 64.4999 27.5386ZM65.6732 24.8399C64.0599 24.8399 63.1799 24.1946 63.1799 22.8746C63.1799 21.7012 64.0305 20.9679 66.2599 20.7626L69.2812 20.5279V21.2906C69.2812 23.5199 67.8732 24.8399 65.6732 24.8399Z" fill="#1C2434"/>
|
||||||
|
<path d="M78.0475 9.76258C79.2209 9.76258 80.1889 8.79458 80.1889 7.59192C80.1889 6.38925 79.2209 5.45059 78.0475 5.45059C76.8155 5.45059 75.8475 6.38925 75.8475 7.59192C75.8475 8.79458 76.8155 9.76258 78.0475 9.76258ZM76.2582 27.1572H79.8369V12.6666H76.2582V27.1572Z" fill="#1C2434"/>
|
||||||
|
<path d="M87.1422 27.1572V5.33325H83.5929V27.1572H87.1422Z" fill="#1C2434"/>
|
||||||
|
<path d="M93.2722 27.1572L95.0029 22.1999H103.011L104.742 27.1572H108.702L100.958 5.71459H97.1149L89.3709 27.1572H93.2722ZM98.5522 12.1093C98.7576 11.5226 98.9335 10.8773 99.0215 10.4666C99.0802 10.9066 99.2855 11.5519 99.4615 12.1093L101.926 19.0319H96.1175L98.5522 12.1093Z" fill="#1C2434"/>
|
||||||
|
<path d="M116.158 27.5386C118.358 27.5386 120.236 26.5706 121.116 24.8986L121.35 27.1572H124.636V5.33325H121.086V14.5146C120.177 13.0773 118.388 12.2266 116.364 12.2266C111.993 12.2266 109.353 15.4533 109.353 19.9706C109.353 24.4586 111.964 27.5386 116.158 27.5386ZM116.95 24.2532C114.457 24.2532 112.932 22.4346 112.932 19.8533C112.932 17.2719 114.457 15.4239 116.95 15.4239C119.444 15.4239 121.057 17.2426 121.057 19.8533C121.057 22.4639 119.444 24.2532 116.95 24.2532Z" fill="#1C2434"/>
|
||||||
|
<path d="M131.944 27.1572V18.9439C131.944 16.5973 133.322 15.4826 135.024 15.4826C136.725 15.4826 137.81 16.5679 137.81 18.5919V27.1572H141.389V18.9439C141.389 16.5679 142.709 15.4533 144.44 15.4533C146.141 15.4533 147.256 16.5386 147.256 18.6213V27.1572H150.805V17.6826C150.805 14.3386 148.869 12.2266 145.349 12.2266C143.149 12.2266 141.448 13.3119 140.714 14.9839C139.952 13.3119 138.426 12.2266 136.226 12.2266C134.144 12.2266 132.677 13.1653 131.944 14.3679L131.65 12.6666H128.365V27.1572H131.944Z" fill="#1C2434"/>
|
||||||
|
<path d="M156.107 9.76258C157.281 9.76258 158.249 8.79458 158.249 7.59192C158.249 6.38925 157.281 5.45059 156.107 5.45059C154.875 5.45059 153.907 6.38925 153.907 7.59192C153.907 8.79458 154.875 9.76258 156.107 9.76258ZM154.318 27.1572H157.897V12.6666H154.318V27.1572Z" fill="#1C2434"/>
|
||||||
|
<path d="M165.173 27.1572V19.3546C165.173 17.0079 166.522 15.4826 168.722 15.4826C170.57 15.4826 171.773 16.6559 171.773 19.0906V27.1572H175.351V18.2399C175.351 14.4853 173.474 12.2266 169.837 12.2266C167.871 12.2266 166.111 13.0773 165.202 14.5439L164.909 12.6666H161.594V27.1572H165.173Z" fill="#1C2434"/>
|
||||||
|
<path d="M0 8.42105C0 3.77023 3.77023 0 8.42105 0H23.5789C28.2298 0 32 3.77023 32 8.42105V23.5789C32 28.2298 28.2298 32 23.5789 32H8.42105C3.77023 32 0 28.2298 0 23.5789V8.42105Z" fill="#3C50E0"/>
|
||||||
|
<g filter="url(#filter0_d_521_14075)">
|
||||||
|
<path d="M8.42139 8.42127C8.42139 7.49111 9.17543 6.73706 10.1056 6.73706V6.73706C11.0358 6.73706 11.7898 7.49111 11.7898 8.42127V23.5792C11.7898 24.5093 11.0358 25.2634 10.1056 25.2634V25.2634C9.17543 25.2634 8.42139 24.5093 8.42139 23.5792V8.42127Z" fill="white"/>
|
||||||
|
</g>
|
||||||
|
<g opacity="0.9" filter="url(#filter1_d_521_14075)">
|
||||||
|
<path d="M14.7368 15.1576C14.7368 14.2274 15.4909 13.4734 16.421 13.4734V13.4734C17.3512 13.4734 18.1052 14.2274 18.1052 15.1576V23.5786C18.1052 24.5088 17.3512 25.2629 16.421 25.2629V25.2629C15.4909 25.2629 14.7368 24.5088 14.7368 23.5786V15.1576Z" fill="white"/>
|
||||||
|
</g>
|
||||||
|
<g opacity="0.7" filter="url(#filter2_d_521_14075)">
|
||||||
|
<path d="M21.0522 10.9469C21.0522 10.0167 21.8063 9.2627 22.7365 9.2627V9.2627C23.6666 9.2627 24.4207 10.0167 24.4207 10.9469V23.5785C24.4207 24.5086 23.6666 25.2627 22.7365 25.2627V25.2627C21.8063 25.2627 21.0522 24.5086 21.0522 23.5785V10.9469Z" fill="white"/>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<filter id="filter0_d_521_14075" x="7.42139" y="6.23706" width="5.36865" height="20.5264" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||||
|
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||||
|
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||||
|
<feOffset dy="0.5"/>
|
||||||
|
<feGaussianBlur stdDeviation="0.5"/>
|
||||||
|
<feComposite in2="hardAlpha" operator="out"/>
|
||||||
|
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0"/>
|
||||||
|
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_521_14075"/>
|
||||||
|
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_521_14075" result="shape"/>
|
||||||
|
</filter>
|
||||||
|
<filter id="filter1_d_521_14075" x="13.7368" y="12.9734" width="5.36865" height="13.7896" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||||
|
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||||
|
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||||
|
<feOffset dy="0.5"/>
|
||||||
|
<feGaussianBlur stdDeviation="0.5"/>
|
||||||
|
<feComposite in2="hardAlpha" operator="out"/>
|
||||||
|
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0"/>
|
||||||
|
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_521_14075"/>
|
||||||
|
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_521_14075" result="shape"/>
|
||||||
|
</filter>
|
||||||
|
<filter id="filter2_d_521_14075" x="20.0522" y="8.7627" width="5.36865" height="18" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||||
|
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||||
|
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||||
|
<feOffset dy="0.5"/>
|
||||||
|
<feGaussianBlur stdDeviation="0.5"/>
|
||||||
|
<feComposite in2="hardAlpha" operator="out"/>
|
||||||
|
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0"/>
|
||||||
|
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_521_14075"/>
|
||||||
|
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_521_14075" result="shape"/>
|
||||||
|
</filter>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 6.2 KiB |
|
|
@ -0,0 +1,44 @@
|
||||||
|
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M0 8.42105C0 3.77023 3.77023 0 8.42105 0H23.5789C28.2298 0 32 3.77023 32 8.42105V23.5789C32 28.2298 28.2298 32 23.5789 32H8.42105C3.77023 32 0 28.2298 0 23.5789V8.42105Z" fill="#3C50E0"/>
|
||||||
|
<g filter="url(#filter0_d_521_14078)">
|
||||||
|
<path d="M8.42139 8.42127C8.42139 7.49111 9.17543 6.73706 10.1056 6.73706V6.73706C11.0358 6.73706 11.7898 7.49111 11.7898 8.42127V23.5792C11.7898 24.5093 11.0358 25.2634 10.1056 25.2634V25.2634C9.17543 25.2634 8.42139 24.5093 8.42139 23.5792V8.42127Z" fill="white"/>
|
||||||
|
</g>
|
||||||
|
<g opacity="0.9" filter="url(#filter1_d_521_14078)">
|
||||||
|
<path d="M14.7368 15.1576C14.7368 14.2274 15.4909 13.4734 16.421 13.4734V13.4734C17.3512 13.4734 18.1052 14.2274 18.1052 15.1576V23.5786C18.1052 24.5088 17.3512 25.2629 16.421 25.2629V25.2629C15.4909 25.2629 14.7368 24.5088 14.7368 23.5786V15.1576Z" fill="white"/>
|
||||||
|
</g>
|
||||||
|
<g opacity="0.7" filter="url(#filter2_d_521_14078)">
|
||||||
|
<path d="M21.0522 10.9469C21.0522 10.0167 21.8063 9.2627 22.7365 9.2627V9.2627C23.6666 9.2627 24.4207 10.0167 24.4207 10.9469V23.5785C24.4207 24.5086 23.6666 25.2627 22.7365 25.2627V25.2627C21.8063 25.2627 21.0522 24.5086 21.0522 23.5785V10.9469Z" fill="white"/>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<filter id="filter0_d_521_14078" x="7.42139" y="6.23706" width="5.36865" height="20.5264" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||||
|
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||||
|
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||||
|
<feOffset dy="0.5"/>
|
||||||
|
<feGaussianBlur stdDeviation="0.5"/>
|
||||||
|
<feComposite in2="hardAlpha" operator="out"/>
|
||||||
|
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0"/>
|
||||||
|
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_521_14078"/>
|
||||||
|
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_521_14078" result="shape"/>
|
||||||
|
</filter>
|
||||||
|
<filter id="filter1_d_521_14078" x="13.7368" y="12.9734" width="5.36865" height="13.7896" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||||
|
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||||
|
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||||
|
<feOffset dy="0.5"/>
|
||||||
|
<feGaussianBlur stdDeviation="0.5"/>
|
||||||
|
<feComposite in2="hardAlpha" operator="out"/>
|
||||||
|
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0"/>
|
||||||
|
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_521_14078"/>
|
||||||
|
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_521_14078" result="shape"/>
|
||||||
|
</filter>
|
||||||
|
<filter id="filter2_d_521_14078" x="20.0522" y="8.7627" width="5.36865" height="18" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||||
|
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||||
|
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||||
|
<feOffset dy="0.5"/>
|
||||||
|
<feGaussianBlur stdDeviation="0.5"/>
|
||||||
|
<feComposite in2="hardAlpha" operator="out"/>
|
||||||
|
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0"/>
|
||||||
|
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_521_14078"/>
|
||||||
|
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_521_14078" result="shape"/>
|
||||||
|
</filter>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.3 KiB |
|
|
@ -0,0 +1,53 @@
|
||||||
|
<svg width="176" height="32" viewBox="0 0 176 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M44 9.17592H50.2773V27.1572H54.032V9.17592H60.3093V5.71459H44V9.17592Z" fill="white"/>
|
||||||
|
<path d="M64.4999 27.5386C66.7585 27.5386 68.7239 26.5119 69.3399 25.0159L69.6039 27.1572H72.7425V18.3572C72.7425 14.3386 70.3372 12.2266 66.4359 12.2266C62.5052 12.2266 59.9239 14.2799 59.9239 17.4186H62.9745C62.9745 15.8933 64.1479 15.0133 66.2599 15.0133C68.0785 15.0133 69.2519 15.8053 69.2519 17.7706V18.0932L64.9105 18.4159C61.4785 18.6799 59.5425 20.3519 59.5425 23.0213C59.5425 25.7492 61.4199 27.5386 64.4999 27.5386ZM65.6732 24.8399C64.0599 24.8399 63.1799 24.1946 63.1799 22.8746C63.1799 21.7012 64.0305 20.9679 66.2599 20.7626L69.2812 20.5279V21.2906C69.2812 23.5199 67.8732 24.8399 65.6732 24.8399Z" fill="white"/>
|
||||||
|
<path d="M78.0475 9.76258C79.2209 9.76258 80.1889 8.79458 80.1889 7.59192C80.1889 6.38925 79.2209 5.45059 78.0475 5.45059C76.8155 5.45059 75.8475 6.38925 75.8475 7.59192C75.8475 8.79458 76.8155 9.76258 78.0475 9.76258ZM76.2582 27.1572H79.8369V12.6666H76.2582V27.1572Z" fill="white"/>
|
||||||
|
<path d="M87.1422 27.1572V5.33325H83.5929V27.1572H87.1422Z" fill="white"/>
|
||||||
|
<path d="M93.2722 27.1572L95.0029 22.1999H103.011L104.742 27.1572H108.702L100.958 5.71459H97.1149L89.3709 27.1572H93.2722ZM98.5522 12.1093C98.7576 11.5226 98.9335 10.8773 99.0215 10.4666C99.0802 10.9066 99.2855 11.5519 99.4615 12.1093L101.926 19.0319H96.1175L98.5522 12.1093Z" fill="white"/>
|
||||||
|
<path d="M116.158 27.5386C118.358 27.5386 120.236 26.5706 121.116 24.8986L121.35 27.1572H124.636V5.33325H121.086V14.5146C120.177 13.0773 118.388 12.2266 116.364 12.2266C111.993 12.2266 109.353 15.4533 109.353 19.9706C109.353 24.4586 111.964 27.5386 116.158 27.5386ZM116.95 24.2532C114.457 24.2532 112.932 22.4346 112.932 19.8533C112.932 17.2719 114.457 15.4239 116.95 15.4239C119.444 15.4239 121.057 17.2426 121.057 19.8533C121.057 22.4639 119.444 24.2532 116.95 24.2532Z" fill="white"/>
|
||||||
|
<path d="M131.944 27.1572V18.9439C131.944 16.5973 133.322 15.4826 135.024 15.4826C136.725 15.4826 137.81 16.5679 137.81 18.5919V27.1572H141.389V18.9439C141.389 16.5679 142.709 15.4533 144.44 15.4533C146.141 15.4533 147.256 16.5386 147.256 18.6213V27.1572H150.805V17.6826C150.805 14.3386 148.869 12.2266 145.349 12.2266C143.149 12.2266 141.448 13.3119 140.714 14.9839C139.952 13.3119 138.426 12.2266 136.226 12.2266C134.144 12.2266 132.677 13.1653 131.944 14.3679L131.65 12.6666H128.365V27.1572H131.944Z" fill="white"/>
|
||||||
|
<path d="M156.107 9.76258C157.281 9.76258 158.249 8.79458 158.249 7.59192C158.249 6.38925 157.281 5.45059 156.107 5.45059C154.875 5.45059 153.907 6.38925 153.907 7.59192C153.907 8.79458 154.875 9.76258 156.107 9.76258ZM154.318 27.1572H157.897V12.6666H154.318V27.1572Z" fill="white"/>
|
||||||
|
<path d="M165.173 27.1572V19.3546C165.173 17.0079 166.522 15.4826 168.722 15.4826C170.57 15.4826 171.773 16.6559 171.773 19.0906V27.1572H175.351V18.2399C175.351 14.4853 173.474 12.2266 169.837 12.2266C167.871 12.2266 166.111 13.0773 165.202 14.5439L164.909 12.6666H161.594V27.1572H165.173Z" fill="white"/>
|
||||||
|
<path d="M0 8.42105C0 3.77023 3.77023 0 8.42105 0H23.5789C28.2298 0 32 3.77023 32 8.42105V23.5789C32 28.2298 28.2298 32 23.5789 32H8.42105C3.77023 32 0 28.2298 0 23.5789V8.42105Z" fill="#3C50E0"/>
|
||||||
|
<g filter="url(#filter0_d_506_10589)">
|
||||||
|
<path d="M8.42139 8.42127C8.42139 7.49111 9.17543 6.73706 10.1056 6.73706V6.73706C11.0358 6.73706 11.7898 7.49111 11.7898 8.42127V23.5792C11.7898 24.5093 11.0358 25.2634 10.1056 25.2634V25.2634C9.17543 25.2634 8.42139 24.5093 8.42139 23.5792V8.42127Z" fill="white"/>
|
||||||
|
</g>
|
||||||
|
<g opacity="0.9" filter="url(#filter1_d_506_10589)">
|
||||||
|
<path d="M14.7368 15.1576C14.7368 14.2274 15.4909 13.4734 16.421 13.4734V13.4734C17.3512 13.4734 18.1052 14.2274 18.1052 15.1576V23.5786C18.1052 24.5088 17.3512 25.2629 16.421 25.2629V25.2629C15.4909 25.2629 14.7368 24.5088 14.7368 23.5786V15.1576Z" fill="white"/>
|
||||||
|
</g>
|
||||||
|
<g opacity="0.7" filter="url(#filter2_d_506_10589)">
|
||||||
|
<path d="M21.0522 10.9469C21.0522 10.0167 21.8063 9.2627 22.7365 9.2627V9.2627C23.6666 9.2627 24.4207 10.0167 24.4207 10.9469V23.5785C24.4207 24.5086 23.6666 25.2627 22.7365 25.2627V25.2627C21.8063 25.2627 21.0522 24.5086 21.0522 23.5785V10.9469Z" fill="white"/>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<filter id="filter0_d_506_10589" x="7.42139" y="6.23706" width="5.36865" height="20.5264" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||||
|
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||||
|
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||||
|
<feOffset dy="0.5"/>
|
||||||
|
<feGaussianBlur stdDeviation="0.5"/>
|
||||||
|
<feComposite in2="hardAlpha" operator="out"/>
|
||||||
|
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0"/>
|
||||||
|
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_506_10589"/>
|
||||||
|
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_506_10589" result="shape"/>
|
||||||
|
</filter>
|
||||||
|
<filter id="filter1_d_506_10589" x="13.7368" y="12.9734" width="5.36865" height="13.7896" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||||
|
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||||
|
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||||
|
<feOffset dy="0.5"/>
|
||||||
|
<feGaussianBlur stdDeviation="0.5"/>
|
||||||
|
<feComposite in2="hardAlpha" operator="out"/>
|
||||||
|
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0"/>
|
||||||
|
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_506_10589"/>
|
||||||
|
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_506_10589" result="shape"/>
|
||||||
|
</filter>
|
||||||
|
<filter id="filter2_d_506_10589" x="20.0522" y="8.7627" width="5.36865" height="18" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
|
||||||
|
<feFlood flood-opacity="0" result="BackgroundImageFix"/>
|
||||||
|
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
|
||||||
|
<feOffset dy="0.5"/>
|
||||||
|
<feGaussianBlur stdDeviation="0.5"/>
|
||||||
|
<feComposite in2="hardAlpha" operator="out"/>
|
||||||
|
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.12 0"/>
|
||||||
|
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_506_10589"/>
|
||||||
|
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_506_10589" result="shape"/>
|
||||||
|
</filter>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 6.2 KiB |
|
After Width: | Height: | Size: 8.6 KiB |
|
After Width: | Height: | Size: 15 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 17 KiB |
|
After Width: | Height: | Size: 34 KiB |
|
After Width: | Height: | Size: 76 KiB |
|
After Width: | Height: | Size: 15 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 23 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 84 KiB |
|
After Width: | Height: | Size: 10 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 9.5 KiB |
|
After Width: | Height: | Size: 9.2 KiB |
|
After Width: | Height: | Size: 11 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 7.5 KiB |
|
|
@ -0,0 +1 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>
|
||||||
|
After Width: | Height: | Size: 1.3 KiB |
|
|
@ -0,0 +1 @@
|
||||||
|
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1155 1000"><path d="m577.3 0 577.4 1000H0z" fill="#fff"/></svg>
|
||||||
|
After Width: | Height: | Size: 128 B |
|
|
@ -0,0 +1 @@
|
||||||
|
<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 2.5h13v10a1 1 0 0 1-1 1h-11a1 1 0 0 1-1-1zM0 1h16v11.5a2.5 2.5 0 0 1-2.5 2.5h-11A2.5 2.5 0 0 1 0 12.5zm3.75 4.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5M7 4.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0m1.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5" fill="#666"/></svg>
|
||||||
|
After Width: | Height: | Size: 385 B |
|
|
@ -0,0 +1,82 @@
|
||||||
|
"use server";
|
||||||
|
|
||||||
|
import { redirect } from "next/navigation";
|
||||||
|
|
||||||
|
const defaultHeaders = {
|
||||||
|
accept: "application/json",
|
||||||
|
"Content-type": "application/json",
|
||||||
|
};
|
||||||
|
|
||||||
|
interface HeadersObject {
|
||||||
|
cache: string;
|
||||||
|
method: string;
|
||||||
|
headers: Object;
|
||||||
|
body?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const fetchData = async (
|
||||||
|
endpoint: string,
|
||||||
|
payload: any,
|
||||||
|
method: string = "POST",
|
||||||
|
cache: boolean = false
|
||||||
|
) => {
|
||||||
|
let headersObject: any = {
|
||||||
|
cache: cache ? "force-cache" : "no-store",
|
||||||
|
method: method,
|
||||||
|
headers: defaultHeaders,
|
||||||
|
};
|
||||||
|
if (method !== "GET") {
|
||||||
|
headersObject = {
|
||||||
|
...headersObject,
|
||||||
|
body: JSON.stringify(payload),
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
const response = await fetch(endpoint, headersObject);
|
||||||
|
if (response.status === 200) {
|
||||||
|
return response;
|
||||||
|
} else if (response.status === 401) {
|
||||||
|
return { status: 401 };
|
||||||
|
} else {
|
||||||
|
return { status: response.status };
|
||||||
|
}
|
||||||
|
} catch (error) {}
|
||||||
|
return { status: 500 };
|
||||||
|
};
|
||||||
|
|
||||||
|
const fetchDataWithToken = async (
|
||||||
|
endpoint: string,
|
||||||
|
token: string,
|
||||||
|
payload: any,
|
||||||
|
method: string = "POST",
|
||||||
|
cache: boolean = false
|
||||||
|
) => {
|
||||||
|
let headersObject: any = {
|
||||||
|
cache: cache ? "force-cache" : "no-store",
|
||||||
|
method: method,
|
||||||
|
headers: {
|
||||||
|
...defaultHeaders,
|
||||||
|
"evyos-session-key": token,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
if (method !== "GET") {
|
||||||
|
headersObject = {
|
||||||
|
...headersObject,
|
||||||
|
body: JSON.stringify(payload),
|
||||||
|
};
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
const response = await fetch(endpoint, headersObject);
|
||||||
|
if (response.status === 200) {
|
||||||
|
return response;
|
||||||
|
} else if (response.status === 401) {
|
||||||
|
redirect("/login/email");
|
||||||
|
} else {
|
||||||
|
return { status: response.status };
|
||||||
|
}
|
||||||
|
} catch (error) {}
|
||||||
|
return { status: 500 };
|
||||||
|
};
|
||||||
|
|
||||||
|
export { fetchData, fetchDataWithToken };
|
||||||
|
|
@ -0,0 +1,10 @@
|
||||||
|
export const baseUrl = "http://0.0.0.0:41575";
|
||||||
|
export const tokenSecret =
|
||||||
|
"SyIkoYIK5JLD2cuRB0hnB-1zcj5FB5oxbB73ph-Oe3Kn0WWeSOjnWAuzzi6ZUX_5TpFF0-KGpKDZepaUhVEmmdaY5E-_sI3b9UwfN_eg-KgtpCiiWiHADSu9bRSBez_ZI4AFkeNK0LSRWpqq9El6V3pauvgsKJU_ZXwplIW49Y8";
|
||||||
|
export const cookieObject: any = {
|
||||||
|
httpOnly: true,
|
||||||
|
path: "/",
|
||||||
|
secure: true,
|
||||||
|
sameSite: "strict",
|
||||||
|
// maxAge: 3600,
|
||||||
|
};
|
||||||
|
|
@ -0,0 +1,55 @@
|
||||||
|
"use server";
|
||||||
|
import { fetchDataWithToken } from "../api-fetcher";
|
||||||
|
import { cookies } from "next/headers";
|
||||||
|
import { baseUrl, tokenSecret } from "../basics";
|
||||||
|
import NextCrypto from "next-crypto";
|
||||||
|
|
||||||
|
const checkToken = `${baseUrl}/authentication/valid`;
|
||||||
|
const nextCrypto = new NextCrypto(tokenSecret);
|
||||||
|
|
||||||
|
async function check_access_token_is_valid() {
|
||||||
|
const cookieStore = await cookies();
|
||||||
|
const encrpytAccessToken = cookieStore.get("accessToken")?.value || "";
|
||||||
|
const decryptedAccessToken =
|
||||||
|
(await nextCrypto.decrypt(encrpytAccessToken)) || "";
|
||||||
|
|
||||||
|
const response = await fetchDataWithToken(
|
||||||
|
checkToken,
|
||||||
|
decryptedAccessToken,
|
||||||
|
{},
|
||||||
|
"GET",
|
||||||
|
false
|
||||||
|
);
|
||||||
|
return response?.status === 200 ? true : false;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function retrieve_access_token() {
|
||||||
|
const cookieStore = await cookies();
|
||||||
|
const encrpytAccessToken = cookieStore.get("accessToken")?.value || "";
|
||||||
|
return encrpytAccessToken
|
||||||
|
? await nextCrypto.decrypt(encrpytAccessToken)
|
||||||
|
: null;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function retrieve_user_type() {
|
||||||
|
const cookieStore = await cookies();
|
||||||
|
const encrpytaccessObject = cookieStore.get("accessObject")?.value || "{}";
|
||||||
|
const decrpytUserType = JSON.parse(
|
||||||
|
(await nextCrypto.decrypt(encrpytaccessObject)) || "{}"
|
||||||
|
);
|
||||||
|
return decrpytUserType ? decrpytUserType?.user_type : null;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function retrieve_access_objects() {
|
||||||
|
const cookieStore = await cookies();
|
||||||
|
const encrpytAccessObject = cookieStore.get("accessObject")?.value || "";
|
||||||
|
const decrpytAccessObject = await nextCrypto.decrypt(encrpytAccessObject);
|
||||||
|
return decrpytAccessObject ? JSON.parse(decrpytAccessObject) : null;
|
||||||
|
}
|
||||||
|
|
||||||
|
export {
|
||||||
|
check_access_token_is_valid,
|
||||||
|
retrieve_access_token,
|
||||||
|
retrieve_user_type,
|
||||||
|
retrieve_access_objects,
|
||||||
|
};
|
||||||
|
|
@ -0,0 +1,153 @@
|
||||||
|
"use server";
|
||||||
|
import { fetchData, fetchDataWithToken } from "../api-fetcher";
|
||||||
|
import { cookies } from "next/headers";
|
||||||
|
import { baseUrl, cookieObject, tokenSecret } from "../basics";
|
||||||
|
import NextCrypto from "next-crypto";
|
||||||
|
|
||||||
|
const loginEndpoint = `${baseUrl}/authentication/login`;
|
||||||
|
const loginSelectEndpoint = `${baseUrl}/authentication/select`;
|
||||||
|
|
||||||
|
interface LoginViaAccessKeys {
|
||||||
|
domain: string;
|
||||||
|
accessKey: string;
|
||||||
|
password: string;
|
||||||
|
rememberMe: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface LoginSelectEmployee {
|
||||||
|
token: string;
|
||||||
|
company_uu_id: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface LoginSelectOccupant {
|
||||||
|
token: string;
|
||||||
|
build_part_uu_id: string;
|
||||||
|
occupant_uu_id: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function login_via_access_keys(payload: LoginViaAccessKeys) {
|
||||||
|
const cookieStore = await cookies();
|
||||||
|
const nextCrypto = new NextCrypto(tokenSecret);
|
||||||
|
|
||||||
|
let responseData: any = {};
|
||||||
|
const tokenResponse: any = await fetchData(
|
||||||
|
loginEndpoint,
|
||||||
|
{
|
||||||
|
domain: payload.domain,
|
||||||
|
access_key: payload.accessKey,
|
||||||
|
password: payload.password,
|
||||||
|
remember_me: payload.rememberMe,
|
||||||
|
},
|
||||||
|
"POST",
|
||||||
|
false
|
||||||
|
);
|
||||||
|
if (tokenResponse.status === 200) {
|
||||||
|
responseData = await tokenResponse?.json();
|
||||||
|
const accessToken = await nextCrypto.encrypt(responseData.access_token);
|
||||||
|
const accessObject = await nextCrypto.encrypt(
|
||||||
|
JSON.stringify(responseData.access_object)
|
||||||
|
);
|
||||||
|
const userProfile = await nextCrypto.encrypt(
|
||||||
|
JSON.stringify(responseData.user)
|
||||||
|
);
|
||||||
|
const refreshToken = await nextCrypto.encrypt(responseData.refresh_token);
|
||||||
|
|
||||||
|
// const userType = await nextCrypto.encrypt(responseData.user_type);
|
||||||
|
// cookieStore.set({
|
||||||
|
// name: "refreshToken",
|
||||||
|
// value: refreshToken,
|
||||||
|
// httpOnly: true,
|
||||||
|
// path: "/",
|
||||||
|
// });
|
||||||
|
|
||||||
|
cookieStore.set({
|
||||||
|
name: "accessToken",
|
||||||
|
value: accessToken,
|
||||||
|
...cookieObject,
|
||||||
|
});
|
||||||
|
|
||||||
|
cookieStore.set({
|
||||||
|
name: "accessObject",
|
||||||
|
value: accessObject,
|
||||||
|
...cookieObject,
|
||||||
|
});
|
||||||
|
cookieStore.set({
|
||||||
|
name: "userProfile",
|
||||||
|
value: JSON.stringify(userProfile),
|
||||||
|
...cookieObject,
|
||||||
|
});
|
||||||
|
// cookieStore.set({
|
||||||
|
// name: "userType",
|
||||||
|
// value: userType,
|
||||||
|
// ...cookieObject,
|
||||||
|
// });
|
||||||
|
}
|
||||||
|
return responseData;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function login_select_employee(payload: LoginSelectEmployee) {
|
||||||
|
let responseData = null;
|
||||||
|
const cookieStore = await cookies();
|
||||||
|
const nextCrypto = new NextCrypto(tokenSecret);
|
||||||
|
|
||||||
|
const selectResponse: any = await fetchDataWithToken(
|
||||||
|
loginSelectEndpoint,
|
||||||
|
payload.token,
|
||||||
|
{
|
||||||
|
company_uu_id: payload.company_uu_id,
|
||||||
|
},
|
||||||
|
"POST",
|
||||||
|
false
|
||||||
|
);
|
||||||
|
if (selectResponse.status === 200) {
|
||||||
|
responseData = await selectResponse?.json();
|
||||||
|
const usersSelection = await nextCrypto.encrypt(
|
||||||
|
JSON.stringify({
|
||||||
|
company_uu_id: payload.company_uu_id,
|
||||||
|
user_type: "employee",
|
||||||
|
})
|
||||||
|
);
|
||||||
|
cookieStore.set({
|
||||||
|
name: "userSelection",
|
||||||
|
value: usersSelection,
|
||||||
|
...cookieObject,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return responseData;
|
||||||
|
}
|
||||||
|
|
||||||
|
async function login_select_occupant(payload: LoginSelectOccupant) {
|
||||||
|
let responseData = null;
|
||||||
|
const cookieStore = await cookies();
|
||||||
|
const nextCrypto = new NextCrypto(tokenSecret);
|
||||||
|
const selectResponse: any = await fetchDataWithToken(
|
||||||
|
loginSelectEndpoint,
|
||||||
|
payload.token,
|
||||||
|
{
|
||||||
|
build_part_uu_id: payload.build_part_uu_id,
|
||||||
|
occupant_uu_id: payload.occupant_uu_id,
|
||||||
|
},
|
||||||
|
"POST",
|
||||||
|
false
|
||||||
|
);
|
||||||
|
if (selectResponse.status === 200) {
|
||||||
|
responseData = await selectResponse?.json();
|
||||||
|
const usersSelection = await nextCrypto.encrypt(
|
||||||
|
JSON.stringify({
|
||||||
|
company_uu_id: {
|
||||||
|
build_part_uu_id: payload.build_part_uu_id,
|
||||||
|
occupant_uu_id: payload.occupant_uu_id,
|
||||||
|
},
|
||||||
|
user_type: "occupant",
|
||||||
|
})
|
||||||
|
);
|
||||||
|
cookieStore.set({
|
||||||
|
name: "userSelection",
|
||||||
|
value: usersSelection,
|
||||||
|
...cookieObject,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
return responseData;
|
||||||
|
}
|
||||||
|
|
||||||
|
export { login_via_access_keys, login_select_employee, login_select_occupant };
|
||||||
|
|
@ -2,20 +2,71 @@
|
||||||
@tailwind components;
|
@tailwind components;
|
||||||
@tailwind utilities;
|
@tailwind utilities;
|
||||||
|
|
||||||
:root {
|
body {
|
||||||
--background: #ffffff;
|
font-family: Arial, Helvetica, sans-serif;
|
||||||
--foreground: #171717;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
@layer base {
|
||||||
:root {
|
:root {
|
||||||
--background: #0a0a0a;
|
--background: 0 0% 100%;
|
||||||
--foreground: #ededed;
|
--foreground: 240 10% 3.9%;
|
||||||
|
--card: 0 0% 100%;
|
||||||
|
--card-foreground: 240 10% 3.9%;
|
||||||
|
--popover: 0 0% 100%;
|
||||||
|
--popover-foreground: 240 10% 3.9%;
|
||||||
|
--primary: 240 5.9% 10%;
|
||||||
|
--primary-foreground: 0 0% 98%;
|
||||||
|
--secondary: 240 4.8% 95.9%;
|
||||||
|
--secondary-foreground: 240 5.9% 10%;
|
||||||
|
--muted: 240 4.8% 95.9%;
|
||||||
|
--muted-foreground: 240 3.8% 46.1%;
|
||||||
|
--accent: 240 4.8% 95.9%;
|
||||||
|
--accent-foreground: 240 5.9% 10%;
|
||||||
|
--destructive: 0 84.2% 60.2%;
|
||||||
|
--destructive-foreground: 0 0% 98%;
|
||||||
|
--border: 240 5.9% 90%;
|
||||||
|
--input: 240 5.9% 90%;
|
||||||
|
--ring: 240 10% 3.9%;
|
||||||
|
--chart-1: 12 76% 61%;
|
||||||
|
--chart-2: 173 58% 39%;
|
||||||
|
--chart-3: 197 37% 24%;
|
||||||
|
--chart-4: 43 74% 66%;
|
||||||
|
--chart-5: 27 87% 67%;
|
||||||
|
--radius: 0.5rem;
|
||||||
|
}
|
||||||
|
.dark {
|
||||||
|
--background: 240 10% 3.9%;
|
||||||
|
--foreground: 0 0% 98%;
|
||||||
|
--card: 240 10% 3.9%;
|
||||||
|
--card-foreground: 0 0% 98%;
|
||||||
|
--popover: 240 10% 3.9%;
|
||||||
|
--popover-foreground: 0 0% 98%;
|
||||||
|
--primary: 0 0% 98%;
|
||||||
|
--primary-foreground: 240 5.9% 10%;
|
||||||
|
--secondary: 240 3.7% 15.9%;
|
||||||
|
--secondary-foreground: 0 0% 98%;
|
||||||
|
--muted: 240 3.7% 15.9%;
|
||||||
|
--muted-foreground: 240 5% 64.9%;
|
||||||
|
--accent: 240 3.7% 15.9%;
|
||||||
|
--accent-foreground: 0 0% 98%;
|
||||||
|
--destructive: 0 62.8% 30.6%;
|
||||||
|
--destructive-foreground: 0 0% 98%;
|
||||||
|
--border: 240 3.7% 15.9%;
|
||||||
|
--input: 240 3.7% 15.9%;
|
||||||
|
--ring: 240 4.9% 83.9%;
|
||||||
|
--chart-1: 220 70% 50%;
|
||||||
|
--chart-2: 160 60% 45%;
|
||||||
|
--chart-3: 30 80% 55%;
|
||||||
|
--chart-4: 280 65% 60%;
|
||||||
|
--chart-5: 340 75% 55%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
@layer base {
|
||||||
color: var(--foreground);
|
* {
|
||||||
background: var(--background);
|
@apply border-border;
|
||||||
font-family: Arial, Helvetica, sans-serif;
|
}
|
||||||
|
body {
|
||||||
|
@apply bg-background text-foreground;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,13 @@
|
||||||
|
"use server";
|
||||||
|
import LoginWithEmail from "@/components/login/loginwithemail";
|
||||||
|
import { check_access_token_is_valid } from "@/apicalls/cookies/token";
|
||||||
|
import { redirect } from "next/navigation";
|
||||||
|
|
||||||
|
export default async function MyForm() {
|
||||||
|
const token_is_valid = await check_access_token_is_valid();
|
||||||
|
if (token_is_valid) {
|
||||||
|
redirect("/login/select");
|
||||||
|
}
|
||||||
|
|
||||||
|
return <LoginWithEmail />;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,40 @@
|
||||||
|
"use server";
|
||||||
|
|
||||||
|
import LoginWithPhone from "@/components/login/loginwithephone";
|
||||||
|
import Image from "next/image";
|
||||||
|
import { check_access_token_is_valid } from "@/apicalls/cookies/token";
|
||||||
|
import { redirect } from "next/navigation";
|
||||||
|
|
||||||
|
export default async function MyForm() {
|
||||||
|
const token_is_valid = await check_access_token_is_valid();
|
||||||
|
if (token_is_valid) {
|
||||||
|
redirect("/login/select");
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="mt-10 sm:mx-auto sm:w-full sm:max-w-sm m-5">
|
||||||
|
<div className="sm:mx-auto sm:w-full sm:max-w-sm">
|
||||||
|
<Image
|
||||||
|
alt="Evyos"
|
||||||
|
src="/green-house.webp"
|
||||||
|
className="mx-auto w-auto"
|
||||||
|
width={100}
|
||||||
|
height={100}
|
||||||
|
/>
|
||||||
|
<h2 className="mt-10 text-center text-2xl/9 font-bold tracking-tight text-gray-900">
|
||||||
|
Telefon Numarası ile Giriş Yapın
|
||||||
|
</h2>
|
||||||
|
</div>
|
||||||
|
<LoginWithPhone />
|
||||||
|
<p className="mt-10 text-center text-sm/6 text-gray-500">
|
||||||
|
Üye değilmisiniz?{" "}
|
||||||
|
<a
|
||||||
|
href="#"
|
||||||
|
className="font-semibold text-slate-500 hover:text-slate-900"
|
||||||
|
>
|
||||||
|
Üye olmak için tıklayın
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,29 @@
|
||||||
|
"use server";
|
||||||
|
import React from "react";
|
||||||
|
|
||||||
|
import LoginEmployeeCard from "@/components/login/loginemployee";
|
||||||
|
import LoginOccupantCard from "@/components/login/loginoccupant";
|
||||||
|
import {
|
||||||
|
check_access_token_is_valid,
|
||||||
|
retrieve_user_type,
|
||||||
|
} from "@/apicalls/cookies/token";
|
||||||
|
import { redirect } from "next/navigation";
|
||||||
|
|
||||||
|
const SelectPage: React.FC = async () => {
|
||||||
|
const token_is_valid = await check_access_token_is_valid();
|
||||||
|
const userType = await retrieve_user_type();
|
||||||
|
if (!userType || !token_is_valid) {
|
||||||
|
redirect("/login/email");
|
||||||
|
}
|
||||||
|
return userType === "employee" ? (
|
||||||
|
<div>
|
||||||
|
<LoginEmployeeCard />
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<div>
|
||||||
|
<LoginOccupantCard />
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default SelectPage;
|
||||||
|
|
@ -0,0 +1,26 @@
|
||||||
|
import Link from "next/link";
|
||||||
|
interface BreadcrumbProps {
|
||||||
|
pageName: string;
|
||||||
|
}
|
||||||
|
const Breadcrumb = ({ pageName }: BreadcrumbProps) => {
|
||||||
|
return (
|
||||||
|
<div className="mb-6 flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
|
||||||
|
<h2 className="text-title-md2 font-semibold text-black dark:text-white">
|
||||||
|
{pageName}
|
||||||
|
</h2>
|
||||||
|
|
||||||
|
<nav>
|
||||||
|
<ol className="flex items-center gap-2">
|
||||||
|
<li>
|
||||||
|
<Link className="font-medium" href="/">
|
||||||
|
Dashboard /
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
<li className="font-medium text-primary">{pageName}</li>
|
||||||
|
</ol>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Breadcrumb;
|
||||||
|
|
@ -0,0 +1,273 @@
|
||||||
|
import Breadcrumb from "../Breadcrumbs/Breadcrumb";
|
||||||
|
|
||||||
|
const Calendar = () => {
|
||||||
|
return (
|
||||||
|
<div className="mx-auto max-w-7xl">
|
||||||
|
<Breadcrumb pageName="Calendar" />
|
||||||
|
|
||||||
|
{/* <!-- ====== Calendar Section Start ====== --> */}
|
||||||
|
<div className="w-full max-w-full rounded-sm border border-stroke bg-white shadow-default dark:border-strokedark dark:bg-boxdark">
|
||||||
|
<table className="w-full">
|
||||||
|
<thead>
|
||||||
|
<tr className="grid grid-cols-7 rounded-t-sm bg-primary text-white">
|
||||||
|
<th className="flex h-15 items-center justify-center rounded-tl-sm p-1 text-xs font-semibold sm:text-base xl:p-5">
|
||||||
|
<span className="hidden lg:block"> Sunday </span>
|
||||||
|
<span className="block lg:hidden"> Sun </span>
|
||||||
|
</th>
|
||||||
|
<th className="flex h-15 items-center justify-center p-1 text-xs font-semibold sm:text-base xl:p-5">
|
||||||
|
<span className="hidden lg:block"> Monday </span>
|
||||||
|
<span className="block lg:hidden"> Mon </span>
|
||||||
|
</th>
|
||||||
|
<th className="flex h-15 items-center justify-center p-1 text-xs font-semibold sm:text-base xl:p-5">
|
||||||
|
<span className="hidden lg:block"> Tuesday </span>
|
||||||
|
<span className="block lg:hidden"> Tue </span>
|
||||||
|
</th>
|
||||||
|
<th className="flex h-15 items-center justify-center p-1 text-xs font-semibold sm:text-base xl:p-5">
|
||||||
|
<span className="hidden lg:block"> Wednesday </span>
|
||||||
|
<span className="block lg:hidden"> Wed </span>
|
||||||
|
</th>
|
||||||
|
<th className="flex h-15 items-center justify-center p-1 text-xs font-semibold sm:text-base xl:p-5">
|
||||||
|
<span className="hidden lg:block"> Thursday </span>
|
||||||
|
<span className="block lg:hidden"> Thur </span>
|
||||||
|
</th>
|
||||||
|
<th className="flex h-15 items-center justify-center p-1 text-xs font-semibold sm:text-base xl:p-5">
|
||||||
|
<span className="hidden lg:block"> Friday </span>
|
||||||
|
<span className="block lg:hidden"> Fri </span>
|
||||||
|
</th>
|
||||||
|
<th className="flex h-15 items-center justify-center rounded-tr-sm p-1 text-xs font-semibold sm:text-base xl:p-5">
|
||||||
|
<span className="hidden lg:block"> Saturday </span>
|
||||||
|
<span className="block lg:hidden"> Sat </span>
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{/* <!-- Line 1 --> */}
|
||||||
|
<tr className="grid grid-cols-7">
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
1
|
||||||
|
</span>
|
||||||
|
<div className="group h-16 w-full flex-grow cursor-pointer py-1 md:h-30">
|
||||||
|
<span className="group-hover:text-primary md:hidden">
|
||||||
|
More
|
||||||
|
</span>
|
||||||
|
<div className="event invisible absolute left-2 z-99 mb-1 flex w-[200%] flex-col rounded-sm border-l-[3px] border-primary bg-gray px-3 py-1 text-left opacity-0 group-hover:visible group-hover:opacity-100 dark:bg-meta-4 md:visible md:w-[190%] md:opacity-100">
|
||||||
|
<span className="event-name text-sm font-semibold text-black dark:text-white">
|
||||||
|
Redesign Website
|
||||||
|
</span>
|
||||||
|
<span className="time text-sm font-medium text-black dark:text-white">
|
||||||
|
1 Dec - 2 Dec
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
2
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
3
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
4
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
5
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
6
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
7
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{/* <!-- Line 1 --> */}
|
||||||
|
{/* <!-- Line 2 --> */}
|
||||||
|
<tr className="grid grid-cols-7">
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
8
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
9
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
10
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
11
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
12
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
13
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
14
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{/* <!-- Line 2 --> */}
|
||||||
|
{/* <!-- Line 3 --> */}
|
||||||
|
<tr className="grid grid-cols-7">
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
15
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
16
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
17
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
18
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
19
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
20
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
21
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{/* <!-- Line 3 --> */}
|
||||||
|
{/* <!-- Line 4 --> */}
|
||||||
|
<tr className="grid grid-cols-7">
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
22
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
23
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
24
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
25
|
||||||
|
</span>
|
||||||
|
<div className="group h-16 w-full flex-grow cursor-pointer py-1 md:h-30">
|
||||||
|
<span className="group-hover:text-primary md:hidden">
|
||||||
|
More
|
||||||
|
</span>
|
||||||
|
<div className="event invisible absolute left-2 z-99 mb-1 flex w-[300%] flex-col rounded-sm border-l-[3px] border-primary bg-gray px-3 py-1 text-left opacity-0 group-hover:visible group-hover:opacity-100 dark:bg-meta-4 md:visible md:w-[290%] md:opacity-100">
|
||||||
|
<span className="event-name text-sm font-semibold text-black dark:text-white">
|
||||||
|
App Design
|
||||||
|
</span>
|
||||||
|
<span className="time text-sm font-medium text-black dark:text-white">
|
||||||
|
25 Dec - 27 Dec
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
26
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
27
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
28
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{/* <!-- Line 4 --> */}
|
||||||
|
{/* <!-- Line 5 --> */}
|
||||||
|
<tr className="grid grid-cols-7">
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
29
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
30
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
31
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
1
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
2
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
3
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
<td className="ease relative h-20 cursor-pointer border border-stroke p-2 transition duration-500 hover:bg-gray dark:border-strokedark dark:hover:bg-meta-4 md:h-25 md:p-6 xl:h-31">
|
||||||
|
<span className="font-medium text-black dark:text-white">
|
||||||
|
4
|
||||||
|
</span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{/* <!-- Line 5 --> */}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
{/* <!-- ====== Calendar Section End ====== --> */}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Calendar;
|
||||||
|
|
@ -0,0 +1,77 @@
|
||||||
|
import React, { ReactNode } from "react";
|
||||||
|
|
||||||
|
interface CardDataStatsProps {
|
||||||
|
title: string;
|
||||||
|
total: string;
|
||||||
|
rate: string;
|
||||||
|
levelUp?: boolean;
|
||||||
|
levelDown?: boolean;
|
||||||
|
children: ReactNode;
|
||||||
|
}
|
||||||
|
|
||||||
|
const CardDataStats: React.FC<CardDataStatsProps> = ({
|
||||||
|
title,
|
||||||
|
total,
|
||||||
|
rate,
|
||||||
|
levelUp,
|
||||||
|
levelDown,
|
||||||
|
children,
|
||||||
|
}) => {
|
||||||
|
return (
|
||||||
|
<div className="rounded-sm border border-stroke bg-white px-7.5 py-6 shadow-default dark:border-strokedark dark:bg-boxdark">
|
||||||
|
<div className="flex h-11.5 w-11.5 items-center justify-center rounded-full bg-meta-2 dark:bg-meta-4">
|
||||||
|
{children}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="mt-4 flex items-end justify-between">
|
||||||
|
<div>
|
||||||
|
<h4 className="text-title-md font-bold text-black dark:text-white">
|
||||||
|
{total}
|
||||||
|
</h4>
|
||||||
|
<span className="text-sm font-medium">{title}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<span
|
||||||
|
className={`flex items-center gap-1 text-sm font-medium ${
|
||||||
|
levelUp && "text-meta-3"
|
||||||
|
} ${levelDown && "text-meta-5"} `}
|
||||||
|
>
|
||||||
|
{rate}
|
||||||
|
|
||||||
|
{levelUp && (
|
||||||
|
<svg
|
||||||
|
className="fill-meta-3"
|
||||||
|
width="10"
|
||||||
|
height="11"
|
||||||
|
viewBox="0 0 10 11"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M4.35716 2.47737L0.908974 5.82987L5.0443e-07 4.94612L5 0.0848689L10 4.94612L9.09103 5.82987L5.64284 2.47737L5.64284 10.0849L4.35716 10.0849L4.35716 2.47737Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
)}
|
||||||
|
{levelDown && (
|
||||||
|
<svg
|
||||||
|
className="fill-meta-5"
|
||||||
|
width="10"
|
||||||
|
height="11"
|
||||||
|
viewBox="0 0 10 11"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M5.64284 7.69237L9.09102 4.33987L10 5.22362L5 10.0849L-8.98488e-07 5.22362L0.908973 4.33987L4.35716 7.69237L4.35716 0.0848701L5.64284 0.0848704L5.64284 7.69237Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
)}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default CardDataStats;
|
||||||
|
|
@ -0,0 +1,197 @@
|
||||||
|
"use client";
|
||||||
|
|
||||||
|
import { ApexOptions } from "apexcharts";
|
||||||
|
import React from "react";
|
||||||
|
import dynamic from "next/dynamic";
|
||||||
|
|
||||||
|
const ReactApexChart = dynamic(() => import("react-apexcharts"), {
|
||||||
|
ssr: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
const options: ApexOptions = {
|
||||||
|
legend: {
|
||||||
|
show: false,
|
||||||
|
position: "top",
|
||||||
|
horizontalAlign: "left",
|
||||||
|
},
|
||||||
|
colors: ["#3C50E0", "#80CAEE"],
|
||||||
|
chart: {
|
||||||
|
fontFamily: "Satoshi, sans-serif",
|
||||||
|
height: 335,
|
||||||
|
type: "area",
|
||||||
|
dropShadow: {
|
||||||
|
enabled: true,
|
||||||
|
color: "#623CEA14",
|
||||||
|
top: 10,
|
||||||
|
blur: 4,
|
||||||
|
left: 0,
|
||||||
|
opacity: 0.1,
|
||||||
|
},
|
||||||
|
|
||||||
|
toolbar: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
responsive: [
|
||||||
|
{
|
||||||
|
breakpoint: 1024,
|
||||||
|
options: {
|
||||||
|
chart: {
|
||||||
|
height: 300,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
breakpoint: 1366,
|
||||||
|
options: {
|
||||||
|
chart: {
|
||||||
|
height: 350,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
stroke: {
|
||||||
|
width: [2, 2],
|
||||||
|
curve: "straight",
|
||||||
|
},
|
||||||
|
// labels: {
|
||||||
|
// show: false,
|
||||||
|
// position: "top",
|
||||||
|
// },
|
||||||
|
grid: {
|
||||||
|
xaxis: {
|
||||||
|
lines: {
|
||||||
|
show: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
yaxis: {
|
||||||
|
lines: {
|
||||||
|
show: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
dataLabels: {
|
||||||
|
enabled: false,
|
||||||
|
},
|
||||||
|
markers: {
|
||||||
|
size: 4,
|
||||||
|
colors: "#fff",
|
||||||
|
strokeColors: ["#3056D3", "#80CAEE"],
|
||||||
|
strokeWidth: 3,
|
||||||
|
strokeOpacity: 0.9,
|
||||||
|
strokeDashArray: 0,
|
||||||
|
fillOpacity: 1,
|
||||||
|
discrete: [],
|
||||||
|
hover: {
|
||||||
|
size: undefined,
|
||||||
|
sizeOffset: 5,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
xaxis: {
|
||||||
|
type: "category",
|
||||||
|
categories: [
|
||||||
|
"Sep",
|
||||||
|
"Oct",
|
||||||
|
"Nov",
|
||||||
|
"Dec",
|
||||||
|
"Jan",
|
||||||
|
"Feb",
|
||||||
|
"Mar",
|
||||||
|
"Apr",
|
||||||
|
"May",
|
||||||
|
"Jun",
|
||||||
|
"Jul",
|
||||||
|
"Aug",
|
||||||
|
],
|
||||||
|
axisBorder: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
axisTicks: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
yaxis: {
|
||||||
|
title: {
|
||||||
|
style: {
|
||||||
|
fontSize: "0px",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
min: 0,
|
||||||
|
max: 100,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
interface ChartOneState {
|
||||||
|
series: {
|
||||||
|
name: string;
|
||||||
|
data: number[];
|
||||||
|
}[];
|
||||||
|
}
|
||||||
|
|
||||||
|
const ChartOne: React.FC = () => {
|
||||||
|
const series = [
|
||||||
|
{
|
||||||
|
name: "Product One",
|
||||||
|
data: [23, 11, 22, 27, 13, 22, 37, 21, 44, 22, 30, 45],
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
name: "Product Two",
|
||||||
|
data: [30, 25, 36, 30, 45, 35, 64, 52, 59, 36, 39, 51],
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="col-span-12 rounded-sm border border-stroke bg-white px-5 pb-5 pt-7.5 shadow-default dark:border-strokedark dark:bg-boxdark sm:px-7.5 xl:col-span-8">
|
||||||
|
<div className="flex flex-wrap items-start justify-between gap-3 sm:flex-nowrap">
|
||||||
|
<div className="flex w-full flex-wrap gap-3 sm:gap-5">
|
||||||
|
<div className="flex min-w-47.5">
|
||||||
|
<span className="mr-2 mt-1 flex h-4 w-full max-w-4 items-center justify-center rounded-full border border-primary">
|
||||||
|
<span className="block h-2.5 w-full max-w-2.5 rounded-full bg-primary"></span>
|
||||||
|
</span>
|
||||||
|
<div className="w-full">
|
||||||
|
<p className="font-semibold text-primary">Total Revenue</p>
|
||||||
|
<p className="text-sm font-medium">12.04.2022 - 12.05.2022</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="flex min-w-47.5">
|
||||||
|
<span className="mr-2 mt-1 flex h-4 w-full max-w-4 items-center justify-center rounded-full border border-secondary">
|
||||||
|
<span className="block h-2.5 w-full max-w-2.5 rounded-full bg-secondary"></span>
|
||||||
|
</span>
|
||||||
|
<div className="w-full">
|
||||||
|
<p className="font-semibold text-secondary">Total Sales</p>
|
||||||
|
<p className="text-sm font-medium">12.04.2022 - 12.05.2022</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="flex w-full max-w-45 justify-end">
|
||||||
|
<div className="inline-flex items-center rounded-md bg-whiter p-1.5 dark:bg-meta-4">
|
||||||
|
<button className="rounded bg-white px-3 py-1 text-xs font-medium text-black shadow-card hover:bg-white hover:shadow-card dark:bg-boxdark dark:text-white dark:hover:bg-boxdark">
|
||||||
|
Day
|
||||||
|
</button>
|
||||||
|
<button className="rounded px-3 py-1 text-xs font-medium text-black hover:bg-white hover:shadow-card dark:text-white dark:hover:bg-boxdark">
|
||||||
|
Week
|
||||||
|
</button>
|
||||||
|
<button className="rounded px-3 py-1 text-xs font-medium text-black hover:bg-white hover:shadow-card dark:text-white dark:hover:bg-boxdark">
|
||||||
|
Month
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<div id="chartOne" className="-ml-5">
|
||||||
|
<ReactApexChart
|
||||||
|
options={options}
|
||||||
|
series={series}
|
||||||
|
type="area"
|
||||||
|
height={350}
|
||||||
|
width={"100%"}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ChartOne;
|
||||||
|
|
@ -0,0 +1,149 @@
|
||||||
|
import { ApexOptions } from "apexcharts";
|
||||||
|
import React from "react";
|
||||||
|
import ReactApexChart from "react-apexcharts";
|
||||||
|
|
||||||
|
interface ChartThreeState {
|
||||||
|
series: number[];
|
||||||
|
}
|
||||||
|
|
||||||
|
const options: ApexOptions = {
|
||||||
|
chart: {
|
||||||
|
fontFamily: "Satoshi, sans-serif",
|
||||||
|
type: "donut",
|
||||||
|
},
|
||||||
|
colors: ["#3C50E0", "#6577F3", "#8FD0EF", "#0FADCF"],
|
||||||
|
labels: ["Desktop", "Tablet", "Mobile", "Unknown"],
|
||||||
|
legend: {
|
||||||
|
show: false,
|
||||||
|
position: "bottom",
|
||||||
|
},
|
||||||
|
|
||||||
|
plotOptions: {
|
||||||
|
pie: {
|
||||||
|
donut: {
|
||||||
|
size: "65%",
|
||||||
|
background: "transparent",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
dataLabels: {
|
||||||
|
enabled: false,
|
||||||
|
},
|
||||||
|
responsive: [
|
||||||
|
{
|
||||||
|
breakpoint: 2600,
|
||||||
|
options: {
|
||||||
|
chart: {
|
||||||
|
width: 380,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
breakpoint: 640,
|
||||||
|
options: {
|
||||||
|
chart: {
|
||||||
|
width: 200,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
|
||||||
|
const ChartThree: React.FC = () => {
|
||||||
|
const series = [65, 34, 12, 56];
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="col-span-12 rounded-sm border border-stroke bg-white px-5 pb-5 pt-7.5 shadow-default dark:border-strokedark dark:bg-boxdark sm:px-7.5 xl:col-span-5">
|
||||||
|
<div className="mb-3 justify-between gap-4 sm:flex">
|
||||||
|
<div>
|
||||||
|
<h5 className="text-xl font-semibold text-black dark:text-white">
|
||||||
|
Visitors Analytics
|
||||||
|
</h5>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div className="relative z-20 inline-block">
|
||||||
|
<select
|
||||||
|
name=""
|
||||||
|
id=""
|
||||||
|
className="relative z-20 inline-flex appearance-none bg-transparent py-1 pl-3 pr-8 text-sm font-medium outline-none"
|
||||||
|
>
|
||||||
|
<option value="" className="dark:bg-boxdark">
|
||||||
|
Monthly
|
||||||
|
</option>
|
||||||
|
<option value="" className="dark:bg-boxdark">
|
||||||
|
Yearly
|
||||||
|
</option>
|
||||||
|
</select>
|
||||||
|
<span className="absolute right-3 top-1/2 z-10 -translate-y-1/2">
|
||||||
|
<svg
|
||||||
|
width="10"
|
||||||
|
height="6"
|
||||||
|
viewBox="0 0 10 6"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M0.47072 1.08816C0.47072 1.02932 0.500141 0.955772 0.54427 0.911642C0.647241 0.808672 0.809051 0.808672 0.912022 0.896932L4.85431 4.60386C4.92785 4.67741 5.06025 4.67741 5.14851 4.60386L9.09079 0.896932C9.19376 0.793962 9.35557 0.808672 9.45854 0.911642C9.56151 1.01461 9.5468 1.17642 9.44383 1.27939L5.50155 4.98632C5.22206 5.23639 4.78076 5.23639 4.51598 4.98632L0.558981 1.27939C0.50014 1.22055 0.47072 1.16171 0.47072 1.08816Z"
|
||||||
|
fill="#637381"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
fillRule="evenodd"
|
||||||
|
clipRule="evenodd"
|
||||||
|
d="M1.22659 0.546578L5.00141 4.09604L8.76422 0.557869C9.08459 0.244537 9.54201 0.329403 9.79139 0.578788C10.112 0.899434 10.0277 1.36122 9.77668 1.61224L9.76644 1.62248L5.81552 5.33722C5.36257 5.74249 4.6445 5.7544 4.19352 5.32924C4.19327 5.32901 4.19377 5.32948 4.19352 5.32924L0.225953 1.61241C0.102762 1.48922 -4.20186e-08 1.31674 -3.20269e-08 1.08816C-2.40601e-08 0.905899 0.0780105 0.712197 0.211421 0.578787C0.494701 0.295506 0.935574 0.297138 1.21836 0.539529L1.22659 0.546578ZM4.51598 4.98632C4.78076 5.23639 5.22206 5.23639 5.50155 4.98632L9.44383 1.27939C9.5468 1.17642 9.56151 1.01461 9.45854 0.911642C9.35557 0.808672 9.19376 0.793962 9.09079 0.896932L5.14851 4.60386C5.06025 4.67741 4.92785 4.67741 4.85431 4.60386L0.912022 0.896932C0.809051 0.808672 0.647241 0.808672 0.54427 0.911642C0.500141 0.955772 0.47072 1.02932 0.47072 1.08816C0.47072 1.16171 0.50014 1.22055 0.558981 1.27939L4.51598 4.98632Z"
|
||||||
|
fill="#637381"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="mb-2">
|
||||||
|
<div id="chartThree" className="mx-auto flex justify-center">
|
||||||
|
<ReactApexChart options={options} series={series} type="donut" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="-mx-8 flex flex-wrap items-center justify-center gap-y-3">
|
||||||
|
<div className="w-full px-8 sm:w-1/2">
|
||||||
|
<div className="flex w-full items-center">
|
||||||
|
<span className="mr-2 block h-3 w-full max-w-3 rounded-full bg-primary"></span>
|
||||||
|
<p className="flex w-full justify-between text-sm font-medium text-black dark:text-white">
|
||||||
|
<span> Desktop </span>
|
||||||
|
<span> 65% </span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="w-full px-8 sm:w-1/2">
|
||||||
|
<div className="flex w-full items-center">
|
||||||
|
<span className="mr-2 block h-3 w-full max-w-3 rounded-full bg-[#6577F3]"></span>
|
||||||
|
<p className="flex w-full justify-between text-sm font-medium text-black dark:text-white">
|
||||||
|
<span> Tablet </span>
|
||||||
|
<span> 34% </span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="w-full px-8 sm:w-1/2">
|
||||||
|
<div className="flex w-full items-center">
|
||||||
|
<span className="mr-2 block h-3 w-full max-w-3 rounded-full bg-[#8FD0EF]"></span>
|
||||||
|
<p className="flex w-full justify-between text-sm font-medium text-black dark:text-white">
|
||||||
|
<span> Mobile </span>
|
||||||
|
<span> 45% </span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="w-full px-8 sm:w-1/2">
|
||||||
|
<div className="flex w-full items-center">
|
||||||
|
<span className="mr-2 block h-3 w-full max-w-3 rounded-full bg-[#0FADCF]"></span>
|
||||||
|
<p className="flex w-full justify-between text-sm font-medium text-black dark:text-white">
|
||||||
|
<span> Unknown </span>
|
||||||
|
<span> 12% </span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ChartThree;
|
||||||
|
|
@ -0,0 +1,151 @@
|
||||||
|
"use client";
|
||||||
|
|
||||||
|
import { ApexOptions } from "apexcharts";
|
||||||
|
import React from "react";
|
||||||
|
import dynamic from "next/dynamic";
|
||||||
|
|
||||||
|
const ReactApexChart = dynamic(() => import("react-apexcharts"), {
|
||||||
|
ssr: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
const options: ApexOptions = {
|
||||||
|
colors: ["#3C50E0", "#80CAEE"],
|
||||||
|
chart: {
|
||||||
|
fontFamily: "Satoshi, sans-serif",
|
||||||
|
type: "bar",
|
||||||
|
height: 335,
|
||||||
|
stacked: true,
|
||||||
|
toolbar: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
zoom: {
|
||||||
|
enabled: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
responsive: [
|
||||||
|
{
|
||||||
|
breakpoint: 1536,
|
||||||
|
options: {
|
||||||
|
plotOptions: {
|
||||||
|
bar: {
|
||||||
|
borderRadius: 0,
|
||||||
|
columnWidth: "25%",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
plotOptions: {
|
||||||
|
bar: {
|
||||||
|
horizontal: false,
|
||||||
|
borderRadius: 0,
|
||||||
|
columnWidth: "25%",
|
||||||
|
borderRadiusApplication: "end",
|
||||||
|
borderRadiusWhenStacked: "last",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
dataLabels: {
|
||||||
|
enabled: false,
|
||||||
|
},
|
||||||
|
|
||||||
|
xaxis: {
|
||||||
|
categories: ["M", "T", "W", "T", "F", "S", "S"],
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
position: "top",
|
||||||
|
horizontalAlign: "left",
|
||||||
|
fontFamily: "Satoshi",
|
||||||
|
fontWeight: 500,
|
||||||
|
fontSize: "14px",
|
||||||
|
|
||||||
|
markers: {
|
||||||
|
radius: 99,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
fill: {
|
||||||
|
opacity: 1,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
interface ChartTwoState {
|
||||||
|
series: {
|
||||||
|
name: string;
|
||||||
|
data: number[];
|
||||||
|
}[];
|
||||||
|
}
|
||||||
|
|
||||||
|
const ChartTwo: React.FC = () => {
|
||||||
|
const series = [
|
||||||
|
{
|
||||||
|
name: "Sales",
|
||||||
|
data: [44, 55, 41, 67, 22, 43, 65],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "Revenue",
|
||||||
|
data: [13, 23, 20, 8, 13, 27, 15],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="col-span-12 rounded-sm border border-stroke bg-white p-7.5 shadow-default dark:border-strokedark dark:bg-boxdark xl:col-span-4">
|
||||||
|
<div className="mb-4 justify-between gap-4 sm:flex">
|
||||||
|
<div>
|
||||||
|
<h4 className="text-xl font-semibold text-black dark:text-white">
|
||||||
|
Profit this week
|
||||||
|
</h4>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div className="relative z-20 inline-block">
|
||||||
|
<select
|
||||||
|
name="#"
|
||||||
|
id="#"
|
||||||
|
className="relative z-20 inline-flex appearance-none bg-transparent py-1 pl-3 pr-8 text-sm font-medium outline-none"
|
||||||
|
>
|
||||||
|
<option value="" className="dark:bg-boxdark">
|
||||||
|
This Week
|
||||||
|
</option>
|
||||||
|
<option value="" className="dark:bg-boxdark">
|
||||||
|
Last Week
|
||||||
|
</option>
|
||||||
|
</select>
|
||||||
|
<span className="absolute right-3 top-1/2 z-10 -translate-y-1/2">
|
||||||
|
<svg
|
||||||
|
width="10"
|
||||||
|
height="6"
|
||||||
|
viewBox="0 0 10 6"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M0.47072 1.08816C0.47072 1.02932 0.500141 0.955772 0.54427 0.911642C0.647241 0.808672 0.809051 0.808672 0.912022 0.896932L4.85431 4.60386C4.92785 4.67741 5.06025 4.67741 5.14851 4.60386L9.09079 0.896932C9.19376 0.793962 9.35557 0.808672 9.45854 0.911642C9.56151 1.01461 9.5468 1.17642 9.44383 1.27939L5.50155 4.98632C5.22206 5.23639 4.78076 5.23639 4.51598 4.98632L0.558981 1.27939C0.50014 1.22055 0.47072 1.16171 0.47072 1.08816Z"
|
||||||
|
fill="#637381"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
fillRule="evenodd"
|
||||||
|
clipRule="evenodd"
|
||||||
|
d="M1.22659 0.546578L5.00141 4.09604L8.76422 0.557869C9.08459 0.244537 9.54201 0.329403 9.79139 0.578788C10.112 0.899434 10.0277 1.36122 9.77668 1.61224L9.76644 1.62248L5.81552 5.33722C5.36257 5.74249 4.6445 5.7544 4.19352 5.32924C4.19327 5.32901 4.19377 5.32948 4.19352 5.32924L0.225953 1.61241C0.102762 1.48922 -4.20186e-08 1.31674 -3.20269e-08 1.08816C-2.40601e-08 0.905899 0.0780105 0.712197 0.211421 0.578787C0.494701 0.295506 0.935574 0.297138 1.21836 0.539529L1.22659 0.546578ZM4.51598 4.98632C4.78076 5.23639 5.22206 5.23639 5.50155 4.98632L9.44383 1.27939C9.5468 1.17642 9.56151 1.01461 9.45854 0.911642C9.35557 0.808672 9.19376 0.793962 9.09079 0.896932L5.14851 4.60386C5.06025 4.67741 4.92785 4.67741 4.85431 4.60386L0.912022 0.896932C0.809051 0.808672 0.647241 0.808672 0.54427 0.911642C0.500141 0.955772 0.47072 1.02932 0.47072 1.08816C0.47072 1.16171 0.50014 1.22055 0.558981 1.27939L4.51598 4.98632Z"
|
||||||
|
fill="#637381"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<div id="chartTwo" className="-mb-9 -ml-5">
|
||||||
|
<ReactApexChart
|
||||||
|
options={options}
|
||||||
|
series={series}
|
||||||
|
type="bar"
|
||||||
|
height={350}
|
||||||
|
width={"100%"}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ChartTwo;
|
||||||
|
|
@ -0,0 +1,26 @@
|
||||||
|
"use client";
|
||||||
|
import Breadcrumb from "@/components/Breadcrumbs/Breadcrumb";
|
||||||
|
import ChartOne from "@/components/Charts/ChartOne";
|
||||||
|
import ChartTwo from "@/components/Charts/ChartTwo";
|
||||||
|
import dynamic from "next/dynamic";
|
||||||
|
import React from "react";
|
||||||
|
|
||||||
|
const ChartThree = dynamic(() => import("@/components/Charts/ChartThree"), {
|
||||||
|
ssr: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
const Chart: React.FC = () => {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Breadcrumb pageName="Chart" />
|
||||||
|
|
||||||
|
<div className="grid grid-cols-12 gap-4 md:gap-6 2xl:gap-7.5">
|
||||||
|
<ChartOne />
|
||||||
|
<ChartTwo />
|
||||||
|
<ChartThree />
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Chart;
|
||||||
|
|
@ -0,0 +1,116 @@
|
||||||
|
import Link from "next/link";
|
||||||
|
import Image from "next/image";
|
||||||
|
import { Chat } from "@/types/chat";
|
||||||
|
|
||||||
|
const chatData: Chat[] = [
|
||||||
|
{
|
||||||
|
avatar: "/images/user/user-01.png",
|
||||||
|
name: "Devid Heilo",
|
||||||
|
text: "How are you?",
|
||||||
|
time: 12,
|
||||||
|
textCount: 3,
|
||||||
|
dot: 3,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
avatar: "/images/user/user-02.png",
|
||||||
|
name: "Henry Fisher",
|
||||||
|
text: "Waiting for you!",
|
||||||
|
time: 12,
|
||||||
|
textCount: 0,
|
||||||
|
dot: 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
avatar: "/images/user/user-04.png",
|
||||||
|
name: "Jhon Doe",
|
||||||
|
text: "What's up?",
|
||||||
|
time: 32,
|
||||||
|
textCount: 0,
|
||||||
|
dot: 3,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
avatar: "/images/user/user-05.png",
|
||||||
|
name: "Jane Doe",
|
||||||
|
text: "Great",
|
||||||
|
time: 32,
|
||||||
|
textCount: 2,
|
||||||
|
dot: 6,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
avatar: "/images/user/user-01.png",
|
||||||
|
name: "Jhon Doe",
|
||||||
|
text: "How are you?",
|
||||||
|
time: 32,
|
||||||
|
textCount: 0,
|
||||||
|
dot: 3,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
avatar: "/images/user/user-03.png",
|
||||||
|
name: "Jhon Doe",
|
||||||
|
text: "How are you?",
|
||||||
|
time: 32,
|
||||||
|
textCount: 3,
|
||||||
|
dot: 6,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
const ChatCard = () => {
|
||||||
|
return (
|
||||||
|
<div className="col-span-12 rounded-sm border border-stroke bg-white py-6 shadow-default dark:border-strokedark dark:bg-boxdark xl:col-span-4">
|
||||||
|
<h4 className="mb-6 px-7.5 text-xl font-semibold text-black dark:text-white">
|
||||||
|
Chats
|
||||||
|
</h4>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{chatData.map((chat, key) => (
|
||||||
|
<Link
|
||||||
|
href="/"
|
||||||
|
className="flex items-center gap-5 px-7.5 py-3 hover:bg-gray-3 dark:hover:bg-meta-4"
|
||||||
|
key={key}
|
||||||
|
>
|
||||||
|
<div className="relative h-14 w-14 rounded-full">
|
||||||
|
<Image
|
||||||
|
width={56}
|
||||||
|
height={56}
|
||||||
|
src={chat.avatar}
|
||||||
|
alt="User"
|
||||||
|
style={{
|
||||||
|
width: "auto",
|
||||||
|
height: "auto",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
className={`absolute bottom-0 right-0 h-3.5 w-3.5 rounded-full border-2 border-white ${
|
||||||
|
chat.dot === 6 ? "bg-meta-6" : `bg-meta-${chat.dot}`
|
||||||
|
} `}
|
||||||
|
></span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex flex-1 items-center justify-between">
|
||||||
|
<div>
|
||||||
|
<h5 className="font-medium text-black dark:text-white">
|
||||||
|
{chat.name}
|
||||||
|
</h5>
|
||||||
|
<p>
|
||||||
|
<span className="text-sm text-black dark:text-white">
|
||||||
|
{chat.text}
|
||||||
|
</span>
|
||||||
|
<span className="text-xs"> . {chat.time} min</span>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
{chat.textCount !== 0 && (
|
||||||
|
<div className="flex h-6 w-6 items-center justify-center rounded-full bg-primary">
|
||||||
|
<span className="text-sm font-medium text-white">
|
||||||
|
{" "}
|
||||||
|
{chat.textCount}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ChatCard;
|
||||||
|
|
@ -0,0 +1,35 @@
|
||||||
|
import { useState } from "react";
|
||||||
|
|
||||||
|
const CheckboxFive = () => {
|
||||||
|
const [isChecked, setIsChecked] = useState<boolean>(false);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<label
|
||||||
|
htmlFor="checkboxLabelFive"
|
||||||
|
className="flex cursor-pointer select-none items-center"
|
||||||
|
>
|
||||||
|
<div className="relative">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
id="checkboxLabelFive"
|
||||||
|
className="sr-only"
|
||||||
|
onChange={() => {
|
||||||
|
setIsChecked(!isChecked);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
className={`box mr-4 flex h-5 w-5 items-center justify-center rounded-full border border-primary ${
|
||||||
|
isChecked && "!border-4"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<span className="h-2.5 w-2.5 rounded-full bg-white dark:bg-transparent"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
Checkbox Text
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default CheckboxFive;
|
||||||
|
|
@ -0,0 +1,41 @@
|
||||||
|
import { useState } from "react";
|
||||||
|
|
||||||
|
const CheckboxFour = () => {
|
||||||
|
const [isChecked, setIsChecked] = useState<boolean>(false);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<label
|
||||||
|
htmlFor="checkboxLabelFour"
|
||||||
|
className="flex cursor-pointer select-none items-center"
|
||||||
|
>
|
||||||
|
<div className="relative">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
id="checkboxLabelFour"
|
||||||
|
className="sr-only"
|
||||||
|
onChange={() => {
|
||||||
|
setIsChecked(!isChecked);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
className={`mr-4 flex h-5 w-5 items-center justify-center rounded-full border ${
|
||||||
|
isChecked && "border-primary"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
className={`h-2.5 w-2.5 rounded-full bg-transparent ${
|
||||||
|
isChecked && "!bg-primary"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
{" "}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
Checkbox Text
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default CheckboxFour;
|
||||||
|
|
@ -0,0 +1,37 @@
|
||||||
|
import { useState } from "react";
|
||||||
|
|
||||||
|
const CheckboxOne = () => {
|
||||||
|
const [isChecked, setIsChecked] = useState<boolean>(false);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<label
|
||||||
|
htmlFor="checkboxLabelOne"
|
||||||
|
className="flex cursor-pointer select-none items-center"
|
||||||
|
>
|
||||||
|
<div className="relative">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
id="checkboxLabelOne"
|
||||||
|
className="sr-only"
|
||||||
|
onChange={() => {
|
||||||
|
setIsChecked(!isChecked);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
className={`mr-4 flex h-5 w-5 items-center justify-center rounded border ${
|
||||||
|
isChecked && "border-primary bg-gray dark:bg-transparent"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
className={`h-2.5 w-2.5 rounded-sm ${isChecked && "bg-primary"}`}
|
||||||
|
></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
Checkbox Text
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default CheckboxOne;
|
||||||
|
|
@ -0,0 +1,53 @@
|
||||||
|
import { useState } from "react";
|
||||||
|
|
||||||
|
const CheckboxThree = () => {
|
||||||
|
const [isChecked, setIsChecked] = useState<boolean>(false);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<label
|
||||||
|
htmlFor="checkboxLabelThree"
|
||||||
|
className="flex cursor-pointer select-none items-center"
|
||||||
|
>
|
||||||
|
<div className="relative">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
id="checkboxLabelThree"
|
||||||
|
className="sr-only"
|
||||||
|
onChange={() => {
|
||||||
|
setIsChecked(!isChecked);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
className={`box mr-4 flex h-5 w-5 items-center justify-center rounded border ${
|
||||||
|
isChecked && "border-primary bg-gray dark:bg-transparent"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
className={`text-primary opacity-0 ${
|
||||||
|
isChecked && "!opacity-100"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
className="h-3.5 w-3.5 stroke-current"
|
||||||
|
fill="none"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
strokeWidth="2"
|
||||||
|
d="M6 18L18 6M6 6l12 12"
|
||||||
|
></path>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
Checkbox Text
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default CheckboxThree;
|
||||||
|
|
@ -0,0 +1,50 @@
|
||||||
|
import { useState } from "react";
|
||||||
|
|
||||||
|
const CheckboxTwo = () => {
|
||||||
|
const [isChecked, setIsChecked] = useState<boolean>(false);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<label
|
||||||
|
htmlFor="checkboxLabelTwo"
|
||||||
|
className="flex cursor-pointer select-none items-center"
|
||||||
|
>
|
||||||
|
<div className="relative">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
id="checkboxLabelTwo"
|
||||||
|
className="sr-only"
|
||||||
|
onChange={() => {
|
||||||
|
setIsChecked(!isChecked);
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<div
|
||||||
|
className={`mr-4 flex h-5 w-5 items-center justify-center rounded border ${
|
||||||
|
isChecked && "border-primary bg-gray dark:bg-transparent"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<span className={`opacity-0 ${isChecked && "!opacity-100"}`}>
|
||||||
|
<svg
|
||||||
|
width="11"
|
||||||
|
height="8"
|
||||||
|
viewBox="0 0 11 8"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M10.0915 0.951972L10.0867 0.946075L10.0813 0.940568C9.90076 0.753564 9.61034 0.753146 9.42927 0.939309L4.16201 6.22962L1.58507 3.63469C1.40401 3.44841 1.11351 3.44879 0.932892 3.63584C0.755703 3.81933 0.755703 4.10875 0.932892 4.29224L0.932878 4.29225L0.934851 4.29424L3.58046 6.95832C3.73676 7.11955 3.94983 7.2 4.1473 7.2C4.36196 7.2 4.55963 7.11773 4.71406 6.9584L10.0468 1.60234C10.2436 1.4199 10.2421 1.1339 10.0915 0.951972ZM4.2327 6.30081L4.2317 6.2998C4.23206 6.30015 4.23237 6.30049 4.23269 6.30082L4.2327 6.30081Z"
|
||||||
|
fill="#3056D3"
|
||||||
|
stroke="#3056D3"
|
||||||
|
strokeWidth="0.4"
|
||||||
|
></path>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
Checkbox Text
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default CheckboxTwo;
|
||||||
|
|
@ -0,0 +1,51 @@
|
||||||
|
import React, { useRef, useEffect } from "react";
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
children: React.ReactNode;
|
||||||
|
exceptionRef?: React.RefObject<HTMLElement>;
|
||||||
|
onClick: () => void;
|
||||||
|
className?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const ClickOutside: React.FC<Props> = ({
|
||||||
|
children,
|
||||||
|
exceptionRef,
|
||||||
|
onClick,
|
||||||
|
className,
|
||||||
|
}) => {
|
||||||
|
const wrapperRef = useRef<HTMLDivElement>(null);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const handleClickListener = (event: MouseEvent) => {
|
||||||
|
let clickedInside: null | boolean = false;
|
||||||
|
if (exceptionRef) {
|
||||||
|
clickedInside =
|
||||||
|
(wrapperRef.current &&
|
||||||
|
wrapperRef.current.contains(event.target as Node)) ||
|
||||||
|
(exceptionRef.current && exceptionRef.current === event.target) ||
|
||||||
|
(exceptionRef.current &&
|
||||||
|
exceptionRef.current.contains(event.target as Node));
|
||||||
|
} else {
|
||||||
|
clickedInside =
|
||||||
|
wrapperRef.current &&
|
||||||
|
wrapperRef.current.contains(event.target as Node);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!clickedInside) onClick();
|
||||||
|
};
|
||||||
|
|
||||||
|
document.addEventListener("mousedown", handleClickListener);
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
document.removeEventListener("mousedown", handleClickListener);
|
||||||
|
};
|
||||||
|
}, [exceptionRef, onClick]);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div ref={wrapperRef} className={`${className || ""}`}>
|
||||||
|
{children}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ClickOutside;
|
||||||
|
|
@ -0,0 +1,122 @@
|
||||||
|
"use client";
|
||||||
|
import dynamic from "next/dynamic";
|
||||||
|
import React from "react";
|
||||||
|
import ChartOne from "../Charts/ChartOne";
|
||||||
|
import ChartTwo from "../Charts/ChartTwo";
|
||||||
|
import ChatCard from "../Chat/ChatCard";
|
||||||
|
import TableOne from "../Tables/TableOne";
|
||||||
|
import CardDataStats from "../CardDataStats";
|
||||||
|
|
||||||
|
const MapOne = dynamic(() => import("@/components/Maps/MapOne"), {
|
||||||
|
ssr: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
const ChartThree = dynamic(() => import("@/components/Charts/ChartThree"), {
|
||||||
|
ssr: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
const ECommerce: React.FC = () => {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className="grid grid-cols-1 gap-4 md:grid-cols-2 md:gap-6 xl:grid-cols-4 2xl:gap-7.5">
|
||||||
|
<CardDataStats title="Total views" total="$3.456K" rate="0.43%" levelUp>
|
||||||
|
<svg
|
||||||
|
className="fill-primary dark:fill-white"
|
||||||
|
width="22"
|
||||||
|
height="16"
|
||||||
|
viewBox="0 0 22 16"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M11 15.1156C4.19376 15.1156 0.825012 8.61876 0.687512 8.34376C0.584387 8.13751 0.584387 7.86251 0.687512 7.65626C0.825012 7.38126 4.19376 0.918762 11 0.918762C17.8063 0.918762 21.175 7.38126 21.3125 7.65626C21.4156 7.86251 21.4156 8.13751 21.3125 8.34376C21.175 8.61876 17.8063 15.1156 11 15.1156ZM2.26876 8.00001C3.02501 9.27189 5.98126 13.5688 11 13.5688C16.0188 13.5688 18.975 9.27189 19.7313 8.00001C18.975 6.72814 16.0188 2.43126 11 2.43126C5.98126 2.43126 3.02501 6.72814 2.26876 8.00001Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M11 10.9219C9.38438 10.9219 8.07812 9.61562 8.07812 8C8.07812 6.38438 9.38438 5.07812 11 5.07812C12.6156 5.07812 13.9219 6.38438 13.9219 8C13.9219 9.61562 12.6156 10.9219 11 10.9219ZM11 6.625C10.2437 6.625 9.625 7.24375 9.625 8C9.625 8.75625 10.2437 9.375 11 9.375C11.7563 9.375 12.375 8.75625 12.375 8C12.375 7.24375 11.7563 6.625 11 6.625Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</CardDataStats>
|
||||||
|
<CardDataStats title="Total Profit" total="$45,2K" rate="4.35%" levelUp>
|
||||||
|
<svg
|
||||||
|
className="fill-primary dark:fill-white"
|
||||||
|
width="20"
|
||||||
|
height="22"
|
||||||
|
viewBox="0 0 20 22"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M11.7531 16.4312C10.3781 16.4312 9.27808 17.5312 9.27808 18.9062C9.27808 20.2812 10.3781 21.3812 11.7531 21.3812C13.1281 21.3812 14.2281 20.2812 14.2281 18.9062C14.2281 17.5656 13.0937 16.4312 11.7531 16.4312ZM11.7531 19.8687C11.2375 19.8687 10.825 19.4562 10.825 18.9406C10.825 18.425 11.2375 18.0125 11.7531 18.0125C12.2687 18.0125 12.6812 18.425 12.6812 18.9406C12.6812 19.4219 12.2343 19.8687 11.7531 19.8687Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M5.22183 16.4312C3.84683 16.4312 2.74683 17.5312 2.74683 18.9062C2.74683 20.2812 3.84683 21.3812 5.22183 21.3812C6.59683 21.3812 7.69683 20.2812 7.69683 18.9062C7.69683 17.5656 6.56245 16.4312 5.22183 16.4312ZM5.22183 19.8687C4.7062 19.8687 4.2937 19.4562 4.2937 18.9406C4.2937 18.425 4.7062 18.0125 5.22183 18.0125C5.73745 18.0125 6.14995 18.425 6.14995 18.9406C6.14995 19.4219 5.73745 19.8687 5.22183 19.8687Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M19.0062 0.618744H17.15C16.325 0.618744 15.6031 1.23749 15.5 2.06249L14.95 6.01562H1.37185C1.0281 6.01562 0.684353 6.18749 0.443728 6.46249C0.237478 6.73749 0.134353 7.11562 0.237478 7.45937C0.237478 7.49374 0.237478 7.49374 0.237478 7.52812L2.36873 13.9562C2.50623 14.4375 2.9531 14.7812 3.46873 14.7812H12.9562C14.2281 14.7812 15.3281 13.8187 15.5 12.5469L16.9437 2.26874C16.9437 2.19999 17.0125 2.16562 17.0812 2.16562H18.9375C19.35 2.16562 19.7281 1.82187 19.7281 1.37499C19.7281 0.928119 19.4187 0.618744 19.0062 0.618744ZM14.0219 12.3062C13.9531 12.8219 13.5062 13.2 12.9906 13.2H3.7781L1.92185 7.56249H14.7094L14.0219 12.3062Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</CardDataStats>
|
||||||
|
<CardDataStats title="Total Product" total="2.450" rate="2.59%" levelUp>
|
||||||
|
<svg
|
||||||
|
className="fill-primary dark:fill-white"
|
||||||
|
width="22"
|
||||||
|
height="22"
|
||||||
|
viewBox="0 0 22 22"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M21.1063 18.0469L19.3875 3.23126C19.2157 1.71876 17.9438 0.584381 16.3969 0.584381H5.56878C4.05628 0.584381 2.78441 1.71876 2.57816 3.23126L0.859406 18.0469C0.756281 18.9063 1.03128 19.7313 1.61566 20.3844C2.20003 21.0375 2.99066 21.3813 3.85003 21.3813H18.1157C18.975 21.3813 19.8 21.0031 20.35 20.3844C20.9 19.7656 21.2094 18.9063 21.1063 18.0469ZM19.2157 19.3531C18.9407 19.6625 18.5625 19.8344 18.15 19.8344H3.85003C3.43753 19.8344 3.05941 19.6625 2.78441 19.3531C2.50941 19.0438 2.37191 18.6313 2.44066 18.2188L4.12503 3.43751C4.19378 2.71563 4.81253 2.16563 5.56878 2.16563H16.4313C17.1532 2.16563 17.7719 2.71563 17.875 3.43751L19.5938 18.2531C19.6282 18.6656 19.4907 19.0438 19.2157 19.3531Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M14.3345 5.29375C13.922 5.39688 13.647 5.80938 13.7501 6.22188C13.7845 6.42813 13.8189 6.63438 13.8189 6.80625C13.8189 8.35313 12.547 9.625 11.0001 9.625C9.45327 9.625 8.1814 8.35313 8.1814 6.80625C8.1814 6.6 8.21577 6.42813 8.25015 6.22188C8.35327 5.80938 8.07827 5.39688 7.66577 5.29375C7.25327 5.19063 6.84077 5.46563 6.73765 5.87813C6.6689 6.1875 6.63452 6.49688 6.63452 6.80625C6.63452 9.2125 8.5939 11.1719 11.0001 11.1719C13.4064 11.1719 15.3658 9.2125 15.3658 6.80625C15.3658 6.49688 15.3314 6.1875 15.2626 5.87813C15.1595 5.46563 14.747 5.225 14.3345 5.29375Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</CardDataStats>
|
||||||
|
<CardDataStats title="Total Users" total="3.456" rate="0.95%" levelDown>
|
||||||
|
<svg
|
||||||
|
className="fill-primary dark:fill-white"
|
||||||
|
width="22"
|
||||||
|
height="18"
|
||||||
|
viewBox="0 0 22 18"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M7.18418 8.03751C9.31543 8.03751 11.0686 6.35313 11.0686 4.25626C11.0686 2.15938 9.31543 0.475006 7.18418 0.475006C5.05293 0.475006 3.2998 2.15938 3.2998 4.25626C3.2998 6.35313 5.05293 8.03751 7.18418 8.03751ZM7.18418 2.05626C8.45605 2.05626 9.52168 3.05313 9.52168 4.29063C9.52168 5.52813 8.49043 6.52501 7.18418 6.52501C5.87793 6.52501 4.84668 5.52813 4.84668 4.29063C4.84668 3.05313 5.9123 2.05626 7.18418 2.05626Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M15.8124 9.6875C17.6687 9.6875 19.1468 8.24375 19.1468 6.42188C19.1468 4.6 17.6343 3.15625 15.8124 3.15625C13.9905 3.15625 12.478 4.6 12.478 6.42188C12.478 8.24375 13.9905 9.6875 15.8124 9.6875ZM15.8124 4.7375C16.8093 4.7375 17.5999 5.49375 17.5999 6.45625C17.5999 7.41875 16.8093 8.175 15.8124 8.175C14.8155 8.175 14.0249 7.41875 14.0249 6.45625C14.0249 5.49375 14.8155 4.7375 15.8124 4.7375Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M15.9843 10.0313H15.6749C14.6437 10.0313 13.6468 10.3406 12.7874 10.8563C11.8593 9.61876 10.3812 8.79376 8.73115 8.79376H5.67178C2.85303 8.82814 0.618652 11.0625 0.618652 13.8469V16.3219C0.618652 16.975 1.13428 17.4906 1.7874 17.4906H20.2468C20.8999 17.4906 21.4499 16.9406 21.4499 16.2875V15.4625C21.4155 12.4719 18.9749 10.0313 15.9843 10.0313ZM2.16553 15.9438V13.8469C2.16553 11.9219 3.74678 10.3406 5.67178 10.3406H8.73115C10.6562 10.3406 12.2374 11.9219 12.2374 13.8469V15.9438H2.16553V15.9438ZM19.8687 15.9438H13.7499V13.8469C13.7499 13.2969 13.6468 12.7469 13.4749 12.2313C14.0937 11.7844 14.8499 11.5781 15.6405 11.5781H15.9499C18.0812 11.5781 19.8343 13.3313 19.8343 15.4625V15.9438H19.8687Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</CardDataStats>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="mt-4 grid grid-cols-12 gap-4 md:mt-6 md:gap-6 2xl:mt-7.5 2xl:gap-7.5">
|
||||||
|
<ChartOne />
|
||||||
|
<ChartTwo />
|
||||||
|
<ChartThree />
|
||||||
|
<MapOne />
|
||||||
|
<div className="col-span-12 xl:col-span-8">
|
||||||
|
<TableOne />
|
||||||
|
</div>
|
||||||
|
<ChatCard />
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ECommerce;
|
||||||
|
|
@ -0,0 +1,128 @@
|
||||||
|
import { useEffect, useRef, useState } from "react";
|
||||||
|
|
||||||
|
const DropdownDefault = () => {
|
||||||
|
const [dropdownOpen, setDropdownOpen] = useState(false);
|
||||||
|
|
||||||
|
const trigger = useRef<any>(null);
|
||||||
|
const dropdown = useRef<any>(null);
|
||||||
|
|
||||||
|
// close on click outside
|
||||||
|
useEffect(() => {
|
||||||
|
const clickHandler = ({ target }: MouseEvent) => {
|
||||||
|
if (!dropdown.current) return;
|
||||||
|
if (
|
||||||
|
!dropdownOpen ||
|
||||||
|
dropdown.current.contains(target) ||
|
||||||
|
trigger.current.contains(target)
|
||||||
|
)
|
||||||
|
return;
|
||||||
|
setDropdownOpen(false);
|
||||||
|
};
|
||||||
|
document.addEventListener("click", clickHandler);
|
||||||
|
return () => document.removeEventListener("click", clickHandler);
|
||||||
|
});
|
||||||
|
|
||||||
|
// close if the esc key is pressed
|
||||||
|
useEffect(() => {
|
||||||
|
const keyHandler = ({ keyCode }: KeyboardEvent) => {
|
||||||
|
if (!dropdownOpen || keyCode !== 27) return;
|
||||||
|
setDropdownOpen(false);
|
||||||
|
};
|
||||||
|
document.addEventListener("keydown", keyHandler);
|
||||||
|
return () => document.removeEventListener("keydown", keyHandler);
|
||||||
|
});
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="relative flex">
|
||||||
|
<button
|
||||||
|
className="text-[#98A6AD] hover:text-body"
|
||||||
|
ref={trigger}
|
||||||
|
onClick={() => setDropdownOpen(!dropdownOpen)}
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
className="fill-current"
|
||||||
|
width="18"
|
||||||
|
height="18"
|
||||||
|
viewBox="0 0 18 18"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M2.25 11.25C3.49264 11.25 4.5 10.2426 4.5 9C4.5 7.75736 3.49264 6.75 2.25 6.75C1.00736 6.75 0 7.75736 0 9C0 10.2426 1.00736 11.25 2.25 11.25Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M9 11.25C10.2426 11.25 11.25 10.2426 11.25 9C11.25 7.75736 10.2426 6.75 9 6.75C7.75736 6.75 6.75 7.75736 6.75 9C6.75 10.2426 7.75736 11.25 9 11.25Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M15.75 11.25C16.9926 11.25 18 10.2426 18 9C18 7.75736 16.9926 6.75 15.75 6.75C14.5074 6.75 13.5 7.75736 13.5 9C13.5 10.2426 14.5074 11.25 15.75 11.25Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
<div
|
||||||
|
ref={dropdown}
|
||||||
|
onFocus={() => setDropdownOpen(true)}
|
||||||
|
onBlur={() => setDropdownOpen(false)}
|
||||||
|
className={`absolute right-0 top-full z-40 w-40 space-y-1 rounded-sm border border-stroke bg-white p-1.5 shadow-default dark:border-strokedark dark:bg-boxdark ${
|
||||||
|
dropdownOpen === true ? "block" : "hidden"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<button className="flex w-full items-center gap-2 rounded-sm px-4 py-1.5 text-left text-sm hover:bg-gray dark:hover:bg-meta-4">
|
||||||
|
<svg
|
||||||
|
className="fill-current"
|
||||||
|
width="16"
|
||||||
|
height="16"
|
||||||
|
viewBox="0 0 16 16"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<g clipPath="url(#clip0_62_9787)">
|
||||||
|
<path
|
||||||
|
d="M15.55 2.97499C15.55 2.77499 15.475 2.57499 15.325 2.42499C15.025 2.12499 14.725 1.82499 14.45 1.52499C14.175 1.24999 13.925 0.974987 13.65 0.724987C13.525 0.574987 13.375 0.474986 13.175 0.449986C12.95 0.424986 12.75 0.474986 12.575 0.624987L10.875 2.32499H2.02495C1.17495 2.32499 0.449951 3.02499 0.449951 3.89999V14C0.449951 14.85 1.14995 15.575 2.02495 15.575H12.15C13 15.575 13.725 14.875 13.725 14V5.12499L15.35 3.49999C15.475 3.34999 15.55 3.17499 15.55 2.97499ZM8.19995 8.99999C8.17495 9.02499 8.17495 9.02499 8.14995 9.02499L6.34995 9.62499L6.94995 7.82499C6.94995 7.79999 6.97495 7.79999 6.97495 7.77499L11.475 3.27499L12.725 4.49999L8.19995 8.99999ZM12.575 14C12.575 14.25 12.375 14.45 12.125 14.45H2.02495C1.77495 14.45 1.57495 14.25 1.57495 14V3.87499C1.57495 3.62499 1.77495 3.42499 2.02495 3.42499H9.72495L6.17495 6.99999C6.04995 7.12499 5.92495 7.29999 5.87495 7.49999L4.94995 10.3C4.87495 10.5 4.92495 10.675 5.02495 10.85C5.09995 10.95 5.24995 11.1 5.52495 11.1H5.62495L8.49995 10.15C8.67495 10.1 8.84995 9.97499 8.97495 9.84999L12.575 6.24999V14ZM13.5 3.72499L12.25 2.49999L13.025 1.72499C13.225 1.92499 14.05 2.74999 14.25 2.97499L13.5 3.72499Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<clipPath id="clip0_62_9787">
|
||||||
|
<rect width="16" height="16" fill="white" />
|
||||||
|
</clipPath>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
Edit
|
||||||
|
</button>
|
||||||
|
<button className="flex w-full items-center gap-2 rounded-sm px-4 py-1.5 text-left text-sm hover:bg-gray dark:hover:bg-meta-4">
|
||||||
|
<svg
|
||||||
|
className="fill-current"
|
||||||
|
width="16"
|
||||||
|
height="16"
|
||||||
|
viewBox="0 0 16 16"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M12.225 2.20005H10.3V1.77505C10.3 1.02505 9.70005 0.425049 8.95005 0.425049H7.02505C6.27505 0.425049 5.67505 1.02505 5.67505 1.77505V2.20005H3.75005C3.02505 2.20005 2.42505 2.80005 2.42505 3.52505V4.27505C2.42505 4.82505 2.75005 5.27505 3.22505 5.47505L3.62505 13.75C3.67505 14.775 4.52505 15.575 5.55005 15.575H10.4C11.425 15.575 12.275 14.775 12.325 13.75L12.75 5.45005C13.225 5.25005 13.55 4.77505 13.55 4.25005V3.50005C13.55 2.80005 12.95 2.20005 12.225 2.20005ZM6.82505 1.77505C6.82505 1.65005 6.92505 1.55005 7.05005 1.55005H8.97505C9.10005 1.55005 9.20005 1.65005 9.20005 1.77505V2.20005H6.85005V1.77505H6.82505ZM3.57505 3.52505C3.57505 3.42505 3.65005 3.32505 3.77505 3.32505H12.225C12.325 3.32505 12.425 3.40005 12.425 3.52505V4.27505C12.425 4.37505 12.35 4.47505 12.225 4.47505H3.77505C3.67505 4.47505 3.57505 4.40005 3.57505 4.27505V3.52505V3.52505ZM10.425 14.45H5.57505C5.15005 14.45 4.80005 14.125 4.77505 13.675L4.40005 5.57505H11.625L11.25 13.675C11.2 14.1 10.85 14.45 10.425 14.45Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M8.00005 8.1001C7.70005 8.1001 7.42505 8.3501 7.42505 8.6751V11.8501C7.42505 12.1501 7.67505 12.4251 8.00005 12.4251C8.30005 12.4251 8.57505 12.1751 8.57505 11.8501V8.6751C8.57505 8.3501 8.30005 8.1001 8.00005 8.1001Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M9.99994 8.60004C9.67494 8.57504 9.42494 8.80004 9.39994 9.12504L9.24994 11.325C9.22494 11.625 9.44994 11.9 9.77494 11.925C9.79994 11.925 9.79994 11.925 9.82494 11.925C10.1249 11.925 10.3749 11.7 10.3749 11.4L10.5249 9.20004C10.5249 8.87504 10.2999 8.62504 9.99994 8.60004Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M5.97497 8.60004C5.67497 8.62504 5.42497 8.90004 5.44997 9.20004L5.62497 11.4C5.64997 11.7 5.89997 11.925 6.17497 11.925C6.19997 11.925 6.19997 11.925 6.22497 11.925C6.52497 11.9 6.77497 11.625 6.74997 11.325L6.57497 9.12504C6.57497 8.80004 6.29997 8.57504 5.97497 8.60004Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
Delete
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default DropdownDefault;
|
||||||
|
|
@ -0,0 +1,50 @@
|
||||||
|
import flatpickr from "flatpickr";
|
||||||
|
import { useEffect } from "react";
|
||||||
|
|
||||||
|
const DatePickerOne = () => {
|
||||||
|
useEffect(() => {
|
||||||
|
// Init flatpickr
|
||||||
|
flatpickr(".form-datepicker", {
|
||||||
|
mode: "single",
|
||||||
|
static: true,
|
||||||
|
monthSelectorType: "static",
|
||||||
|
dateFormat: "M j, Y",
|
||||||
|
prevArrow:
|
||||||
|
'<svg className="fill-current" width="7" height="11" viewBox="0 0 7 11"><path d="M5.4 10.8l1.4-1.4-4-4 4-4L5.4 0 0 5.4z" /></svg>',
|
||||||
|
nextArrow:
|
||||||
|
'<svg className="fill-current" width="7" height="11" viewBox="0 0 7 11"><path d="M1.4 10.8L0 9.4l4-4-4-4L1.4 0l5.4 5.4z" /></svg>',
|
||||||
|
});
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<label className="mb-3 block text-sm font-medium text-black dark:text-white">
|
||||||
|
Date picker
|
||||||
|
</label>
|
||||||
|
<div className="relative">
|
||||||
|
<input
|
||||||
|
className="form-datepicker w-full rounded border-[1.5px] border-stroke bg-transparent px-5 py-3 font-normal outline-none transition focus:border-primary active:border-primary dark:border-form-strokedark dark:bg-form-input dark:focus:border-primary"
|
||||||
|
placeholder="mm/dd/yyyy"
|
||||||
|
data-class="flatpickr-right"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div className="pointer-events-none absolute inset-0 left-auto right-5 flex items-center">
|
||||||
|
<svg
|
||||||
|
width="18"
|
||||||
|
height="18"
|
||||||
|
viewBox="0 0 18 18"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M15.7504 2.9812H14.2879V2.36245C14.2879 2.02495 14.0066 1.71558 13.641 1.71558C13.2754 1.71558 12.9941 1.99683 12.9941 2.36245V2.9812H4.97852V2.36245C4.97852 2.02495 4.69727 1.71558 4.33164 1.71558C3.96602 1.71558 3.68477 1.99683 3.68477 2.36245V2.9812H2.25039C1.29414 2.9812 0.478516 3.7687 0.478516 4.75308V14.5406C0.478516 15.4968 1.26602 16.3125 2.25039 16.3125H15.7504C16.7066 16.3125 17.5223 15.525 17.5223 14.5406V4.72495C17.5223 3.7687 16.7066 2.9812 15.7504 2.9812ZM1.77227 8.21245H4.16289V10.9968H1.77227V8.21245ZM5.42852 8.21245H8.38164V10.9968H5.42852V8.21245ZM8.38164 12.2625V15.0187H5.42852V12.2625H8.38164V12.2625ZM9.64727 12.2625H12.6004V15.0187H9.64727V12.2625ZM9.64727 10.9968V8.21245H12.6004V10.9968H9.64727ZM13.8379 8.21245H16.2285V10.9968H13.8379V8.21245ZM2.25039 4.24683H3.71289V4.83745C3.71289 5.17495 3.99414 5.48433 4.35977 5.48433C4.72539 5.48433 5.00664 5.20308 5.00664 4.83745V4.24683H13.0504V4.83745C13.0504 5.17495 13.3316 5.48433 13.6973 5.48433C14.0629 5.48433 14.3441 5.20308 14.3441 4.83745V4.24683H15.7504C16.0316 4.24683 16.2566 4.47183 16.2566 4.75308V6.94683H1.77227V4.75308C1.77227 4.47183 1.96914 4.24683 2.25039 4.24683ZM1.77227 14.5125V12.2343H4.16289V14.9906H2.25039C1.96914 15.0187 1.77227 14.7937 1.77227 14.5125ZM15.7504 15.0187H13.8379V12.2625H16.2285V14.5406C16.2566 14.7937 16.0316 15.0187 15.7504 15.0187Z"
|
||||||
|
fill="#64748B"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default DatePickerOne;
|
||||||
|
|
@ -0,0 +1,50 @@
|
||||||
|
import flatpickr from "flatpickr";
|
||||||
|
import { useEffect } from "react";
|
||||||
|
|
||||||
|
const DatePickerTwo = () => {
|
||||||
|
useEffect(() => {
|
||||||
|
// Init flatpickr
|
||||||
|
flatpickr(".form-datepicker", {
|
||||||
|
mode: "single",
|
||||||
|
static: true,
|
||||||
|
monthSelectorType: "static",
|
||||||
|
dateFormat: "M j, Y",
|
||||||
|
prevArrow:
|
||||||
|
'<svg className="fill-current" width="7" height="11" viewBox="0 0 7 11"><path d="M5.4 10.8l1.4-1.4-4-4 4-4L5.4 0 0 5.4z" /></svg>',
|
||||||
|
nextArrow:
|
||||||
|
'<svg className="fill-current" width="7" height="11" viewBox="0 0 7 11"><path d="M1.4 10.8L0 9.4l4-4-4-4L1.4 0l5.4 5.4z" /></svg>',
|
||||||
|
});
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<label className="mb-3 block text-sm font-medium text-black dark:text-white">
|
||||||
|
Select date
|
||||||
|
</label>
|
||||||
|
<div className="relative">
|
||||||
|
<input
|
||||||
|
className="form-datepicker w-full rounded border-[1.5px] border-stroke bg-transparent px-5 py-3 font-normal outline-none transition focus:border-primary active:border-primary dark:border-form-strokedark dark:bg-form-input dark:focus:border-primary"
|
||||||
|
placeholder="mm/dd/yyyy"
|
||||||
|
data-class="flatpickr-right"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div className="pointer-events-none absolute inset-0 left-auto right-5 flex items-center">
|
||||||
|
<svg
|
||||||
|
width="18"
|
||||||
|
height="18"
|
||||||
|
viewBox="0 0 18 18"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M9.0002 12.8249C8.83145 12.8249 8.69082 12.7687 8.5502 12.6562L2.08145 6.2999C1.82832 6.04678 1.82832 5.65303 2.08145 5.3999C2.33457 5.14678 2.72832 5.14678 2.98145 5.3999L9.0002 11.278L15.0189 5.34365C15.2721 5.09053 15.6658 5.09053 15.9189 5.34365C16.1721 5.59678 16.1721 5.99053 15.9189 6.24365L9.45019 12.5999C9.30957 12.7405 9.16895 12.8249 9.0002 12.8249Z"
|
||||||
|
fill="#64748B"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default DatePickerTwo;
|
||||||
|
|
@ -0,0 +1,226 @@
|
||||||
|
import React, { useState, useEffect, useRef } from "react";
|
||||||
|
|
||||||
|
interface Option {
|
||||||
|
value: string;
|
||||||
|
text: string;
|
||||||
|
selected: boolean;
|
||||||
|
element?: HTMLElement;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface DropdownProps {
|
||||||
|
id: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const MultiSelect: React.FC<DropdownProps> = ({ id }) => {
|
||||||
|
const [options, setOptions] = useState<Option[]>([]);
|
||||||
|
const [selected, setSelected] = useState<number[]>([]);
|
||||||
|
const [show, setShow] = useState(false);
|
||||||
|
const dropdownRef = useRef<any>(null);
|
||||||
|
const trigger = useRef<any>(null);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const loadOptions = () => {
|
||||||
|
const select = document.getElementById(id) as HTMLSelectElement | null;
|
||||||
|
if (select) {
|
||||||
|
const newOptions: Option[] = [];
|
||||||
|
for (let i = 0; i < select.options.length; i++) {
|
||||||
|
newOptions.push({
|
||||||
|
value: select.options[i].value,
|
||||||
|
text: select.options[i].innerText,
|
||||||
|
selected: select.options[i].hasAttribute("selected"),
|
||||||
|
});
|
||||||
|
}
|
||||||
|
setOptions(newOptions);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
loadOptions();
|
||||||
|
}, [id]);
|
||||||
|
|
||||||
|
const open = () => {
|
||||||
|
setShow(true);
|
||||||
|
};
|
||||||
|
|
||||||
|
const isOpen = () => {
|
||||||
|
return show === true;
|
||||||
|
};
|
||||||
|
|
||||||
|
const select = (index: number, event: React.MouseEvent) => {
|
||||||
|
const newOptions = [...options];
|
||||||
|
|
||||||
|
if (!newOptions[index].selected) {
|
||||||
|
newOptions[index].selected = true;
|
||||||
|
newOptions[index].element = event.currentTarget as HTMLElement;
|
||||||
|
setSelected([...selected, index]);
|
||||||
|
} else {
|
||||||
|
const selectedIndex = selected.indexOf(index);
|
||||||
|
if (selectedIndex !== -1) {
|
||||||
|
newOptions[index].selected = false;
|
||||||
|
setSelected(selected.filter((i) => i !== index));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
setOptions(newOptions);
|
||||||
|
};
|
||||||
|
|
||||||
|
const remove = (index: number) => {
|
||||||
|
const newOptions = [...options];
|
||||||
|
const selectedIndex = selected.indexOf(index);
|
||||||
|
|
||||||
|
if (selectedIndex !== -1) {
|
||||||
|
newOptions[index].selected = false;
|
||||||
|
setSelected(selected.filter((i) => i !== index));
|
||||||
|
setOptions(newOptions);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const selectedValues = () => {
|
||||||
|
return selected.map((option) => options[option].value);
|
||||||
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const clickHandler = ({ target }: MouseEvent) => {
|
||||||
|
if (!dropdownRef.current) return;
|
||||||
|
if (
|
||||||
|
!show ||
|
||||||
|
dropdownRef.current.contains(target) ||
|
||||||
|
trigger.current.contains(target)
|
||||||
|
)
|
||||||
|
return;
|
||||||
|
setShow(false);
|
||||||
|
};
|
||||||
|
document.addEventListener("click", clickHandler);
|
||||||
|
return () => document.removeEventListener("click", clickHandler);
|
||||||
|
});
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="relative z-50">
|
||||||
|
<label className="mb-3 block text-sm font-medium text-black dark:text-white">
|
||||||
|
Multiselect Dropdown
|
||||||
|
</label>
|
||||||
|
<div>
|
||||||
|
<select className="hidden" id={id}>
|
||||||
|
<option value="1">Option 2</option>
|
||||||
|
<option value="2">Option 3</option>
|
||||||
|
<option value="3">Option 4</option>
|
||||||
|
<option value="4">Option 5</option>
|
||||||
|
</select>
|
||||||
|
|
||||||
|
<div className="flex flex-col items-center">
|
||||||
|
<input name="values" type="hidden" defaultValue={selectedValues()} />
|
||||||
|
<div className="relative z-20 inline-block w-full">
|
||||||
|
<div className="relative flex flex-col items-center">
|
||||||
|
<div ref={trigger} onClick={open} className="w-full">
|
||||||
|
<div className="mb-2 flex rounded border border-stroke py-2 pl-3 pr-3 outline-none transition focus:border-primary active:border-primary dark:border-form-strokedark dark:bg-form-input">
|
||||||
|
<div className="flex flex-auto flex-wrap gap-3">
|
||||||
|
{selected.map((index) => (
|
||||||
|
<div
|
||||||
|
key={index}
|
||||||
|
className="my-1.5 flex items-center justify-center rounded border-[.5px] border-stroke bg-gray px-2.5 py-1.5 text-sm font-medium dark:border-strokedark dark:bg-white/30"
|
||||||
|
>
|
||||||
|
<div className="max-w-full flex-initial">
|
||||||
|
{options[index].text}
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-auto flex-row-reverse">
|
||||||
|
<div
|
||||||
|
onClick={() => remove(index)}
|
||||||
|
className="cursor-pointer pl-2 hover:text-danger"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
className="fill-current"
|
||||||
|
role="button"
|
||||||
|
width="12"
|
||||||
|
height="12"
|
||||||
|
viewBox="0 0 12 12"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
fillRule="evenodd"
|
||||||
|
clipRule="evenodd"
|
||||||
|
d="M9.35355 3.35355C9.54882 3.15829 9.54882 2.84171 9.35355 2.64645C9.15829 2.45118 8.84171 2.45118 8.64645 2.64645L6 5.29289L3.35355 2.64645C3.15829 2.45118 2.84171 2.45118 2.64645 2.64645C2.45118 2.84171 2.45118 3.15829 2.64645 3.35355L5.29289 6L2.64645 8.64645C2.45118 8.84171 2.45118 9.15829 2.64645 9.35355C2.84171 9.54882 3.15829 9.54882 3.35355 9.35355L6 6.70711L8.64645 9.35355C8.84171 9.54882 9.15829 9.54882 9.35355 9.35355C9.54882 9.15829 9.54882 8.84171 9.35355 8.64645L6.70711 6L9.35355 3.35355Z"
|
||||||
|
fill="currentColor"
|
||||||
|
></path>
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
{selected.length === 0 && (
|
||||||
|
<div className="flex-1">
|
||||||
|
<input
|
||||||
|
placeholder="Select an option"
|
||||||
|
className="h-full w-full appearance-none bg-transparent p-1 px-2 outline-none"
|
||||||
|
defaultValue={selectedValues()}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
<div className="flex w-8 items-center py-1 pl-1 pr-1">
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onClick={open}
|
||||||
|
className="h-6 w-6 cursor-pointer outline-none focus:outline-none"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
width="24"
|
||||||
|
height="24"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<g opacity="0.8">
|
||||||
|
<path
|
||||||
|
fillRule="evenodd"
|
||||||
|
clipRule="evenodd"
|
||||||
|
d="M5.29289 8.29289C5.68342 7.90237 6.31658 7.90237 6.70711 8.29289L12 13.5858L17.2929 8.29289C17.6834 7.90237 18.3166 7.90237 18.7071 8.29289C19.0976 8.68342 19.0976 9.31658 18.7071 9.70711L12.7071 15.7071C12.3166 16.0976 11.6834 16.0976 11.2929 15.7071L5.29289 9.70711C4.90237 9.31658 4.90237 8.68342 5.29289 8.29289Z"
|
||||||
|
fill="#637381"
|
||||||
|
></path>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="w-full px-4">
|
||||||
|
<div
|
||||||
|
className={`max-h-select absolute left-0 top-full z-40 w-full overflow-y-auto rounded bg-white shadow dark:bg-form-input ${
|
||||||
|
isOpen() ? "" : "hidden"
|
||||||
|
}`}
|
||||||
|
ref={dropdownRef}
|
||||||
|
onFocus={() => setShow(true)}
|
||||||
|
onBlur={() => setShow(false)}
|
||||||
|
>
|
||||||
|
<div className="flex w-full flex-col">
|
||||||
|
{options.map((option, index) => (
|
||||||
|
<div key={index}>
|
||||||
|
<div
|
||||||
|
className="w-full cursor-pointer rounded-t border-b border-stroke hover:bg-primary/5 dark:border-form-strokedark"
|
||||||
|
onClick={(event) => select(index, event)}
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
className={`relative flex w-full items-center border-l-2 border-transparent p-2 pl-2 ${
|
||||||
|
option.selected ? "border-primary" : ""
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<div className="flex w-full items-center">
|
||||||
|
<div className="mx-2 leading-6">
|
||||||
|
{option.text}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default MultiSelect;
|
||||||
|
|
@ -0,0 +1,206 @@
|
||||||
|
"use client";
|
||||||
|
import Breadcrumb from "@/components/Breadcrumbs/Breadcrumb";
|
||||||
|
import CheckboxFive from "@/components/Checkboxes/CheckboxFive";
|
||||||
|
import CheckboxFour from "@/components/Checkboxes/CheckboxFour";
|
||||||
|
import CheckboxOne from "@/components/Checkboxes/CheckboxOne";
|
||||||
|
import CheckboxThree from "@/components/Checkboxes/CheckboxThree";
|
||||||
|
import CheckboxTwo from "@/components/Checkboxes/CheckboxTwo";
|
||||||
|
import SwitcherFour from "@/components/Switchers/SwitcherFour";
|
||||||
|
import SwitcherOne from "@/components/Switchers/SwitcherOne";
|
||||||
|
import SwitcherThree from "@/components/Switchers/SwitcherThree";
|
||||||
|
import SwitcherTwo from "@/components/Switchers/SwitcherTwo";
|
||||||
|
import DatePickerTwo from "@/components/FormElements/DatePicker/DatePickerTwo";
|
||||||
|
import DatePickerOne from "@/components/FormElements/DatePicker/DatePickerOne";
|
||||||
|
import MultiSelect from "@/components/FormElements/MultiSelect";
|
||||||
|
import SelectGroupTwo from "@/components/SelectGroup/SelectGroupTwo";
|
||||||
|
|
||||||
|
const FormElements = () => {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Breadcrumb pageName="FormElements" />
|
||||||
|
|
||||||
|
<div className="grid grid-cols-1 gap-9 sm:grid-cols-2">
|
||||||
|
<div className="flex flex-col gap-9">
|
||||||
|
{/* <!-- Input Fields --> */}
|
||||||
|
<div className="rounded-sm border border-stroke bg-white shadow-default dark:border-strokedark dark:bg-boxdark">
|
||||||
|
<div className="border-b border-stroke px-6.5 py-4 dark:border-strokedark">
|
||||||
|
<h3 className="font-medium text-black dark:text-white">
|
||||||
|
Input Fields
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-col gap-5.5 p-6.5">
|
||||||
|
<div>
|
||||||
|
<label className="mb-3 block text-sm font-medium text-black dark:text-white">
|
||||||
|
Default Input
|
||||||
|
</label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Default Input"
|
||||||
|
className="w-full rounded-lg border-[1.5px] border-stroke bg-transparent px-5 py-3 text-black outline-none transition focus:border-primary active:border-primary disabled:cursor-default disabled:bg-whiter dark:border-form-strokedark dark:bg-form-input dark:text-white dark:focus:border-primary"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<label className="mb-3 block text-sm font-medium text-black dark:text-white">
|
||||||
|
Active Input
|
||||||
|
</label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Active Input"
|
||||||
|
className="w-full rounded-lg border-[1.5px] border-primary bg-transparent px-5 py-3 text-black outline-none transition focus:border-primary active:border-primary disabled:cursor-default disabled:bg-whiter dark:bg-form-input dark:text-white"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<label className="mb-3 block text-sm font-medium text-black dark:text-white">
|
||||||
|
Disabled label
|
||||||
|
</label>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Disabled label"
|
||||||
|
disabled
|
||||||
|
className="w-full rounded-lg border-[1.5px] border-stroke bg-transparent px-5 py-3 text-black outline-none transition focus:border-primary active:border-primary disabled:cursor-default disabled:bg-whiter dark:border-form-strokedark dark:bg-form-input dark:text-white dark:focus:border-primary dark:disabled:bg-black"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* <!-- Toggle switch input --> */}
|
||||||
|
<div className="rounded-sm border border-stroke bg-white shadow-default dark:border-strokedark dark:bg-boxdark">
|
||||||
|
<div className="border-b border-stroke px-6.5 py-4 dark:border-strokedark">
|
||||||
|
<h3 className="font-medium text-black dark:text-white">
|
||||||
|
Toggle switch input
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-col gap-5.5 p-6.5">
|
||||||
|
<SwitcherOne />
|
||||||
|
<SwitcherTwo />
|
||||||
|
<SwitcherThree />
|
||||||
|
<SwitcherFour />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* <!-- Time and date --> */}
|
||||||
|
<div className="rounded-sm border border-stroke bg-white shadow-default dark:border-strokedark dark:bg-boxdark">
|
||||||
|
<div className="border-b border-stroke px-6.5 py-4 dark:border-strokedark">
|
||||||
|
<h3 className="font-medium text-black dark:text-white">
|
||||||
|
Time and date
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-col gap-5.5 p-6.5">
|
||||||
|
<DatePickerOne />
|
||||||
|
<DatePickerTwo />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* <!-- File upload --> */}
|
||||||
|
<div className="rounded-sm border border-stroke bg-white shadow-default dark:border-strokedark dark:bg-boxdark">
|
||||||
|
<div className="border-b border-stroke px-6.5 py-4 dark:border-strokedark">
|
||||||
|
<h3 className="font-medium text-black dark:text-white">
|
||||||
|
File upload
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-col gap-5.5 p-6.5">
|
||||||
|
<div>
|
||||||
|
<label className="mb-3 block text-sm font-medium text-black dark:text-white">
|
||||||
|
Attach file
|
||||||
|
</label>
|
||||||
|
<input
|
||||||
|
type="file"
|
||||||
|
className="w-full cursor-pointer rounded-lg border-[1.5px] border-stroke bg-transparent outline-none transition file:mr-5 file:border-collapse file:cursor-pointer file:border-0 file:border-r file:border-solid file:border-stroke file:bg-whiter file:px-5 file:py-3 file:hover:bg-primary file:hover:bg-opacity-10 focus:border-primary active:border-primary disabled:cursor-default disabled:bg-whiter dark:border-form-strokedark dark:bg-form-input dark:file:border-form-strokedark dark:file:bg-white/30 dark:file:text-white dark:focus:border-primary"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<label className="mb-3 block text-sm font-medium text-black dark:text-white">
|
||||||
|
Attach file
|
||||||
|
</label>
|
||||||
|
<input
|
||||||
|
type="file"
|
||||||
|
className="w-full rounded-md border border-stroke p-3 outline-none transition file:mr-4 file:rounded file:border-[0.5px] file:border-stroke file:bg-[#EEEEEE] file:px-2.5 file:py-1 file:text-sm focus:border-primary file:focus:border-primary active:border-primary disabled:cursor-default disabled:bg-whiter dark:border-form-strokedark dark:bg-form-input dark:file:border-strokedark dark:file:bg-white/30 dark:file:text-white"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex flex-col gap-9">
|
||||||
|
{/* <!-- Textarea Fields --> */}
|
||||||
|
<div className="rounded-sm border border-stroke bg-white shadow-default dark:border-strokedark dark:bg-boxdark">
|
||||||
|
<div className="border-b border-stroke px-6.5 py-4 dark:border-strokedark">
|
||||||
|
<h3 className="font-medium text-black dark:text-white">
|
||||||
|
Textarea Fields
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-col gap-5.5 p-6.5">
|
||||||
|
<div>
|
||||||
|
<label className="mb-3 block text-sm font-medium text-black dark:text-white">
|
||||||
|
Default textarea
|
||||||
|
</label>
|
||||||
|
<textarea
|
||||||
|
rows={6}
|
||||||
|
placeholder="Default textarea"
|
||||||
|
className="w-full rounded-lg border-[1.5px] border-stroke bg-transparent px-5 py-3 text-black outline-none transition focus:border-primary active:border-primary disabled:cursor-default disabled:bg-whiter dark:border-form-strokedark dark:bg-form-input dark:text-white dark:focus:border-primary"
|
||||||
|
></textarea>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<label className="mb-3 block text-sm font-medium text-black dark:text-white">
|
||||||
|
Active textarea
|
||||||
|
</label>
|
||||||
|
<textarea
|
||||||
|
rows={6}
|
||||||
|
placeholder="Active textarea"
|
||||||
|
className="w-full rounded-lg border-[1.5px] border-primary bg-transparent px-5 py-3 text-black outline-none transition focus:border-primary active:border-primary disabled:cursor-default disabled:bg-whiter dark:bg-form-input dark:text-white"
|
||||||
|
></textarea>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<label className="mb-3 block text-sm font-medium text-black dark:text-white">
|
||||||
|
Disabled textarea
|
||||||
|
</label>
|
||||||
|
<textarea
|
||||||
|
rows={6}
|
||||||
|
disabled
|
||||||
|
placeholder="Disabled textarea"
|
||||||
|
className="w-full rounded-lg border-[1.5px] border-stroke bg-transparent px-5 py-3 text-black outline-none transition focus:border-primary active:border-primary disabled:cursor-default disabled:bg-whiter dark:border-form-strokedark dark:bg-form-input dark:text-white dark:focus:border-primary dark:disabled:bg-black"
|
||||||
|
></textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* <!-- Checkbox and radio --> */}
|
||||||
|
<div className="rounded-sm border border-stroke bg-white shadow-default dark:border-strokedark dark:bg-boxdark">
|
||||||
|
<div className="border-b border-stroke px-6.5 py-4 dark:border-strokedark">
|
||||||
|
<h3 className="font-medium text-black dark:text-white">
|
||||||
|
Checkbox and radio
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-col gap-5.5 p-6.5">
|
||||||
|
<CheckboxOne />
|
||||||
|
<CheckboxTwo />
|
||||||
|
<CheckboxThree />
|
||||||
|
<CheckboxFour />
|
||||||
|
<CheckboxFive />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* <!-- Select input --> */}
|
||||||
|
<div className="rounded-sm border border-stroke bg-white shadow-default dark:border-strokedark dark:bg-boxdark">
|
||||||
|
<div className="border-b border-stroke px-6.5 py-4 dark:border-strokedark">
|
||||||
|
<h3 className="font-medium text-black dark:text-white">
|
||||||
|
Select input
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
<div className="flex flex-col gap-5.5 p-6.5">
|
||||||
|
<SelectGroupTwo />
|
||||||
|
<MultiSelect id="multiSelect" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default FormElements;
|
||||||
|
|
@ -0,0 +1,65 @@
|
||||||
|
import useColorMode from "@/hooks/useColorMode";
|
||||||
|
|
||||||
|
const DarkModeSwitcher = () => {
|
||||||
|
const [colorMode, setColorMode] = useColorMode();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<li>
|
||||||
|
<label
|
||||||
|
className={`relative m-0 block h-7.5 w-14 rounded-full ${
|
||||||
|
colorMode === "dark" ? "bg-primary" : "bg-stroke"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
onChange={() => {
|
||||||
|
if (typeof setColorMode === "function") {
|
||||||
|
setColorMode(colorMode === "light" ? "dark" : "light");
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
className="dur absolute top-0 z-50 m-0 h-full w-full cursor-pointer opacity-0"
|
||||||
|
/>
|
||||||
|
<span
|
||||||
|
className={`absolute left-[3px] top-1/2 flex h-6 w-6 -translate-y-1/2 translate-x-0 items-center justify-center rounded-full bg-white shadow-switcher duration-75 ease-linear ${
|
||||||
|
colorMode === "dark" && "!right-[3px] !translate-x-full"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<span className="dark:hidden">
|
||||||
|
<svg
|
||||||
|
width="16"
|
||||||
|
height="16"
|
||||||
|
viewBox="0 0 16 16"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M7.99992 12.6666C10.5772 12.6666 12.6666 10.5772 12.6666 7.99992C12.6666 5.42259 10.5772 3.33325 7.99992 3.33325C5.42259 3.33325 3.33325 5.42259 3.33325 7.99992C3.33325 10.5772 5.42259 12.6666 7.99992 12.6666Z"
|
||||||
|
fill="#969AA1"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M8.00008 15.3067C7.63341 15.3067 7.33342 15.0334 7.33342 14.6667V14.6134C7.33342 14.2467 7.63341 13.9467 8.00008 13.9467C8.36675 13.9467 8.66675 14.2467 8.66675 14.6134C8.66675 14.9801 8.36675 15.3067 8.00008 15.3067ZM12.7601 13.4267C12.5867 13.4267 12.4201 13.3601 12.2867 13.2334L12.2001 13.1467C11.9401 12.8867 11.9401 12.4667 12.2001 12.2067C12.4601 11.9467 12.8801 11.9467 13.1401 12.2067L13.2267 12.2934C13.4867 12.5534 13.4867 12.9734 13.2267 13.2334C13.1001 13.3601 12.9334 13.4267 12.7601 13.4267ZM3.24008 13.4267C3.06675 13.4267 2.90008 13.3601 2.76675 13.2334C2.50675 12.9734 2.50675 12.5534 2.76675 12.2934L2.85342 12.2067C3.11342 11.9467 3.53341 11.9467 3.79341 12.2067C4.05341 12.4667 4.05341 12.8867 3.79341 13.1467L3.70675 13.2334C3.58008 13.3601 3.40675 13.4267 3.24008 13.4267ZM14.6667 8.66675H14.6134C14.2467 8.66675 13.9467 8.36675 13.9467 8.00008C13.9467 7.63341 14.2467 7.33342 14.6134 7.33342C14.9801 7.33342 15.3067 7.63341 15.3067 8.00008C15.3067 8.36675 15.0334 8.66675 14.6667 8.66675ZM1.38675 8.66675H1.33341C0.966748 8.66675 0.666748 8.36675 0.666748 8.00008C0.666748 7.63341 0.966748 7.33342 1.33341 7.33342C1.70008 7.33342 2.02675 7.63341 2.02675 8.00008C2.02675 8.36675 1.75341 8.66675 1.38675 8.66675ZM12.6734 3.99341C12.5001 3.99341 12.3334 3.92675 12.2001 3.80008C11.9401 3.54008 11.9401 3.12008 12.2001 2.86008L12.2867 2.77341C12.5467 2.51341 12.9667 2.51341 13.2267 2.77341C13.4867 3.03341 13.4867 3.45341 13.2267 3.71341L13.1401 3.80008C13.0134 3.92675 12.8467 3.99341 12.6734 3.99341ZM3.32675 3.99341C3.15341 3.99341 2.98675 3.92675 2.85342 3.80008L2.76675 3.70675C2.50675 3.44675 2.50675 3.02675 2.76675 2.76675C3.02675 2.50675 3.44675 2.50675 3.70675 2.76675L3.79341 2.85342C4.05341 3.11342 4.05341 3.53341 3.79341 3.79341C3.66675 3.92675 3.49341 3.99341 3.32675 3.99341ZM8.00008 2.02675C7.63341 2.02675 7.33342 1.75341 7.33342 1.38675V1.33341C7.33342 0.966748 7.63341 0.666748 8.00008 0.666748C8.36675 0.666748 8.66675 0.966748 8.66675 1.33341C8.66675 1.70008 8.36675 2.02675 8.00008 2.02675Z"
|
||||||
|
fill="#969AA1"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
<span className="hidden dark:inline-block">
|
||||||
|
<svg
|
||||||
|
width="16"
|
||||||
|
height="16"
|
||||||
|
viewBox="0 0 16 16"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M14.3533 10.62C14.2466 10.44 13.9466 10.16 13.1999 10.2933C12.7866 10.3667 12.3666 10.4 11.9466 10.38C10.3933 10.3133 8.98659 9.6 8.00659 8.5C7.13993 7.53333 6.60659 6.27333 6.59993 4.91333C6.59993 4.15333 6.74659 3.42 7.04659 2.72666C7.33993 2.05333 7.13326 1.7 6.98659 1.55333C6.83326 1.4 6.47326 1.18666 5.76659 1.48C3.03993 2.62666 1.35326 5.36 1.55326 8.28666C1.75326 11.04 3.68659 13.3933 6.24659 14.28C6.85993 14.4933 7.50659 14.62 8.17326 14.6467C8.27993 14.6533 8.38659 14.66 8.49326 14.66C10.7266 14.66 12.8199 13.6067 14.1399 11.8133C14.5866 11.1933 14.4666 10.8 14.3533 10.62Z"
|
||||||
|
fill="#969AA1"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
</label>
|
||||||
|
</li>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default DarkModeSwitcher;
|
||||||
|
|
@ -0,0 +1,211 @@
|
||||||
|
import { useEffect, useRef, useState } from "react";
|
||||||
|
import Link from "next/link";
|
||||||
|
import Image from "next/image";
|
||||||
|
import ClickOutside from "@/components/ClickOutside";
|
||||||
|
|
||||||
|
const DropdownMessage = () => {
|
||||||
|
const [dropdownOpen, setDropdownOpen] = useState(false);
|
||||||
|
const [notifying, setNotifying] = useState(true);
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ClickOutside onClick={() => setDropdownOpen(false)} className="relative">
|
||||||
|
<li className="relative">
|
||||||
|
<Link
|
||||||
|
onClick={() => {
|
||||||
|
setNotifying(false);
|
||||||
|
setDropdownOpen(!dropdownOpen);
|
||||||
|
}}
|
||||||
|
className="relative flex h-8.5 w-8.5 items-center justify-center rounded-full border-[0.5px] border-stroke bg-gray hover:text-primary dark:border-strokedark dark:bg-meta-4 dark:text-white"
|
||||||
|
href="#"
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
className={`absolute -right-0.5 -top-0.5 z-1 h-2 w-2 rounded-full bg-meta-1 ${
|
||||||
|
notifying === false ? "hidden" : "inline"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<span className="absolute -z-1 inline-flex h-full w-full animate-ping rounded-full bg-meta-1 opacity-75"></span>
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<svg
|
||||||
|
className="fill-current duration-300 ease-in-out"
|
||||||
|
width="18"
|
||||||
|
height="18"
|
||||||
|
viewBox="0 0 18 18"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M10.9688 1.57495H7.03135C3.43135 1.57495 0.506348 4.41558 0.506348 7.90308C0.506348 11.3906 2.75635 13.8375 8.26885 16.3125C8.40947 16.3687 8.52197 16.3968 8.6626 16.3968C8.85947 16.3968 9.02822 16.3406 9.19697 16.2281C9.47822 16.0593 9.64697 15.75 9.64697 15.4125V14.2031H10.9688C14.5688 14.2031 17.522 11.3625 17.522 7.87495C17.522 4.38745 14.5688 1.57495 10.9688 1.57495ZM10.9688 12.9937H9.3376C8.80322 12.9937 8.35322 13.4437 8.35322 13.9781V15.0187C3.6001 12.825 1.74385 10.8 1.74385 7.9312C1.74385 5.14683 4.10635 2.8687 7.03135 2.8687H10.9688C13.8657 2.8687 16.2563 5.14683 16.2563 7.9312C16.2563 10.7156 13.8657 12.9937 10.9688 12.9937Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M5.42812 7.28442C5.0625 7.28442 4.78125 7.56567 4.78125 7.9313C4.78125 8.29692 5.0625 8.57817 5.42812 8.57817C5.79375 8.57817 6.075 8.29692 6.075 7.9313C6.075 7.56567 5.79375 7.28442 5.42812 7.28442Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M9.00015 7.28442C8.63452 7.28442 8.35327 7.56567 8.35327 7.9313C8.35327 8.29692 8.63452 8.57817 9.00015 8.57817C9.33765 8.57817 9.64702 8.29692 9.64702 7.9313C9.64702 7.56567 9.33765 7.28442 9.00015 7.28442Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M12.5719 7.28442C12.2063 7.28442 11.925 7.56567 11.925 7.9313C11.925 8.29692 12.2063 8.57817 12.5719 8.57817C12.9375 8.57817 13.2188 8.29692 13.2188 7.9313C13.2188 7.56567 12.9094 7.28442 12.5719 7.28442Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
{/* <!-- Dropdown Start --> */}
|
||||||
|
{dropdownOpen && (
|
||||||
|
<div
|
||||||
|
className={`absolute -right-16 mt-2.5 flex h-90 w-75 flex-col rounded-sm border border-stroke bg-white shadow-default dark:border-strokedark dark:bg-boxdark sm:right-0 sm:w-80`}
|
||||||
|
>
|
||||||
|
<div className="px-4.5 py-3">
|
||||||
|
<h5 className="text-sm font-medium text-bodydark2">Messages</h5>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<ul className="flex h-auto flex-col overflow-y-auto">
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
className="flex gap-4.5 border-t border-stroke px-4.5 py-3 hover:bg-gray-2 dark:border-strokedark dark:hover:bg-meta-4"
|
||||||
|
href="/messages"
|
||||||
|
>
|
||||||
|
<div className="h-12.5 w-12.5 rounded-full">
|
||||||
|
<Image
|
||||||
|
width={112}
|
||||||
|
height={112}
|
||||||
|
src={"/images/user/user-02.png"}
|
||||||
|
alt="User"
|
||||||
|
style={{
|
||||||
|
width: "auto",
|
||||||
|
height: "auto",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<h6 className="text-sm font-medium text-black dark:text-white">
|
||||||
|
Mariya Desoja
|
||||||
|
</h6>
|
||||||
|
<p className="text-sm">I like your confidence 💪</p>
|
||||||
|
<p className="text-xs">2min ago</p>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
className="flex gap-4.5 border-t border-stroke px-4.5 py-3 hover:bg-gray-2 dark:border-strokedark dark:hover:bg-meta-4"
|
||||||
|
href="/messages"
|
||||||
|
>
|
||||||
|
<div className="h-12.5 w-12.5 rounded-full">
|
||||||
|
<Image
|
||||||
|
width={112}
|
||||||
|
height={112}
|
||||||
|
src={"/images/user/user-01.png"}
|
||||||
|
alt="User"
|
||||||
|
style={{
|
||||||
|
width: "auto",
|
||||||
|
height: "auto",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<h6 className="text-sm font-medium text-black dark:text-white">
|
||||||
|
Robert Jhon
|
||||||
|
</h6>
|
||||||
|
<p className="text-sm">Can you share your offer?</p>
|
||||||
|
<p className="text-xs">10min ago</p>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
className="flex gap-4.5 border-t border-stroke px-4.5 py-3 hover:bg-gray-2 dark:border-strokedark dark:hover:bg-meta-4"
|
||||||
|
href="/messages"
|
||||||
|
>
|
||||||
|
<div className="h-12.5 w-12.5 rounded-full">
|
||||||
|
<Image
|
||||||
|
width={112}
|
||||||
|
height={112}
|
||||||
|
src={"/images/user/user-03.png"}
|
||||||
|
alt="User"
|
||||||
|
style={{
|
||||||
|
width: "auto",
|
||||||
|
height: "auto",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<h6 className="text-sm font-medium text-black dark:text-white">
|
||||||
|
Henry Dholi
|
||||||
|
</h6>
|
||||||
|
<p className="text-sm">I cam across your profile and...</p>
|
||||||
|
<p className="text-xs">1day ago</p>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
className="flex gap-4.5 border-t border-stroke px-4.5 py-3 hover:bg-gray-2 dark:border-strokedark dark:hover:bg-meta-4"
|
||||||
|
href="/messages"
|
||||||
|
>
|
||||||
|
<div className="h-12.5 w-12.5 rounded-full">
|
||||||
|
<Image
|
||||||
|
width={112}
|
||||||
|
height={112}
|
||||||
|
src={"/images/user/user-04.png"}
|
||||||
|
alt="User"
|
||||||
|
style={{
|
||||||
|
width: "auto",
|
||||||
|
height: "auto",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<h6 className="text-sm font-medium text-black dark:text-white">
|
||||||
|
Cody Fisher
|
||||||
|
</h6>
|
||||||
|
<p className="text-sm">I’m waiting for you response!</p>
|
||||||
|
<p className="text-xs">5days ago</p>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
className="flex gap-4.5 border-t border-stroke px-4.5 py-3 hover:bg-gray-2 dark:border-strokedark dark:hover:bg-meta-4"
|
||||||
|
href="/messages"
|
||||||
|
>
|
||||||
|
<div className="h-12.5 w-12.5 rounded-full">
|
||||||
|
<Image
|
||||||
|
width={112}
|
||||||
|
height={112}
|
||||||
|
src={"/images/user/user-02.png"}
|
||||||
|
alt="User"
|
||||||
|
style={{
|
||||||
|
width: "auto",
|
||||||
|
height: "auto",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<h6 className="text-sm font-medium text-black dark:text-white">
|
||||||
|
Mariya Desoja
|
||||||
|
</h6>
|
||||||
|
<p className="text-sm">I like your confidence 💪</p>
|
||||||
|
<p className="text-xs">2min ago</p>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
{/* <!-- Dropdown End --> */}
|
||||||
|
</li>
|
||||||
|
</ClickOutside>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default DropdownMessage;
|
||||||
|
|
@ -0,0 +1,125 @@
|
||||||
|
import { useState } from "react";
|
||||||
|
import Link from "next/link";
|
||||||
|
import ClickOutside from "@/components/ClickOutside";
|
||||||
|
|
||||||
|
const DropdownNotification = () => {
|
||||||
|
const [dropdownOpen, setDropdownOpen] = useState(false);
|
||||||
|
const [notifying, setNotifying] = useState(true);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<ClickOutside onClick={() => setDropdownOpen(false)} className="relative">
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
onClick={() => {
|
||||||
|
setNotifying(false);
|
||||||
|
setDropdownOpen(!dropdownOpen);
|
||||||
|
}}
|
||||||
|
href="#"
|
||||||
|
className="relative flex h-8.5 w-8.5 items-center justify-center rounded-full border-[0.5px] border-stroke bg-gray hover:text-primary dark:border-strokedark dark:bg-meta-4 dark:text-white"
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
className={`absolute -top-0.5 right-0 z-1 h-2 w-2 rounded-full bg-meta-1 ${
|
||||||
|
notifying === false ? "hidden" : "inline"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<span className="absolute -z-1 inline-flex h-full w-full animate-ping rounded-full bg-meta-1 opacity-75"></span>
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<svg
|
||||||
|
className="fill-current duration-300 ease-in-out"
|
||||||
|
width="18"
|
||||||
|
height="18"
|
||||||
|
viewBox="0 0 18 18"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
d="M16.1999 14.9343L15.6374 14.0624C15.5249 13.8937 15.4687 13.7249 15.4687 13.528V7.67803C15.4687 6.01865 14.7655 4.47178 13.4718 3.31865C12.4312 2.39053 11.0812 1.7999 9.64678 1.6874V1.1249C9.64678 0.787402 9.36553 0.478027 8.9999 0.478027C8.6624 0.478027 8.35303 0.759277 8.35303 1.1249V1.65928C8.29678 1.65928 8.24053 1.65928 8.18428 1.6874C4.92178 2.05303 2.4749 4.66865 2.4749 7.79053V13.528C2.44678 13.8093 2.39053 13.9499 2.33428 14.0343L1.7999 14.9343C1.63115 15.2155 1.63115 15.553 1.7999 15.8343C1.96865 16.0874 2.2499 16.2562 2.55928 16.2562H8.38115V16.8749C8.38115 17.2124 8.6624 17.5218 9.02803 17.5218C9.36553 17.5218 9.6749 17.2405 9.6749 16.8749V16.2562H15.4687C15.778 16.2562 16.0593 16.0874 16.228 15.8343C16.3968 15.553 16.3968 15.2155 16.1999 14.9343ZM3.23428 14.9905L3.43115 14.653C3.5999 14.3718 3.68428 14.0343 3.74053 13.6405V7.79053C3.74053 5.31553 5.70928 3.23428 8.3249 2.95303C9.92803 2.78428 11.503 3.2624 12.6562 4.2749C13.6687 5.1749 14.2312 6.38428 14.2312 7.67803V13.528C14.2312 13.9499 14.3437 14.3437 14.5968 14.7374L14.7655 14.9905H3.23428Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
{dropdownOpen && (
|
||||||
|
<div
|
||||||
|
className={`absolute -right-27 mt-2.5 flex h-90 w-75 flex-col rounded-sm border border-stroke bg-white shadow-default dark:border-strokedark dark:bg-boxdark sm:right-0 sm:w-80`}
|
||||||
|
>
|
||||||
|
<div className="px-4.5 py-3">
|
||||||
|
<h5 className="text-sm font-medium text-bodydark2">
|
||||||
|
Notification
|
||||||
|
</h5>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<ul className="flex h-auto flex-col overflow-y-auto">
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
className="flex flex-col gap-2.5 border-t border-stroke px-4.5 py-3 hover:bg-gray-2 dark:border-strokedark dark:hover:bg-meta-4"
|
||||||
|
href="#"
|
||||||
|
>
|
||||||
|
<p className="text-sm">
|
||||||
|
<span className="text-black dark:text-white">
|
||||||
|
Edit your information in a swipe
|
||||||
|
</span>{" "}
|
||||||
|
Sint occaecat cupidatat non proident, sunt in culpa qui
|
||||||
|
officia deserunt mollit anim.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p className="text-xs">12 May, 2025</p>
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
className="flex flex-col gap-2.5 border-t border-stroke px-4.5 py-3 hover:bg-gray-2 dark:border-strokedark dark:hover:bg-meta-4"
|
||||||
|
href="#"
|
||||||
|
>
|
||||||
|
<p className="text-sm">
|
||||||
|
<span className="text-black dark:text-white">
|
||||||
|
It is a long established fact
|
||||||
|
</span>{" "}
|
||||||
|
that a reader will be distracted by the readable.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p className="text-xs">24 Feb, 2025</p>
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
className="flex flex-col gap-2.5 border-t border-stroke px-4.5 py-3 hover:bg-gray-2 dark:border-strokedark dark:hover:bg-meta-4"
|
||||||
|
href="#"
|
||||||
|
>
|
||||||
|
<p className="text-sm">
|
||||||
|
<span className="text-black dark:text-white">
|
||||||
|
There are many variations
|
||||||
|
</span>{" "}
|
||||||
|
of passages of Lorem Ipsum available, but the majority have
|
||||||
|
suffered
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p className="text-xs">04 Jan, 2025</p>
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
className="flex flex-col gap-2.5 border-t border-stroke px-4.5 py-3 hover:bg-gray-2 dark:border-strokedark dark:hover:bg-meta-4"
|
||||||
|
href="#"
|
||||||
|
>
|
||||||
|
<p className="text-sm">
|
||||||
|
<span className="text-black dark:text-white">
|
||||||
|
There are many variations
|
||||||
|
</span>{" "}
|
||||||
|
of passages of Lorem Ipsum available, but the majority have
|
||||||
|
suffered
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p className="text-xs">01 Dec, 2024</p>
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</li>
|
||||||
|
</ClickOutside>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default DropdownNotification;
|
||||||
|
|
@ -0,0 +1,129 @@
|
||||||
|
import Link from "next/link";
|
||||||
|
import DarkModeSwitcher from "./DarkModeSwitcher";
|
||||||
|
import DropdownMessage from "./DropdownMessage";
|
||||||
|
import DropdownNotification from "./DropdownNotification";
|
||||||
|
import DropdownUser from "./DropdownUser";
|
||||||
|
import Image from "next/image";
|
||||||
|
|
||||||
|
const Header = (props: {
|
||||||
|
sidebarOpen: string | boolean | undefined;
|
||||||
|
setSidebarOpen: (arg0: boolean) => void;
|
||||||
|
}) => {
|
||||||
|
return (
|
||||||
|
<header className="sticky top-0 z-999 flex w-full bg-white drop-shadow-1 dark:bg-boxdark dark:drop-shadow-none">
|
||||||
|
<div className="flex flex-grow items-center justify-between px-4 py-4 shadow-2 md:px-6 2xl:px-11">
|
||||||
|
<div className="flex items-center gap-2 sm:gap-4 lg:hidden">
|
||||||
|
{/* <!-- Hamburger Toggle BTN --> */}
|
||||||
|
<button
|
||||||
|
aria-controls="sidebar"
|
||||||
|
onClick={(e) => {
|
||||||
|
e.stopPropagation();
|
||||||
|
props.setSidebarOpen(!props.sidebarOpen);
|
||||||
|
}}
|
||||||
|
className="z-99999 block rounded-sm border border-stroke bg-white p-1.5 shadow-sm dark:border-strokedark dark:bg-boxdark lg:hidden"
|
||||||
|
>
|
||||||
|
<span className="relative block h-5.5 w-5.5 cursor-pointer">
|
||||||
|
<span className="du-block absolute right-0 h-full w-full">
|
||||||
|
<span
|
||||||
|
className={`relative left-0 top-0 my-1 block h-0.5 w-0 rounded-sm bg-black delay-[0&rsqb duration-200 ease-in-out dark:bg-white ${
|
||||||
|
!props.sidebarOpen && "!w-full delay-300"
|
||||||
|
}`}
|
||||||
|
></span>
|
||||||
|
<span
|
||||||
|
className={`relative left-0 top-0 my-1 block h-0.5 w-0 rounded-sm bg-black delay-150 duration-200 ease-in-out dark:bg-white ${
|
||||||
|
!props.sidebarOpen && "delay-400 !w-full"
|
||||||
|
}`}
|
||||||
|
></span>
|
||||||
|
<span
|
||||||
|
className={`relative left-0 top-0 my-1 block h-0.5 w-0 rounded-sm bg-black delay-200 duration-200 ease-in-out dark:bg-white ${
|
||||||
|
!props.sidebarOpen && "!w-full delay-500"
|
||||||
|
}`}
|
||||||
|
></span>
|
||||||
|
</span>
|
||||||
|
<span className="absolute right-0 h-full w-full rotate-45">
|
||||||
|
<span
|
||||||
|
className={`absolute left-2.5 top-0 block h-full w-0.5 rounded-sm bg-black delay-300 duration-200 ease-in-out dark:bg-white ${
|
||||||
|
!props.sidebarOpen && "!h-0 !delay-[0&rsqb"
|
||||||
|
}`}
|
||||||
|
></span>
|
||||||
|
<span
|
||||||
|
className={`delay-400 absolute left-0 top-2.5 block h-0.5 w-full rounded-sm bg-black duration-200 ease-in-out dark:bg-white ${
|
||||||
|
!props.sidebarOpen && "!h-0 !delay-200"
|
||||||
|
}`}
|
||||||
|
></span>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
{/* <!-- Hamburger Toggle BTN --> */}
|
||||||
|
|
||||||
|
<Link className="block flex-shrink-0 lg:hidden" href="/">
|
||||||
|
<Image
|
||||||
|
width={32}
|
||||||
|
height={32}
|
||||||
|
src={"/images/logo/logo-icon.svg"}
|
||||||
|
alt="Logo"
|
||||||
|
/>
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="hidden sm:block">
|
||||||
|
<form action="https://formbold.com/s/unique_form_id" method="POST">
|
||||||
|
<div className="relative">
|
||||||
|
<button className="absolute left-0 top-1/2 -translate-y-1/2">
|
||||||
|
<svg
|
||||||
|
className="fill-body hover:fill-primary dark:fill-bodydark dark:hover:fill-primary"
|
||||||
|
width="20"
|
||||||
|
height="20"
|
||||||
|
viewBox="0 0 20 20"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
fillRule="evenodd"
|
||||||
|
clipRule="evenodd"
|
||||||
|
d="M9.16666 3.33332C5.945 3.33332 3.33332 5.945 3.33332 9.16666C3.33332 12.3883 5.945 15 9.16666 15C12.3883 15 15 12.3883 15 9.16666C15 5.945 12.3883 3.33332 9.16666 3.33332ZM1.66666 9.16666C1.66666 5.02452 5.02452 1.66666 9.16666 1.66666C13.3088 1.66666 16.6667 5.02452 16.6667 9.16666C16.6667 13.3088 13.3088 16.6667 9.16666 16.6667C5.02452 16.6667 1.66666 13.3088 1.66666 9.16666Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
fillRule="evenodd"
|
||||||
|
clipRule="evenodd"
|
||||||
|
d="M13.2857 13.2857C13.6112 12.9603 14.1388 12.9603 14.4642 13.2857L18.0892 16.9107C18.4147 17.2362 18.4147 17.7638 18.0892 18.0892C17.7638 18.4147 17.2362 18.4147 16.9107 18.0892L13.2857 14.4642C12.9603 14.1388 12.9603 13.6112 13.2857 13.2857Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder="Type to search..."
|
||||||
|
className="w-full bg-transparent pl-9 pr-4 font-medium focus:outline-none xl:w-125"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex items-center gap-3 2xsm:gap-7">
|
||||||
|
<ul className="flex items-center gap-2 2xsm:gap-4">
|
||||||
|
{/* <!-- Dark Mode Toggler --> */}
|
||||||
|
<DarkModeSwitcher />
|
||||||
|
{/* <!-- Dark Mode Toggler --> */}
|
||||||
|
|
||||||
|
{/* <!-- Notification Menu Area --> */}
|
||||||
|
<DropdownNotification />
|
||||||
|
{/* <!-- Notification Menu Area --> */}
|
||||||
|
|
||||||
|
{/* <!-- Chat Notification Area --> */}
|
||||||
|
<DropdownMessage />
|
||||||
|
{/* <!-- Chat Notification Area --> */}
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
{/* <!-- User Area --> */}
|
||||||
|
<DropdownUser />
|
||||||
|
{/* <!-- User Area --> */}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Header;
|
||||||
|
|
@ -0,0 +1,38 @@
|
||||||
|
"use client";
|
||||||
|
import React, { useState, ReactNode } from "react";
|
||||||
|
import Sidebar from "@/components/Sidebar";
|
||||||
|
import Header from "@/components/Header";
|
||||||
|
|
||||||
|
export default function DefaultLayout({
|
||||||
|
children,
|
||||||
|
}: {
|
||||||
|
children: React.ReactNode;
|
||||||
|
}) {
|
||||||
|
const [sidebarOpen, setSidebarOpen] = useState(false);
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{/* <!-- ===== Page Wrapper Start ===== --> */}
|
||||||
|
<div className="flex">
|
||||||
|
{/* <!-- ===== Sidebar Start ===== --> */}
|
||||||
|
<Sidebar sidebarOpen={sidebarOpen} setSidebarOpen={setSidebarOpen} />
|
||||||
|
{/* <!-- ===== Sidebar End ===== --> */}
|
||||||
|
|
||||||
|
{/* <!-- ===== Content Area Start ===== --> */}
|
||||||
|
<div className="relative flex flex-1 flex-col lg:ml-72.5">
|
||||||
|
{/* <!-- ===== Header Start ===== --> */}
|
||||||
|
{/* <!-- ===== Header End ===== --> */}
|
||||||
|
|
||||||
|
{/* <!-- ===== Main Content Start ===== --> */}
|
||||||
|
<main>
|
||||||
|
<div className="mx-auto max-w-screen-2xl p-4 md:p-6 2xl:p-10">
|
||||||
|
{children}
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
{/* <!-- ===== Main Content End ===== --> */}
|
||||||
|
</div>
|
||||||
|
{/* <!-- ===== Content Area End ===== --> */}
|
||||||
|
</div>
|
||||||
|
{/* <!-- ===== Page Wrapper End ===== --> */}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,64 @@
|
||||||
|
"use client";
|
||||||
|
import jsVectorMap from "jsvectormap";
|
||||||
|
import "jsvectormap/dist/jsvectormap.css";
|
||||||
|
import React, { useEffect } from "react";
|
||||||
|
import "../../js/us-aea-en";
|
||||||
|
|
||||||
|
const MapOne: React.FC = () => {
|
||||||
|
useEffect(() => {
|
||||||
|
const mapOne = new jsVectorMap({
|
||||||
|
selector: "#mapOne",
|
||||||
|
map: "us_aea_en",
|
||||||
|
zoomButtons: true,
|
||||||
|
|
||||||
|
regionStyle: {
|
||||||
|
initial: {
|
||||||
|
fill: "#C8D0D8",
|
||||||
|
},
|
||||||
|
hover: {
|
||||||
|
fillOpacity: 1,
|
||||||
|
fill: "#3056D3",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
regionLabelStyle: {
|
||||||
|
initial: {
|
||||||
|
fontFamily: "Satoshi",
|
||||||
|
fontWeight: "semibold",
|
||||||
|
fill: "#fff",
|
||||||
|
},
|
||||||
|
hover: {
|
||||||
|
cursor: "pointer",
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
labels: {
|
||||||
|
regions: {
|
||||||
|
render(code: string) {
|
||||||
|
return code.split("-")[1];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
const map = document.getElementById("mapOne");
|
||||||
|
if (map) {
|
||||||
|
map.innerHTML = "";
|
||||||
|
}
|
||||||
|
// mapOne.destroy();
|
||||||
|
};
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="col-span-12 rounded-sm border border-stroke bg-white px-7.5 py-6 shadow-default dark:border-strokedark dark:bg-boxdark xl:col-span-7">
|
||||||
|
<h4 className="mb-2 text-xl font-semibold text-black dark:text-white">
|
||||||
|
Region labels
|
||||||
|
</h4>
|
||||||
|
<div className="h-90">
|
||||||
|
<div id="mapOne" className="mapOne map-btn"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default MapOne;
|
||||||
|
|
@ -0,0 +1,68 @@
|
||||||
|
"use client";
|
||||||
|
import React, { useState } from "react";
|
||||||
|
|
||||||
|
const SelectGroupOne: React.FC = () => {
|
||||||
|
const [selectedOption, setSelectedOption] = useState<string>("");
|
||||||
|
const [isOptionSelected, setIsOptionSelected] = useState<boolean>(false);
|
||||||
|
|
||||||
|
const changeTextColor = () => {
|
||||||
|
setIsOptionSelected(true);
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="mb-4.5">
|
||||||
|
<label className="mb-2.5 block text-black dark:text-white">
|
||||||
|
{" "}
|
||||||
|
Subject{" "}
|
||||||
|
</label>
|
||||||
|
|
||||||
|
<div className="relative z-20 bg-transparent dark:bg-form-input">
|
||||||
|
<select
|
||||||
|
value={selectedOption}
|
||||||
|
onChange={(e) => {
|
||||||
|
setSelectedOption(e.target.value);
|
||||||
|
changeTextColor();
|
||||||
|
}}
|
||||||
|
className={`relative z-20 w-full appearance-none rounded border border-stroke bg-transparent px-5 py-3 outline-none transition focus:border-primary active:border-primary dark:border-form-strokedark dark:bg-form-input dark:focus:border-primary ${
|
||||||
|
isOptionSelected ? "text-black dark:text-white" : ""
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<option value="" disabled className="text-body dark:text-bodydark">
|
||||||
|
Select your subject
|
||||||
|
</option>
|
||||||
|
<option value="USA" className="text-body dark:text-bodydark">
|
||||||
|
USA
|
||||||
|
</option>
|
||||||
|
<option value="UK" className="text-body dark:text-bodydark">
|
||||||
|
UK
|
||||||
|
</option>
|
||||||
|
<option value="Canada" className="text-body dark:text-bodydark">
|
||||||
|
Canada
|
||||||
|
</option>
|
||||||
|
</select>
|
||||||
|
|
||||||
|
<span className="absolute right-4 top-1/2 z-30 -translate-y-1/2">
|
||||||
|
<svg
|
||||||
|
className="fill-current"
|
||||||
|
width="24"
|
||||||
|
height="24"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<g opacity="0.8">
|
||||||
|
<path
|
||||||
|
fillRule="evenodd"
|
||||||
|
clipRule="evenodd"
|
||||||
|
d="M5.29289 8.29289C5.68342 7.90237 6.31658 7.90237 6.70711 8.29289L12 13.5858L17.2929 8.29289C17.6834 7.90237 18.3166 7.90237 18.7071 8.29289C19.0976 8.68342 19.0976 9.31658 18.7071 9.70711L12.7071 15.7071C12.3166 16.0976 11.6834 16.0976 11.2929 15.7071L5.29289 9.70711C4.90237 9.31658 4.90237 8.68342 5.29289 8.29289Z"
|
||||||
|
fill=""
|
||||||
|
></path>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default SelectGroupOne;
|
||||||
|
|
@ -0,0 +1,97 @@
|
||||||
|
"use client";
|
||||||
|
import React, { useState } from "react";
|
||||||
|
|
||||||
|
const SelectGroupTwo: React.FC = () => {
|
||||||
|
const [selectedOption, setSelectedOption] = useState<string>("");
|
||||||
|
const [isOptionSelected, setIsOptionSelected] = useState<boolean>(false);
|
||||||
|
|
||||||
|
const changeTextColor = () => {
|
||||||
|
setIsOptionSelected(true);
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<label className="mb-3 block text-sm font-medium text-black dark:text-white">
|
||||||
|
Select Country
|
||||||
|
</label>
|
||||||
|
|
||||||
|
<div className="relative z-20 bg-white dark:bg-form-input">
|
||||||
|
<span className="absolute left-4 top-1/2 z-30 -translate-y-1/2">
|
||||||
|
<svg
|
||||||
|
width="20"
|
||||||
|
height="20"
|
||||||
|
viewBox="0 0 20 20"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<g opacity="0.8">
|
||||||
|
<path
|
||||||
|
fillRule="evenodd"
|
||||||
|
clipRule="evenodd"
|
||||||
|
d="M10.0007 2.50065C5.85852 2.50065 2.50065 5.85852 2.50065 10.0007C2.50065 14.1428 5.85852 17.5007 10.0007 17.5007C14.1428 17.5007 17.5007 14.1428 17.5007 10.0007C17.5007 5.85852 14.1428 2.50065 10.0007 2.50065ZM0.833984 10.0007C0.833984 4.93804 4.93804 0.833984 10.0007 0.833984C15.0633 0.833984 19.1673 4.93804 19.1673 10.0007C19.1673 15.0633 15.0633 19.1673 10.0007 19.1673C4.93804 19.1673 0.833984 15.0633 0.833984 10.0007Z"
|
||||||
|
fill="#637381"
|
||||||
|
></path>
|
||||||
|
<path
|
||||||
|
fillRule="evenodd"
|
||||||
|
clipRule="evenodd"
|
||||||
|
d="M0.833984 9.99935C0.833984 9.53911 1.20708 9.16602 1.66732 9.16602H18.334C18.7942 9.16602 19.1673 9.53911 19.1673 9.99935C19.1673 10.4596 18.7942 10.8327 18.334 10.8327H1.66732C1.20708 10.8327 0.833984 10.4596 0.833984 9.99935Z"
|
||||||
|
fill="#637381"
|
||||||
|
></path>
|
||||||
|
<path
|
||||||
|
fillRule="evenodd"
|
||||||
|
clipRule="evenodd"
|
||||||
|
d="M7.50084 10.0008C7.55796 12.5632 8.4392 15.0301 10.0006 17.0418C11.5621 15.0301 12.4433 12.5632 12.5005 10.0008C12.4433 7.43845 11.5621 4.97153 10.0007 2.95982C8.4392 4.97153 7.55796 7.43845 7.50084 10.0008ZM10.0007 1.66749L9.38536 1.10547C7.16473 3.53658 5.90275 6.69153 5.83417 9.98346C5.83392 9.99503 5.83392 10.0066 5.83417 10.0182C5.90275 13.3101 7.16473 16.4651 9.38536 18.8962C9.54325 19.069 9.76655 19.1675 10.0007 19.1675C10.2348 19.1675 10.4581 19.069 10.6159 18.8962C12.8366 16.4651 14.0986 13.3101 14.1671 10.0182C14.1674 10.0066 14.1674 9.99503 14.1671 9.98346C14.0986 6.69153 12.8366 3.53658 10.6159 1.10547L10.0007 1.66749Z"
|
||||||
|
fill="#637381"
|
||||||
|
></path>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
|
||||||
|
<select
|
||||||
|
value={selectedOption}
|
||||||
|
onChange={(e) => {
|
||||||
|
setSelectedOption(e.target.value);
|
||||||
|
changeTextColor();
|
||||||
|
}}
|
||||||
|
className={`relative z-20 w-full appearance-none rounded border border-stroke bg-transparent px-12 py-3 outline-none transition focus:border-primary active:border-primary dark:border-form-strokedark dark:bg-form-input ${
|
||||||
|
isOptionSelected ? "text-black dark:text-white" : ""
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<option value="" disabled className="text-body dark:text-bodydark">
|
||||||
|
Select Country
|
||||||
|
</option>
|
||||||
|
<option value="USA" className="text-body dark:text-bodydark">
|
||||||
|
USA
|
||||||
|
</option>
|
||||||
|
<option value="UK" className="text-body dark:text-bodydark">
|
||||||
|
UK
|
||||||
|
</option>
|
||||||
|
<option value="Canada" className="text-body dark:text-bodydark">
|
||||||
|
Canada
|
||||||
|
</option>
|
||||||
|
</select>
|
||||||
|
|
||||||
|
<span className="absolute right-4 top-1/2 z-10 -translate-y-1/2">
|
||||||
|
<svg
|
||||||
|
width="24"
|
||||||
|
height="24"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<g opacity="0.8">
|
||||||
|
<path
|
||||||
|
fillRule="evenodd"
|
||||||
|
clipRule="evenodd"
|
||||||
|
d="M5.29289 8.29289C5.68342 7.90237 6.31658 7.90237 6.70711 8.29289L12 13.5858L17.2929 8.29289C17.6834 7.90237 18.3166 7.90237 18.7071 8.29289C19.0976 8.68342 19.0976 9.31658 18.7071 9.70711L12.7071 15.7071C12.3166 16.0976 11.6834 16.0976 11.2929 15.7071L5.29289 9.70711C4.90237 9.31658 4.90237 8.68342 5.29289 8.29289Z"
|
||||||
|
fill="#637381"
|
||||||
|
></path>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default SelectGroupTwo;
|
||||||
|
|
@ -0,0 +1,28 @@
|
||||||
|
import React from "react";
|
||||||
|
import Link from "next/link";
|
||||||
|
import { usePathname } from "next/navigation";
|
||||||
|
|
||||||
|
const SidebarDropdown = ({ item }: any) => {
|
||||||
|
const pathname = usePathname();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<ul className="mb-5.5 mt-4 flex flex-col gap-2.5 pl-6">
|
||||||
|
{item.map((item: any, index: number) => (
|
||||||
|
<li key={index}>
|
||||||
|
<Link
|
||||||
|
href={item.route}
|
||||||
|
className={`group relative flex items-center gap-2.5 rounded-md px-4 font-medium text-bodydark2 duration-300 ease-in-out hover:text-white ${
|
||||||
|
pathname === item.route ? "text-white" : ""
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
{item.label}
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default SidebarDropdown;
|
||||||
|
|
@ -0,0 +1,70 @@
|
||||||
|
import React from "react";
|
||||||
|
import Link from "next/link";
|
||||||
|
import SidebarDropdown from "@/components/Sidebar/SidebarDropdown";
|
||||||
|
import { usePathname } from "next/navigation";
|
||||||
|
|
||||||
|
const SidebarItem = ({ item, pageName, setPageName }: any) => {
|
||||||
|
const handleClick = () => {
|
||||||
|
const updatedPageName =
|
||||||
|
pageName !== item.label.toLowerCase() ? item.label.toLowerCase() : "";
|
||||||
|
return setPageName(updatedPageName);
|
||||||
|
};
|
||||||
|
|
||||||
|
const pathname = usePathname();
|
||||||
|
|
||||||
|
const isActive = (item: any) => {
|
||||||
|
if (item.route === pathname) return true;
|
||||||
|
if (item.children) {
|
||||||
|
return item.children.some((child: any) => isActive(child));
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
};
|
||||||
|
|
||||||
|
const isItemActive = isActive(item);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
href={item.route}
|
||||||
|
onClick={handleClick}
|
||||||
|
className={`${isItemActive ? "bg-graydark dark:bg-meta-4" : ""} group relative flex items-center gap-2.5 rounded-sm px-4 py-2 font-medium text-bodydark1 duration-300 ease-in-out hover:bg-graydark dark:hover:bg-meta-4`}
|
||||||
|
>
|
||||||
|
{item.icon}
|
||||||
|
{item.label}
|
||||||
|
{item.children && (
|
||||||
|
<svg
|
||||||
|
className={`absolute right-4 top-1/2 -translate-y-1/2 fill-current ${
|
||||||
|
pageName === item.label.toLowerCase() && "rotate-180"
|
||||||
|
}`}
|
||||||
|
width="20"
|
||||||
|
height="20"
|
||||||
|
viewBox="0 0 20 20"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
fillRule="evenodd"
|
||||||
|
clipRule="evenodd"
|
||||||
|
d="M4.41107 6.9107C4.73651 6.58527 5.26414 6.58527 5.58958 6.9107L10.0003 11.3214L14.4111 6.91071C14.7365 6.58527 15.2641 6.58527 15.5896 6.91071C15.915 7.23614 15.915 7.76378 15.5896 8.08922L10.5896 13.0892C10.2641 13.4147 9.73651 13.4147 9.41107 13.0892L4.41107 8.08922C4.08563 7.76378 4.08563 7.23614 4.41107 6.9107Z"
|
||||||
|
fill=""
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
)}
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
{item.children && (
|
||||||
|
<div
|
||||||
|
className={`translate transform overflow-hidden ${
|
||||||
|
pageName !== item.label.toLowerCase() && "hidden"
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
<SidebarDropdown item={item.children} />
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</li>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default SidebarItem;
|
||||||