mirror of
https://github.com/wasp-lang/open-saas.git
synced 2025-06-25 08:11:07 +02:00
add admin dashboard
This commit is contained in:
vincanger
parent
3354093c13
commit
314a8b8a63
79
main.wasp
79
main.wasp
@ -62,6 +62,11 @@ app SaaSTemplate {
|
||||
("node-fetch", "3.3.0"),
|
||||
("react-hook-form", "^7.45.4"),
|
||||
("stripe", "11.15.0"),
|
||||
("react-hot-toast", "^2.4.1"),
|
||||
("react-apexcharts", "^1.4.1"),
|
||||
("apexcharts", "^3.41.0"),
|
||||
("headlessui", "^0.0.0"),
|
||||
|
||||
],
|
||||
}
|
||||
|
||||
@ -73,9 +78,11 @@ entity User {=psl
|
||||
id Int @id @default(autoincrement())
|
||||
email String? @unique
|
||||
password String?
|
||||
lastActiveTimestamp DateTime @default(now())
|
||||
isEmailVerified Boolean @default(false)
|
||||
emailVerificationSentAt DateTime?
|
||||
passwordResetSentAt DateTime?
|
||||
referrer String @default("unknown")
|
||||
stripeId String?
|
||||
checkoutSessionId String?
|
||||
hasPaid Boolean @default(false)
|
||||
@ -85,6 +92,7 @@ entity User {=psl
|
||||
credits Int @default(3)
|
||||
relatedObject RelatedObject[]
|
||||
externalAuthAssociations SocialLogin[]
|
||||
contactFormMessages ContactFormMessage[]
|
||||
psl=}
|
||||
|
||||
entity SocialLogin {=psl
|
||||
@ -107,6 +115,15 @@ entity RelatedObject {=psl
|
||||
updatedAt DateTime @updatedAt
|
||||
psl=}
|
||||
|
||||
entity ContactFormMessage {=psl
|
||||
id String @id @default(uuid())
|
||||
content String
|
||||
user User @relation(fields: [userId], references: [id])
|
||||
userId Int
|
||||
createdAt DateTime @default(now())
|
||||
isRead Boolean @default(false)
|
||||
repliedAt DateTime?
|
||||
psl=}
|
||||
|
||||
/* 📡 These are the Wasp Routes (You can protect them easily w/ 'authRequired: true');
|
||||
* https://wasp-lang.dev/docs/tutorial/pages
|
||||
@ -169,6 +186,60 @@ page CheckoutPage {
|
||||
component: import Checkout from "@client/CheckoutPage"
|
||||
}
|
||||
|
||||
route AdminRoute { path: "/admin", to: DashboardPage }
|
||||
page DashboardPage {
|
||||
authRequired: true,
|
||||
component: import Dashboard from "@client/admin/pages/Dashboard/Ecommerce"
|
||||
}
|
||||
|
||||
route AdminUsersRoute { path: "/admin/users", to: AdminUsersPage }
|
||||
page AdminUsersPage {
|
||||
authRequired: true,
|
||||
component: import AdminUsers from "@client/admin/pages/Users"
|
||||
}
|
||||
|
||||
route AdminSettingsRoute { path: "/admin/settings", to: AdminSettingsPage }
|
||||
page AdminSettingsPage {
|
||||
authRequired: true,
|
||||
component: import AdminSettings from "@client/admin/pages/Settings"
|
||||
}
|
||||
|
||||
route AdminChartsRoute { path: "/admin/chart", to: AdminChartsPage }
|
||||
page AdminChartsPage {
|
||||
authRequired: true,
|
||||
component: import AdminCharts from "@client/admin/pages/Chart"
|
||||
}
|
||||
|
||||
route AdminFormElementsRoute { path: "/admin/forms/form-elements", to: AdminFormElementsPage }
|
||||
page AdminFormElementsPage {
|
||||
authRequired: true,
|
||||
component: import AdminForms from "@client/admin/pages/Form/FormElements"
|
||||
}
|
||||
|
||||
route AdminFormLayoutsRoute { path: "/admin/forms/form-layouts", to: AdminFormLayoutsPage }
|
||||
page AdminFormLayoutsPage {
|
||||
authRequired: true,
|
||||
component: import AdminForms from "@client/admin/pages/Form/FormLayout"
|
||||
}
|
||||
|
||||
route AdminCalendarRoute { path: "/admin/calendar", to: AdminCalendarPage }
|
||||
page AdminCalendarPage {
|
||||
authRequired: true,
|
||||
component: import AdminCalendar from "@client/admin/pages/Calendar"
|
||||
}
|
||||
|
||||
route AdminUIAlertsRoute { path: "/admin/ui/alerts", to: AdminUIAlertsPage }
|
||||
page AdminUIAlertsPage {
|
||||
authRequired: true,
|
||||
component: import AdminUI from "@client/admin/pages/UiElements/Alerts"
|
||||
}
|
||||
|
||||
route AdminUIButtonsRoute { path: "/admin/ui/buttons", to: AdminUIButtonsPage }
|
||||
page AdminUIButtonsPage {
|
||||
authRequired: true,
|
||||
component: import AdminUI from "@client/admin/pages/UiElements/Buttons"
|
||||
}
|
||||
|
||||
/* ⛑ These are the Wasp Operations, which allow the client and server to interact:
|
||||
* https://wasp-lang.dev/docs/data-model/operations/overview
|
||||
*/
|
||||
@ -190,10 +261,10 @@ action stripePayment {
|
||||
// entities: [User]
|
||||
// }
|
||||
|
||||
// action updateUser {
|
||||
// fn: import { updateUser } from "@server/actions.js",
|
||||
// entities: [User]
|
||||
// }
|
||||
action updateUser {
|
||||
fn: import { updateUser } from "@server/actions.js",
|
||||
entities: [User]
|
||||
}
|
||||
|
||||
// 📚 Queries
|
||||
|
||||
|
||||
@ -0,0 +1,3 @@
|
||||
-- AlterTable
|
||||
ALTER TABLE "User" ADD COLUMN "lastActiveTimestamp" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
ADD COLUMN "referrer" TEXT NOT NULL DEFAULT 'unknown';
|
||||
14
migrations/20231113113101_referrer/migration.sql
Normal file
14
migrations/20231113113101_referrer/migration.sql
Normal file
@ -0,0 +1,14 @@
|
||||
-- CreateTable
|
||||
CREATE TABLE "ContactFormMessage" (
|
||||
"id" TEXT NOT NULL,
|
||||
"content" TEXT NOT NULL,
|
||||
"userId" INTEGER NOT NULL,
|
||||
"createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"isRead" BOOLEAN NOT NULL DEFAULT false,
|
||||
"repliedAt" TIMESTAMP(3),
|
||||
|
||||
CONSTRAINT "ContactFormMessage_pkey" PRIMARY KEY ("id")
|
||||
);
|
||||
|
||||
-- AddForeignKey
|
||||
ALTER TABLE "ContactFormMessage" ADD CONSTRAINT "ContactFormMessage_userId_fkey" FOREIGN KEY ("userId") REFERENCES "User"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
|
||||
@ -1,23 +1,54 @@
|
||||
import './Main.css';
|
||||
import NavBar from './NavBar';
|
||||
import { useMemo, ReactNode } from 'react';
|
||||
import { useMemo, useEffect, ReactNode } from 'react';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
import { useReferrer, UNKOWN_REFERRER } from './hooks/useReferrer';
|
||||
import useAuth from '@wasp/auth/useAuth';
|
||||
import updateUser from '@wasp/actions/updateUser.js';
|
||||
|
||||
/**
|
||||
* use this component to wrap all child components
|
||||
* this is useful for templates, themes, and context
|
||||
*/
|
||||
export default function App({ children }: { children: ReactNode }) {
|
||||
const location = useLocation();
|
||||
const { data: user } = useAuth();
|
||||
const [referrer, setReferrer] = useReferrer();
|
||||
|
||||
const shouldDisplayAppNavBar = useMemo(() => {
|
||||
return !location.pathname.startsWith('/landing-page');
|
||||
}, [location]);
|
||||
/**
|
||||
* use this component to wrap all child components
|
||||
* this is useful for templates, themes, and context
|
||||
* in this case the NavBar will always be rendered
|
||||
*/
|
||||
|
||||
const isAdminDashboard = useMemo(() => {
|
||||
return location.pathname.startsWith('/admin');
|
||||
}, [location]);
|
||||
|
||||
useEffect(() => {
|
||||
if (user) {
|
||||
const lastSeenAt = new Date(user.lastActiveTimestamp);
|
||||
const today = new Date();
|
||||
if (lastSeenAt.getDate() === today.getDate()) return;
|
||||
updateUser({ lastActiveTimestamp: today });
|
||||
}
|
||||
}, [user]);
|
||||
|
||||
useEffect(() => {
|
||||
if (user && referrer && referrer !== UNKOWN_REFERRER) {
|
||||
updateUser({ referrer });
|
||||
setReferrer(null);
|
||||
}
|
||||
}, [user, referrer]);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<>
|
||||
{isAdminDashboard ? (
|
||||
<>{children}</>
|
||||
) : (
|
||||
<>
|
||||
{shouldDisplayAppNavBar && <NavBar />}
|
||||
<div className='mx-auto max-w-7xl sm:px-6 lg:px-8 '>{children}</div>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@ -2,3 +2,155 @@
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@layer utilities {
|
||||
/* Chrome, Safari and Opera */
|
||||
.no-scrollbar::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.no-scrollbar {
|
||||
-ms-overflow-style: none; /* IE and Edge */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
}
|
||||
|
||||
.chat-height {
|
||||
@apply h-[calc(100vh_-_8.125rem)] lg:h-[calc(100vh_-_5.625rem)];
|
||||
}
|
||||
.inbox-height {
|
||||
@apply h-[calc(100vh_-_8.125rem)] lg:h-[calc(100vh_-_5.625rem)];
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* third-party libraries CSS */
|
||||
|
||||
.tableCheckbox:checked ~ div span {
|
||||
@apply opacity-100;
|
||||
}
|
||||
.tableCheckbox:checked ~ div {
|
||||
@apply bg-primary border-primary;
|
||||
}
|
||||
|
||||
.apexcharts-legend-text {
|
||||
@apply !text-body dark:!text-bodydark;
|
||||
}
|
||||
.apexcharts-text {
|
||||
@apply !fill-body dark:!fill-bodydark;
|
||||
}
|
||||
.apexcharts-xcrosshairs {
|
||||
@apply !fill-stroke dark:!fill-strokedark;
|
||||
}
|
||||
.apexcharts-gridline {
|
||||
@apply !stroke-stroke dark:!stroke-strokedark;
|
||||
}
|
||||
.apexcharts-series.apexcharts-pie-series path {
|
||||
@apply dark:!stroke-transparent;
|
||||
}
|
||||
.apexcharts-legend-series {
|
||||
@apply !inline-flex gap-1.5;
|
||||
}
|
||||
.apexcharts-tooltip.apexcharts-theme-light {
|
||||
@apply dark:!bg-boxdark dark:!border-strokedark;
|
||||
}
|
||||
.apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-title {
|
||||
@apply dark:!bg-meta-4 dark:!border-strokedark;
|
||||
}
|
||||
.apexcharts-xaxistooltip, .apexcharts-yaxistooltip {
|
||||
@apply dark:!bg-meta-4 dark:!border-meta-4 dark:!text-bodydark1;
|
||||
}
|
||||
.apexcharts-xaxistooltip-bottom:after {
|
||||
@apply dark:!border-b-meta-4;
|
||||
}
|
||||
.apexcharts-xaxistooltip-bottom:before {
|
||||
@apply dark:!border-b-meta-4;
|
||||
|
||||
}
|
||||
|
||||
.flatpickr-day.selected {
|
||||
@apply bg-primary border-primary hover:bg-primary hover:border-primary;
|
||||
}
|
||||
.flatpickr-months .flatpickr-prev-month:hover svg,
|
||||
.flatpickr-months .flatpickr-next-month:hover svg {
|
||||
@apply fill-primary;
|
||||
}
|
||||
.flatpickr-calendar.arrowTop:before {
|
||||
@apply dark:!border-b-boxdark;
|
||||
}
|
||||
.flatpickr-calendar.arrowTop:after {
|
||||
@apply dark:!border-b-boxdark;
|
||||
}
|
||||
.flatpickr-calendar {
|
||||
@apply dark:!bg-boxdark dark:!text-bodydark dark:!shadow-8 !p-6 2xsm:!w-auto;
|
||||
}
|
||||
.flatpickr-day {
|
||||
@apply dark:!text-bodydark;
|
||||
}
|
||||
.flatpickr-months .flatpickr-prev-month, .flatpickr-months .flatpickr-next-month {
|
||||
@apply !top-7 dark:!text-white dark:!fill-white;
|
||||
}
|
||||
.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month, .flatpickr-months .flatpickr-next-month.flatpickr-prev-month {
|
||||
@apply !left-7
|
||||
}
|
||||
.flatpickr-months .flatpickr-prev-month.flatpickr-next-month, .flatpickr-months .flatpickr-next-month.flatpickr-next-month {
|
||||
@apply !right-7
|
||||
}
|
||||
span.flatpickr-weekday,
|
||||
.flatpickr-months .flatpickr-month {
|
||||
@apply dark:!text-white dark:!fill-white;
|
||||
}
|
||||
.flatpickr-day.inRange {
|
||||
@apply dark:!bg-meta-4 dark:!border-meta-4 dark:!shadow-7;
|
||||
}
|
||||
.flatpickr-day.selected, .flatpickr-day.startRange,
|
||||
.flatpickr-day.selected, .flatpickr-day.endRange {
|
||||
@apply dark:!text-white;
|
||||
}
|
||||
|
||||
.map-btn .jvm-zoom-btn {
|
||||
@apply flex items-center justify-center w-7.5 h-7.5 rounded border border-stroke dark:border-strokedark hover:border-primary dark:hover:border-primary bg-white hover:bg-primary text-body hover:text-white dark:text-bodydark dark:hover:text-white text-2xl leading-none px-0 pt-0 pb-0.5;
|
||||
}
|
||||
.mapOne .jvm-zoom-btn {
|
||||
@apply left-auto top-auto bottom-0;
|
||||
}
|
||||
.mapOne .jvm-zoom-btn.jvm-zoomin {
|
||||
@apply right-10;
|
||||
}
|
||||
.mapOne .jvm-zoom-btn.jvm-zoomout {
|
||||
@apply right-0;
|
||||
}
|
||||
.mapTwo .jvm-zoom-btn {
|
||||
@apply top-auto bottom-0;
|
||||
}
|
||||
.mapTwo .jvm-zoom-btn.jvm-zoomin {
|
||||
@apply left-0;
|
||||
}
|
||||
.mapTwo .jvm-zoom-btn.jvm-zoomout {
|
||||
@apply left-10;
|
||||
}
|
||||
|
||||
.taskCheckbox:checked ~ .box span {
|
||||
@apply opacity-100;
|
||||
}
|
||||
.taskCheckbox:checked ~ p {
|
||||
@apply line-through;
|
||||
}
|
||||
.taskCheckbox:checked ~ .box {
|
||||
@apply bg-primary border-primary dark:border-primary;
|
||||
}
|
||||
|
||||
.custom-input-date::-webkit-calendar-picker-indicator {
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 20px;
|
||||
}
|
||||
.custom-input-date-1::-webkit-calendar-picker-indicator {
|
||||
background-image: url(./images/icon/icon-calendar.svg);
|
||||
}
|
||||
.custom-input-date-2::-webkit-calendar-picker-indicator {
|
||||
background-image: url(./images/icon/icon-arrow-down.svg);
|
||||
}
|
||||
|
||||
[x-cloak] {
|
||||
display: none !important;
|
||||
}
|
||||
9
src/client/admin/common/Loader/index.tsx
Normal file
9
src/client/admin/common/Loader/index.tsx
Normal file
@ -0,0 +1,9 @@
|
||||
const Loader = () => {
|
||||
return (
|
||||
<div className="flex h-screen items-center justify-center bg-white">
|
||||
<div className="h-16 w-16 animate-spin rounded-full border-4 border-solid border-primary border-t-transparent"></div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Loader;
|
||||
146
src/client/admin/components/BarChart.tsx
Normal file
146
src/client/admin/components/BarChart.tsx
Normal file
@ -0,0 +1,146 @@
|
||||
import { ApexOptions } from 'apexcharts';
|
||||
import React, { useState } from 'react';
|
||||
import ReactApexChart from 'react-apexcharts';
|
||||
|
||||
interface BarChartState {
|
||||
series: { data: number[] }[];
|
||||
}
|
||||
|
||||
const BarChart: React.FC = () => {
|
||||
const [state, setState] = useState<BarChartState>({
|
||||
series: [
|
||||
{
|
||||
data: [
|
||||
168, 385, 201, 298, 187, 195, 291, 110, 215, 390, 280, 112, 123, 212,
|
||||
270, 190, 310, 115, 90, 380, 112, 223, 292, 170, 290, 110, 115, 290,
|
||||
380, 312,
|
||||
],
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
const options: ApexOptions = {
|
||||
colors: ['#3C50E0'],
|
||||
chart: {
|
||||
fontFamily: 'Satoshi, sans-serif',
|
||||
type: 'bar',
|
||||
height: 350,
|
||||
toolbar: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
plotOptions: {
|
||||
bar: {
|
||||
horizontal: false,
|
||||
columnWidth: '55%',
|
||||
// endingShape: "rounded",
|
||||
borderRadius: 2,
|
||||
},
|
||||
},
|
||||
dataLabels: {
|
||||
enabled: false,
|
||||
},
|
||||
stroke: {
|
||||
show: true,
|
||||
width: 4,
|
||||
colors: ['transparent'],
|
||||
},
|
||||
xaxis: {
|
||||
categories: [
|
||||
'1',
|
||||
'2',
|
||||
'3',
|
||||
'4',
|
||||
'5',
|
||||
'6',
|
||||
'7',
|
||||
'8',
|
||||
'9',
|
||||
'10',
|
||||
'11',
|
||||
'12',
|
||||
'13',
|
||||
'14',
|
||||
'15',
|
||||
'16',
|
||||
'17',
|
||||
'18',
|
||||
'19',
|
||||
'20',
|
||||
'21',
|
||||
'22',
|
||||
'23',
|
||||
'24',
|
||||
'25',
|
||||
'26',
|
||||
'27',
|
||||
'28',
|
||||
'29',
|
||||
'30',
|
||||
],
|
||||
axisBorder: {
|
||||
show: false,
|
||||
},
|
||||
axisTicks: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
horizontalAlign: 'left',
|
||||
fontFamily: 'inter',
|
||||
|
||||
markers: {
|
||||
radius: 99,
|
||||
},
|
||||
},
|
||||
// yaxis: {
|
||||
// title: false,
|
||||
// },
|
||||
grid: {
|
||||
yaxis: {
|
||||
lines: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
},
|
||||
fill: {
|
||||
opacity: 1,
|
||||
},
|
||||
|
||||
tooltip: {
|
||||
x: {
|
||||
show: false,
|
||||
},
|
||||
// y: {
|
||||
// formatter: function (val) {
|
||||
// return val;
|
||||
// },
|
||||
// },
|
||||
},
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="col-span-12 rounded-sm border border-stroke bg-white px-5 pt-7.5 pb-5 shadow-default dark:border-strokedark dark:bg-boxdark sm:px-7.5">
|
||||
<div>
|
||||
<h3 className="text-xl font-semibold text-black dark:text-white">
|
||||
Visitors Analytics
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<div className="mb-2">
|
||||
<div id="chartFour" className="-ml-5">
|
||||
<ReactApexChart
|
||||
options={options}
|
||||
series={state.series}
|
||||
type="bar"
|
||||
height={350}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default BarChart;
|
||||
24
src/client/admin/components/Breadcrumb.tsx
Normal file
24
src/client/admin/components/Breadcrumb.tsx
Normal file
@ -0,0 +1,24 @@
|
||||
import { Link } from 'react-router-dom';
|
||||
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 to="/">Dashboard /</Link>
|
||||
</li>
|
||||
<li className="text-primary">{pageName}</li>
|
||||
</ol>
|
||||
</nav>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default Breadcrumb;
|
||||
41
src/client/admin/components/CheckboxOne.tsx
Normal file
41
src/client/admin/components/CheckboxOne.tsx
Normal file
@ -0,0 +1,41 @@
|
||||
import { useState } from 'react';
|
||||
|
||||
const CheckboxOne = () => {
|
||||
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 CheckboxOne;
|
||||
50
src/client/admin/components/CheckboxTwo.tsx
Normal file
50
src/client/admin/components/CheckboxTwo.tsx
Normal file
@ -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;
|
||||
192
src/client/admin/components/DailyActiveUsersChart.tsx
Normal file
192
src/client/admin/components/DailyActiveUsersChart.tsx
Normal file
@ -0,0 +1,192 @@
|
||||
import { ApexOptions } from 'apexcharts';
|
||||
import React, { useState } from 'react';
|
||||
import ReactApexChart from 'react-apexcharts';
|
||||
|
||||
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 DailyActiveUsersChart: React.FC = () => {
|
||||
const [state, setState] = useState<ChartOneState>({
|
||||
series: [
|
||||
{
|
||||
name: 'Product One',
|
||||
data: [23, 0],
|
||||
},
|
||||
|
||||
{
|
||||
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 pt-7.5 pb-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="mt-1 mr-2 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="mt-1 mr-2 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 py-1 px-3 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 py-1 px-3 text-xs font-medium text-black hover:bg-white hover:shadow-card dark:text-white dark:hover:bg-boxdark">
|
||||
Week
|
||||
</button>
|
||||
<button className="rounded py-1 px-3 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={state.series}
|
||||
type="area"
|
||||
height={350}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default DailyActiveUsersChart;
|
||||
65
src/client/admin/components/DarkModeSwitcher.tsx
Normal file
65
src/client/admin/components/DarkModeSwitcher.tsx
Normal file
@ -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 top-1/2 left-[3px] 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;
|
||||
102
src/client/admin/components/DataStats.tsx
Normal file
102
src/client/admin/components/DataStats.tsx
Normal file
@ -0,0 +1,102 @@
|
||||
const DataStats = () => {
|
||||
return (
|
||||
<div className="col-span-12 rounded-sm border border-stroke bg-white p-7.5 shadow-default dark:border-strokedark dark:bg-boxdark">
|
||||
<div className="grid grid-cols-1 gap-5 sm:grid-cols-2 xl:grid-cols-4 xl:gap-0">
|
||||
<div className="flex items-center justify-center gap-2 border-b border-stroke pb-5 dark:border-strokedark xl:border-b-0 xl:border-r xl:pb-0">
|
||||
<div>
|
||||
<h4 className="mb-0.5 text-xl font-semibold text-black dark:text-white md:text-title-lg">
|
||||
$4,350
|
||||
</h4>
|
||||
<p className="text-sm font-medium">Unique Visitors</p>
|
||||
</div>
|
||||
<div className="flex items-center gap-1">
|
||||
<svg
|
||||
width="19"
|
||||
height="19"
|
||||
viewBox="0 0 19 19"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M8.25259 5.87281L4.22834 9.89706L3.16751 8.83623L9.00282 3.00092L14.8381 8.83623L13.7773 9.89705L9.75306 5.87281L9.75306 15.0046L8.25259 15.0046L8.25259 5.87281Z"
|
||||
fill="#10B981"
|
||||
/>
|
||||
</svg>
|
||||
<span className="text-meta-3">18%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center justify-center gap-2 border-b border-stroke pb-5 dark:border-strokedark xl:border-b-0 xl:border-r xl:pb-0">
|
||||
<div>
|
||||
<h4 className="mb-0.5 text-xl font-semibold text-black dark:text-white md:text-title-lg">
|
||||
55.9K
|
||||
</h4>
|
||||
<p className="text-sm font-medium">Total Pageviews</p>
|
||||
</div>
|
||||
<div className="flex items-center gap-1">
|
||||
<svg
|
||||
width="19"
|
||||
height="19"
|
||||
viewBox="0 0 19 19"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M8.25259 5.87281L4.22834 9.89706L3.16751 8.83623L9.00282 3.00092L14.8381 8.83623L13.7773 9.89705L9.75306 5.87281L9.75306 15.0046L8.25259 15.0046L8.25259 5.87281Z"
|
||||
fill="#10B981"
|
||||
/>
|
||||
</svg>
|
||||
<span className="text-meta-3">25%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center justify-center gap-2 border-b border-stroke pb-5 dark:border-strokedark sm:border-b-0 sm:pb-0 xl:border-r">
|
||||
<div>
|
||||
<h4 className="mb-0.5 text-xl font-semibold text-black dark:text-white md:text-title-lg">
|
||||
54%
|
||||
</h4>
|
||||
<p className="text-sm font-medium">Bounce Rate</p>
|
||||
</div>
|
||||
<div className="flex items-center gap-1">
|
||||
<svg
|
||||
width="19"
|
||||
height="19"
|
||||
viewBox="0 0 19 19"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M9.75302 12.1328L13.7773 8.10856L14.8381 9.16939L9.00279 15.0047L3.16748 9.16939L4.22831 8.10856L8.25256 12.1328V3.00098H9.75302V12.1328Z"
|
||||
fill="#F0950C"
|
||||
/>
|
||||
</svg>
|
||||
<span className="text-meta-8">7%</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center justify-center gap-2">
|
||||
<div>
|
||||
<h4 className="mb-0.5 text-xl font-semibold text-black dark:text-white md:text-title-lg">
|
||||
2m 56s
|
||||
</h4>
|
||||
<p className="text-sm font-medium">Visit Duration</p>
|
||||
</div>
|
||||
<div className="flex items-center gap-1">
|
||||
<svg
|
||||
width="19"
|
||||
height="19"
|
||||
viewBox="0 0 19 19"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M8.25259 5.87281L4.22834 9.89706L3.16751 8.83623L9.00282 3.00092L14.8381 8.83623L13.7773 9.89705L9.75306 5.87281L9.75306 15.0046L8.25259 15.0046L8.25259 5.87281Z"
|
||||
fill="#10B981"
|
||||
/>
|
||||
</svg>
|
||||
<span className="text-meta-3">12%</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default DataStats;
|
||||
123
src/client/admin/components/DropdownEditDelete.tsx
Normal file
123
src/client/admin/components/DropdownEditDelete.tsx
Normal file
@ -0,0 +1,123 @@
|
||||
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">
|
||||
<button ref={trigger} onClick={() => setDropdownOpen(!dropdownOpen)}>
|
||||
<svg
|
||||
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="#98A6AD"
|
||||
/>
|
||||
<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="#98A6AD"
|
||||
/>
|
||||
<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="#98A6AD"
|
||||
/>
|
||||
</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 py-1.5 px-4 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 py-1.5 px-4 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;
|
||||
48
src/client/admin/components/DropdownMessage.tsx
Normal file
48
src/client/admin/components/DropdownMessage.tsx
Normal file
@ -0,0 +1,48 @@
|
||||
// import { useEffect, useRef, useState } from 'react';
|
||||
import { Link } from 'react-router-dom';
|
||||
|
||||
const DropdownMessage = () => {
|
||||
|
||||
|
||||
return (
|
||||
<li className="relative" x-data="{ dropdownOpen: false, notifying: true }">
|
||||
<Link
|
||||
// TODO: add wasp link
|
||||
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"
|
||||
to="#"
|
||||
>
|
||||
<span className="absolute -top-0.5 -right-0.5 z-1 h-2 w-2 rounded-full bg-meta-1">
|
||||
<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>
|
||||
</li>
|
||||
);
|
||||
};
|
||||
|
||||
export default DropdownMessage;
|
||||
138
src/client/admin/components/DropdownUser.tsx
Normal file
138
src/client/admin/components/DropdownUser.tsx
Normal file
File diff suppressed because one or more lines are too long
119
src/client/admin/components/Header.tsx
Normal file
119
src/client/admin/components/Header.tsx
Normal file
@ -0,0 +1,119 @@
|
||||
import { Link } from 'react-router-dom';
|
||||
import Logo from '../images/logo/logo-icon.svg';
|
||||
import DarkModeSwitcher from './DarkModeSwitcher';
|
||||
import DropdownMessage from './DropdownMessage';
|
||||
import DropdownUser from './DropdownUser';
|
||||
|
||||
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 py-4 px-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 top-0 left-0 my-1 block h-0.5 w-0 rounded-sm bg-black delay-[0] duration-200 ease-in-out dark:bg-white ${
|
||||
!props.sidebarOpen && '!w-full delay-300'
|
||||
}`}
|
||||
></span>
|
||||
<span
|
||||
className={`relative top-0 left-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 top-0 left-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]'
|
||||
}`}
|
||||
></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" to="/">
|
||||
<img src={Logo} 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 top-1/2 left-0 -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 pr-4 pl-9 focus:outline-none"
|
||||
/>
|
||||
</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 --> */}
|
||||
|
||||
{/* <!-- Chat Notification Area --> */}
|
||||
<DropdownMessage />
|
||||
{/* <!-- Chat Notification Area --> */}
|
||||
</ul>
|
||||
|
||||
{/* <!-- User Area --> */}
|
||||
<DropdownUser />
|
||||
{/* <!-- User Area --> */}
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
);
|
||||
};
|
||||
|
||||
export default Header;
|
||||
150
src/client/admin/components/PieChart.tsx
Normal file
150
src/client/admin/components/PieChart.tsx
Normal file
@ -0,0 +1,150 @@
|
||||
import { ApexOptions } from 'apexcharts';
|
||||
import React, { useState } from 'react';
|
||||
import ReactApexChart from 'react-apexcharts';
|
||||
|
||||
interface PieChartState {
|
||||
series: number[];
|
||||
}
|
||||
|
||||
const options: ApexOptions = {
|
||||
chart: {
|
||||
type: 'donut',
|
||||
},
|
||||
colors: ['#10B981', '#375E83', '#259AE6', '#FFA70B'],
|
||||
labels: ['Remote', 'Hybrid', 'Onsite', 'Leave'],
|
||||
legend: {
|
||||
show: true,
|
||||
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 PieChart: React.FC = () => {
|
||||
const [state, setState] = useState<PieChartState>({
|
||||
series: [65, 34, 12, 56],
|
||||
});
|
||||
|
||||
return (
|
||||
<div className="col-span-12 rounded-sm border border-stroke bg-white px-5 pt-7.5 pb-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="">Monthly</option>
|
||||
<option value="">Yearly</option>
|
||||
</select>
|
||||
<span className="absolute top-1/2 right-3 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={state.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 PieChart;
|
||||
176
src/client/admin/components/ReferrerTable.tsx
Normal file
176
src/client/admin/components/ReferrerTable.tsx
Normal file
@ -0,0 +1,176 @@
|
||||
import BrandOne from '../images/brand/brand-01.svg';
|
||||
import BrandTwo from '../images/brand/brand-02.svg';
|
||||
import BrandThree from '../images/brand/brand-03.svg';
|
||||
import BrandFour from '../images/brand/brand-04.svg';
|
||||
import BrandFive from '../images/brand/brand-05.svg';
|
||||
|
||||
const ReferrerTable = () => {
|
||||
return (
|
||||
<div className="rounded-sm border border-stroke bg-white px-5 pt-6 pb-2.5 shadow-default dark:border-strokedark dark:bg-boxdark sm:px-7.5 xl:pb-1">
|
||||
<h4 className="mb-6 text-xl font-semibold text-black dark:text-white">
|
||||
Top Channels
|
||||
</h4>
|
||||
|
||||
<div className="flex flex-col">
|
||||
<div className="grid grid-cols-3 rounded-sm bg-gray-2 dark:bg-meta-4 sm:grid-cols-5">
|
||||
<div className="p-2.5 xl:p-5">
|
||||
<h5 className="text-sm font-medium uppercase xsm:text-base">
|
||||
Source
|
||||
</h5>
|
||||
</div>
|
||||
<div className="p-2.5 text-center xl:p-5">
|
||||
<h5 className="text-sm font-medium uppercase xsm:text-base">
|
||||
Visitors
|
||||
</h5>
|
||||
</div>
|
||||
<div className="p-2.5 text-center xl:p-5">
|
||||
<h5 className="text-sm font-medium uppercase xsm:text-base">
|
||||
Revenues
|
||||
</h5>
|
||||
</div>
|
||||
<div className="hidden p-2.5 text-center sm:block xl:p-5">
|
||||
<h5 className="text-sm font-medium uppercase xsm:text-base">
|
||||
Sales
|
||||
</h5>
|
||||
</div>
|
||||
<div className="hidden p-2.5 text-center sm:block xl:p-5">
|
||||
<h5 className="text-sm font-medium uppercase xsm:text-base">
|
||||
Conversion
|
||||
</h5>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-3 border-b border-stroke dark:border-strokedark sm:grid-cols-5">
|
||||
<div className="flex items-center gap-3 p-2.5 xl:p-5">
|
||||
<div className="flex-shrink-0">
|
||||
<img src={BrandOne} alt="Brand" />
|
||||
</div>
|
||||
<p className="hidden text-black dark:text-white sm:block">Google</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-center p-2.5 xl:p-5">
|
||||
<p className="text-black dark:text-white">3.5K</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-center p-2.5 xl:p-5">
|
||||
<p className="text-meta-3">$5,768</p>
|
||||
</div>
|
||||
|
||||
<div className="hidden items-center justify-center p-2.5 sm:flex xl:p-5">
|
||||
<p className="text-black dark:text-white">590</p>
|
||||
</div>
|
||||
|
||||
<div className="hidden items-center justify-center p-2.5 sm:flex xl:p-5">
|
||||
<p className="text-meta-5">4.8%</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-3 border-b border-stroke dark:border-strokedark sm:grid-cols-5">
|
||||
<div className="flex items-center gap-3 p-2.5 xl:p-5">
|
||||
<div className="flex-shrink-0">
|
||||
<img src={BrandTwo} alt="Brand" />
|
||||
</div>
|
||||
<p className="hidden text-black dark:text-white sm:block">
|
||||
Twitter
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-center p-2.5 xl:p-5">
|
||||
<p className="text-black dark:text-white">2.2K</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-center p-2.5 xl:p-5">
|
||||
<p className="text-meta-3">$4,635</p>
|
||||
</div>
|
||||
|
||||
<div className="hidden items-center justify-center p-2.5 sm:flex xl:p-5">
|
||||
<p className="text-black dark:text-white">467</p>
|
||||
</div>
|
||||
|
||||
<div className="hidden items-center justify-center p-2.5 sm:flex xl:p-5">
|
||||
<p className="text-meta-5">4.3%</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-3 border-b border-stroke dark:border-strokedark sm:grid-cols-5">
|
||||
<div className="flex items-center gap-3 p-2.5 xl:p-5">
|
||||
<div className="flex-shrink-0">
|
||||
<img src={BrandThree} alt="Brand" />
|
||||
</div>
|
||||
<p className="hidden text-black dark:text-white sm:block">Github</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-center p-2.5 xl:p-5">
|
||||
<p className="text-black dark:text-white">2.1K</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-center p-2.5 xl:p-5">
|
||||
<p className="text-meta-3">$4,290</p>
|
||||
</div>
|
||||
|
||||
<div className="hidden items-center justify-center p-2.5 sm:flex xl:p-5">
|
||||
<p className="text-black dark:text-white">420</p>
|
||||
</div>
|
||||
|
||||
<div className="hidden items-center justify-center p-2.5 sm:flex xl:p-5">
|
||||
<p className="text-meta-5">3.7%</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-3 border-b border-stroke dark:border-strokedark sm:grid-cols-5">
|
||||
<div className="flex items-center gap-3 p-2.5 xl:p-5">
|
||||
<div className="flex-shrink-0">
|
||||
<img src={BrandFour} alt="Brand" />
|
||||
</div>
|
||||
<p className="hidden text-black dark:text-white sm:block">Vimeo</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-center p-2.5 xl:p-5">
|
||||
<p className="text-black dark:text-white">1.5K</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-center p-2.5 xl:p-5">
|
||||
<p className="text-meta-3">$3,580</p>
|
||||
</div>
|
||||
|
||||
<div className="hidden items-center justify-center p-2.5 sm:flex xl:p-5">
|
||||
<p className="text-black dark:text-white">389</p>
|
||||
</div>
|
||||
|
||||
<div className="hidden items-center justify-center p-2.5 sm:flex xl:p-5">
|
||||
<p className="text-meta-5">2.5%</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-3 sm:grid-cols-5">
|
||||
<div className="flex items-center gap-3 p-2.5 xl:p-5">
|
||||
<div className="flex-shrink-0">
|
||||
<img src={BrandFive} alt="Brand" />
|
||||
</div>
|
||||
<p className="hidden text-black dark:text-white sm:block">
|
||||
Facebook
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-center p-2.5 xl:p-5">
|
||||
<p className="text-black dark:text-white">1.2K</p>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center justify-center p-2.5 xl:p-5">
|
||||
<p className="text-meta-3">$2,740</p>
|
||||
</div>
|
||||
|
||||
<div className="hidden items-center justify-center p-2.5 sm:flex xl:p-5">
|
||||
<p className="text-black dark:text-white">230</p>
|
||||
</div>
|
||||
|
||||
<div className="hidden items-center justify-center p-2.5 sm:flex xl:p-5">
|
||||
<p className="text-meta-5">1.9%</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ReferrerTable;
|
||||
529
src/client/admin/components/Sidebar.tsx
Normal file
529
src/client/admin/components/Sidebar.tsx
Normal file
File diff suppressed because one or more lines are too long
21
src/client/admin/components/SidebarLinkGroup.tsx
Normal file
21
src/client/admin/components/SidebarLinkGroup.tsx
Normal file
@ -0,0 +1,21 @@
|
||||
import { ReactNode, useState } from 'react';
|
||||
|
||||
interface SidebarLinkGroupProps {
|
||||
children: (handleClick: () => void, open: boolean) => ReactNode;
|
||||
activeCondition: boolean;
|
||||
}
|
||||
|
||||
const SidebarLinkGroup = ({
|
||||
children,
|
||||
activeCondition,
|
||||
}: SidebarLinkGroupProps) => {
|
||||
const [open, setOpen] = useState<boolean>(activeCondition);
|
||||
|
||||
const handleClick = () => {
|
||||
setOpen(!open);
|
||||
};
|
||||
|
||||
return <li>{children(handleClick, open)}</li>;
|
||||
};
|
||||
|
||||
export default SidebarLinkGroup;
|
||||
33
src/client/admin/components/SwitcherOne.tsx
Normal file
33
src/client/admin/components/SwitcherOne.tsx
Normal file
@ -0,0 +1,33 @@
|
||||
import { useState } from 'react';
|
||||
|
||||
const SwitcherOne = () => {
|
||||
const [enabled, setEnabled] = useState<boolean>(false);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<label
|
||||
htmlFor="toggle1"
|
||||
className="flex cursor-pointer select-none items-center"
|
||||
>
|
||||
<div className="relative">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="toggle1"
|
||||
className="sr-only"
|
||||
onChange={() => {
|
||||
setEnabled(!enabled);
|
||||
}}
|
||||
/>
|
||||
<div className="block h-8 w-14 rounded-full bg-meta-9 dark:bg-[#5A616B]"></div>
|
||||
<div
|
||||
className={`absolute left-1 top-1 h-6 w-6 rounded-full bg-white transition ${
|
||||
enabled && '!right-1 !translate-x-full !bg-primary dark:!bg-white'
|
||||
}`}
|
||||
></div>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default SwitcherOne;
|
||||
66
src/client/admin/components/SwitcherTwo.tsx
Normal file
66
src/client/admin/components/SwitcherTwo.tsx
Normal file
@ -0,0 +1,66 @@
|
||||
import { useState } from 'react';
|
||||
|
||||
const SwitcherTwo = () => {
|
||||
const [enabled, setEnabled] = useState(false);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<label
|
||||
htmlFor="toggle3"
|
||||
className="flex cursor-pointer select-none items-center"
|
||||
>
|
||||
<div className="relative">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="toggle3"
|
||||
className="sr-only"
|
||||
onChange={() => {
|
||||
setEnabled(!enabled);
|
||||
}}
|
||||
/>
|
||||
<div className="block h-8 w-14 rounded-full bg-meta-9 dark:bg-[#5A616B]"></div>
|
||||
<div
|
||||
className={`dot absolute left-1 top-1 flex h-6 w-6 items-center justify-center rounded-full bg-white transition ${
|
||||
enabled && '!right-1 !translate-x-full !bg-primary dark:!bg-white'
|
||||
}`}
|
||||
>
|
||||
<span className={`hidden ${enabled && '!block'}`}>
|
||||
<svg
|
||||
className="fill-white dark:fill-black"
|
||||
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=""
|
||||
stroke=""
|
||||
strokeWidth="0.4"
|
||||
></path>
|
||||
</svg>
|
||||
</span>
|
||||
<span className={`${enabled && 'hidden'}`}>
|
||||
<svg
|
||||
className="h-4 w-4 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>
|
||||
</label>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default SwitcherTwo;
|
||||
53
src/client/admin/components/TotalPaidViewsCard.tsx
Normal file
53
src/client/admin/components/TotalPaidViewsCard.tsx
Normal file
@ -0,0 +1,53 @@
|
||||
const TotalPageViewsCard = () => {
|
||||
return (
|
||||
<div className="rounded-sm border border-stroke bg-white py-6 px-7.5 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">
|
||||
<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>
|
||||
</div>
|
||||
|
||||
<div className="mt-4 flex items-end justify-between">
|
||||
<div>
|
||||
<h4 className="text-title-md font-bold text-black dark:text-white">
|
||||
$3.456K
|
||||
</h4>
|
||||
<span className="text-sm font-medium">Total views</span>
|
||||
</div>
|
||||
|
||||
<span className="flex items-center gap-1 text-sm font-medium text-meta-3">
|
||||
0.43%
|
||||
<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>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default TotalPageViewsCard;
|
||||
53
src/client/admin/components/TotalPayingUsersCard.tsx
Normal file
53
src/client/admin/components/TotalPayingUsersCard.tsx
Normal file
@ -0,0 +1,53 @@
|
||||
const TotalPayingUsersCard = () => {
|
||||
return (
|
||||
<div className="rounded-sm border border-stroke bg-white py-6 px-7.5 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">
|
||||
<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>
|
||||
</div>
|
||||
|
||||
<div className="mt-4 flex items-end justify-between">
|
||||
<div>
|
||||
<h4 className="text-title-md font-bold text-black dark:text-white">
|
||||
2.450
|
||||
</h4>
|
||||
<span className="text-sm font-medium">Total Product</span>
|
||||
</div>
|
||||
|
||||
<span className="flex items-center gap-1 text-sm font-medium text-meta-3">
|
||||
2.59%
|
||||
<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>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default TotalPayingUsersCard;
|
||||
57
src/client/admin/components/TotalProfitCard.tsx
Normal file
57
src/client/admin/components/TotalProfitCard.tsx
Normal file
@ -0,0 +1,57 @@
|
||||
const TotalProfitCard = () => {
|
||||
return (
|
||||
<div className="rounded-sm border border-stroke bg-white py-6 px-7.5 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">
|
||||
<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>
|
||||
</div>
|
||||
|
||||
<div className="mt-4 flex items-end justify-between">
|
||||
<div>
|
||||
<h4 className="text-title-md font-bold text-black dark:text-white">
|
||||
$45,2K
|
||||
</h4>
|
||||
<span className="text-sm font-medium">Total Profit</span>
|
||||
</div>
|
||||
|
||||
<span className="flex items-center gap-1 text-sm font-medium text-meta-3">
|
||||
4.35%
|
||||
<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>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default TotalProfitCard;
|
||||
57
src/client/admin/components/TotalSignupsCard.tsx
Normal file
57
src/client/admin/components/TotalSignupsCard.tsx
Normal file
@ -0,0 +1,57 @@
|
||||
const TotalSignupsCard = () => {
|
||||
return (
|
||||
<div className="rounded-sm border border-stroke bg-white py-6 px-7.5 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">
|
||||
<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>
|
||||
</div>
|
||||
|
||||
<div className="mt-4 flex items-end justify-between">
|
||||
<div>
|
||||
<h4 className="text-title-md font-bold text-black dark:text-white">
|
||||
3.456
|
||||
</h4>
|
||||
<span className="text-sm font-medium">Total Users</span>
|
||||
</div>
|
||||
|
||||
<span className="flex items-center gap-1 text-sm font-medium text-meta-5">
|
||||
0.95%
|
||||
<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 TotalSignupsCard;
|
||||
62
src/client/admin/components/UsersTable.tsx
Normal file
62
src/client/admin/components/UsersTable.tsx
Normal file
@ -0,0 +1,62 @@
|
||||
import SwitcherOne from "./SwitcherOne";
|
||||
import DropdownEditDelete from "./DropdownEditDelete";
|
||||
|
||||
const UsersTable = () => {
|
||||
return (
|
||||
<div className="rounded-sm border border-stroke bg-white shadow-default dark:border-strokedark dark:bg-boxdark">
|
||||
<div className="py-6 px-4 md:px-6 xl:px-7.5">
|
||||
<h4 className="text-xl font-semibold text-black dark:text-white">
|
||||
Users
|
||||
</h4>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-6 border-t border-stroke py-4.5 px-4 dark:border-strokedark sm:grid-cols-8 md:px-6 2xl:px-7.5">
|
||||
<div className="col-span-2 flex items-center">
|
||||
<p className="font-medium">Email</p>
|
||||
</div>
|
||||
<div className="col-span-1 hidden items-center sm:flex">
|
||||
<p className="font-medium">Last Active</p>
|
||||
</div>
|
||||
<div className="col-span-1 flex items-center">
|
||||
<p className="font-medium">Has Paid</p>
|
||||
</div>
|
||||
<div className="col-span-1 flex items-center">
|
||||
<p className="font-medium">Subscription Status</p>
|
||||
</div>
|
||||
<div className="col-span-1 flex items-center">
|
||||
<p className="font-medium">Total Paid</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-6 border-t border-stroke py-4.5 px-4 dark:border-strokedark sm:grid-cols-8 md:px-6 2xl:px-7.5">
|
||||
<div className="col-span-2 flex items-center">
|
||||
<div className="flex flex-col gap-4 sm:flex-row sm:items-center">
|
||||
<p className="text-sm text-black dark:text-white">
|
||||
Apple Watch Series 7
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-span-1 hidden items-center sm:flex">
|
||||
<p className="text-sm text-black dark:text-white">Electronics</p>
|
||||
</div>
|
||||
<div className="col-span-1 flex items-center">
|
||||
<p className="text-sm text-black dark:text-white">
|
||||
<SwitcherOne />
|
||||
</p>
|
||||
</div>
|
||||
<div className="col-span-1 flex items-center">
|
||||
<p className="text-sm text-black dark:text-white">22</p>
|
||||
</div>
|
||||
<div className="col-span-1 flex items-center">
|
||||
<p className="text-sm text-meta-3">$45</p>
|
||||
</div>
|
||||
<div className="col-span-1 flex items-center">
|
||||
<DropdownEditDelete />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default UsersTable;
|
||||
BIN
src/client/admin/fonts/Satoshi-Black.eot
Normal file
BIN
src/client/admin/fonts/Satoshi-Black.eot
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Black.ttf
Normal file
BIN
src/client/admin/fonts/Satoshi-Black.ttf
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Black.woff
Normal file
BIN
src/client/admin/fonts/Satoshi-Black.woff
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Black.woff2
Normal file
BIN
src/client/admin/fonts/Satoshi-Black.woff2
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-BlackItalic.eot
Normal file
BIN
src/client/admin/fonts/Satoshi-BlackItalic.eot
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-BlackItalic.ttf
Normal file
BIN
src/client/admin/fonts/Satoshi-BlackItalic.ttf
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-BlackItalic.woff
Normal file
BIN
src/client/admin/fonts/Satoshi-BlackItalic.woff
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-BlackItalic.woff2
Normal file
BIN
src/client/admin/fonts/Satoshi-BlackItalic.woff2
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Bold.eot
Normal file
BIN
src/client/admin/fonts/Satoshi-Bold.eot
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Bold.ttf
Normal file
BIN
src/client/admin/fonts/Satoshi-Bold.ttf
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Bold.woff
Normal file
BIN
src/client/admin/fonts/Satoshi-Bold.woff
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Bold.woff2
Normal file
BIN
src/client/admin/fonts/Satoshi-Bold.woff2
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-BoldItalic.eot
Normal file
BIN
src/client/admin/fonts/Satoshi-BoldItalic.eot
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-BoldItalic.ttf
Normal file
BIN
src/client/admin/fonts/Satoshi-BoldItalic.ttf
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-BoldItalic.woff
Normal file
BIN
src/client/admin/fonts/Satoshi-BoldItalic.woff
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-BoldItalic.woff2
Normal file
BIN
src/client/admin/fonts/Satoshi-BoldItalic.woff2
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Italic.eot
Normal file
BIN
src/client/admin/fonts/Satoshi-Italic.eot
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Italic.ttf
Normal file
BIN
src/client/admin/fonts/Satoshi-Italic.ttf
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Italic.woff
Normal file
BIN
src/client/admin/fonts/Satoshi-Italic.woff
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Italic.woff2
Normal file
BIN
src/client/admin/fonts/Satoshi-Italic.woff2
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Light.eot
Normal file
BIN
src/client/admin/fonts/Satoshi-Light.eot
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Light.ttf
Normal file
BIN
src/client/admin/fonts/Satoshi-Light.ttf
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Light.woff
Normal file
BIN
src/client/admin/fonts/Satoshi-Light.woff
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Light.woff2
Normal file
BIN
src/client/admin/fonts/Satoshi-Light.woff2
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-LightItalic.eot
Normal file
BIN
src/client/admin/fonts/Satoshi-LightItalic.eot
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-LightItalic.ttf
Normal file
BIN
src/client/admin/fonts/Satoshi-LightItalic.ttf
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-LightItalic.woff
Normal file
BIN
src/client/admin/fonts/Satoshi-LightItalic.woff
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-LightItalic.woff2
Normal file
BIN
src/client/admin/fonts/Satoshi-LightItalic.woff2
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Medium.eot
Normal file
BIN
src/client/admin/fonts/Satoshi-Medium.eot
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Medium.ttf
Normal file
BIN
src/client/admin/fonts/Satoshi-Medium.ttf
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Medium.woff
Normal file
BIN
src/client/admin/fonts/Satoshi-Medium.woff
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Medium.woff2
Normal file
BIN
src/client/admin/fonts/Satoshi-Medium.woff2
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-MediumItalic.eot
Normal file
BIN
src/client/admin/fonts/Satoshi-MediumItalic.eot
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-MediumItalic.ttf
Normal file
BIN
src/client/admin/fonts/Satoshi-MediumItalic.ttf
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-MediumItalic.woff
Normal file
BIN
src/client/admin/fonts/Satoshi-MediumItalic.woff
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-MediumItalic.woff2
Normal file
BIN
src/client/admin/fonts/Satoshi-MediumItalic.woff2
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Regular.eot
Normal file
BIN
src/client/admin/fonts/Satoshi-Regular.eot
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Regular.ttf
Normal file
BIN
src/client/admin/fonts/Satoshi-Regular.ttf
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Regular.woff
Normal file
BIN
src/client/admin/fonts/Satoshi-Regular.woff
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Regular.woff2
Normal file
BIN
src/client/admin/fonts/Satoshi-Regular.woff2
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Variable.eot
Normal file
BIN
src/client/admin/fonts/Satoshi-Variable.eot
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Variable.ttf
Normal file
BIN
src/client/admin/fonts/Satoshi-Variable.ttf
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Variable.woff
Normal file
BIN
src/client/admin/fonts/Satoshi-Variable.woff
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-Variable.woff2
Normal file
BIN
src/client/admin/fonts/Satoshi-Variable.woff2
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-VariableItalic.eot
Normal file
BIN
src/client/admin/fonts/Satoshi-VariableItalic.eot
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-VariableItalic.ttf
Normal file
BIN
src/client/admin/fonts/Satoshi-VariableItalic.ttf
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-VariableItalic.woff
Normal file
BIN
src/client/admin/fonts/Satoshi-VariableItalic.woff
Normal file
Binary file not shown.
BIN
src/client/admin/fonts/Satoshi-VariableItalic.woff2
Normal file
BIN
src/client/admin/fonts/Satoshi-VariableItalic.woff2
Normal file
Binary file not shown.
14
src/client/admin/images/brand/brand-01.svg
Normal file
14
src/client/admin/images/brand/brand-01.svg
Normal file
@ -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 |
4
src/client/admin/images/brand/brand-02.svg
Normal file
4
src/client/admin/images/brand/brand-02.svg
Normal file
@ -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 |
11
src/client/admin/images/brand/brand-03.svg
Normal file
11
src/client/admin/images/brand/brand-03.svg
Normal file
@ -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 |
4
src/client/admin/images/brand/brand-04.svg
Normal file
4
src/client/admin/images/brand/brand-04.svg
Normal file
@ -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 |
11
src/client/admin/images/brand/brand-05.svg
Normal file
11
src/client/admin/images/brand/brand-05.svg
Normal file
@ -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 |
BIN
src/client/admin/images/cards/cards-01.png
Normal file
BIN
src/client/admin/images/cards/cards-01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 402 KiB |
BIN
src/client/admin/images/cards/cards-02.png
Normal file
BIN
src/client/admin/images/cards/cards-02.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 457 KiB |
BIN
src/client/admin/images/cards/cards-03.png
Normal file
BIN
src/client/admin/images/cards/cards-03.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 392 KiB |
BIN
src/client/admin/images/cards/cards-04.png
Normal file
BIN
src/client/admin/images/cards/cards-04.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 256 KiB |
BIN
src/client/admin/images/cards/cards-05.png
Normal file
BIN
src/client/admin/images/cards/cards-05.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 402 KiB |
BIN
src/client/admin/images/cards/cards-06.png
Normal file
BIN
src/client/admin/images/cards/cards-06.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 427 KiB |
33
src/client/admin/images/country/country-01.svg
Normal file
33
src/client/admin/images/country/country-01.svg
Normal file
@ -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 |
18
src/client/admin/images/country/country-02.svg
Normal file
18
src/client/admin/images/country/country-02.svg
Normal file
@ -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 |
17
src/client/admin/images/country/country-03.svg
Normal file
17
src/client/admin/images/country/country-03.svg
Normal file
@ -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 |
17
src/client/admin/images/country/country-04.svg
Normal file
17
src/client/admin/images/country/country-04.svg
Normal file
@ -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 |
34
src/client/admin/images/country/country-05.svg
Normal file
34
src/client/admin/images/country/country-05.svg
Normal file
@ -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 |
19
src/client/admin/images/country/country-06.svg
Normal file
19
src/client/admin/images/country/country-06.svg
Normal file
@ -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 |
BIN
src/client/admin/images/cover/cover-01.png
Normal file
BIN
src/client/admin/images/cover/cover-01.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 471 KiB |
BIN
src/client/admin/images/favicon.ico
Normal file
BIN
src/client/admin/images/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
6
src/client/admin/images/icon/icon-arrow-down.svg
Normal file
6
src/client/admin/images/icon/icon-arrow-down.svg
Normal file
@ -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 |
6
src/client/admin/images/icon/icon-calendar.svg
Normal file
6
src/client/admin/images/icon/icon-calendar.svg
Normal file
@ -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 |
6
src/client/admin/images/icon/icon-copy-alt.svg
Normal file
6
src/client/admin/images/icon/icon-copy-alt.svg
Normal file
@ -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 |
10
src/client/admin/images/icon/icon-moon.svg
Normal file
10
src/client/admin/images/icon/icon-moon.svg
Normal file
@ -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 |
10
src/client/admin/images/icon/icon-sun.svg
Normal file
10
src/client/admin/images/icon/icon-sun.svg
Normal file
@ -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 |
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user