Skip to content

Commit

Permalink
tabler icons removed with svg files
Browse files Browse the repository at this point in the history
  • Loading branch information
@sinanptm
sinanptm committed Aug 23, 2024
1 parent 8804c2f commit 8669817
Show file tree
Hide file tree
Showing 16 changed files with 95 additions and 156 deletions.
82 changes: 33 additions & 49 deletions client/app/(patient)/new-appointment/success/page.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,54 +1,38 @@
import { Button } from '@/components/ui/button'
import Image from 'next/image'
import Link from 'next/link'
import React from 'react'
import { Button } from "@/components/ui/button";
import Image from "next/image";
import Link from "next/link";
import React from "react";

const SuccessPage = () => {
return (
<div className='flex h-screen max-h-screen px-[5%]'>
<div className="success-img">
<Link href='/'>
<Image
src={'/assets/icons/logo-full.svg'}
width={1000}
height={1000}
alt='Logo'
className='h-10 w-fit'
/>
</Link>
<section className='flex flex-col items-center'>
<Image
src={'/assets/gifs/success.gif'}
width={300}
height={280}
alt='Success'
/>
<h2 className='header mb-6 max-w-[600px] text-center'>
Your <span className='text-green-500'>Appointment request</span> has been successfully submitted!.
</h2>
<p>We will be in touch shortly to confirm.</p>
</section>
<section className='request-details'>
<p>Request Appointment details</p>
<div className='flex gap-3'>
<Image
src={'/assets/icons/calendar.svg'}
width={24}
height={24}
alt='Calendar'
/>
<p>Date: <span className='text-gray-300'>October 12, 2022, 3:00 PM </span></p>
</div>
</section>
<Button variant={'outline'} className='shad-primary-btn' asChild>
<Link href={'/patient/new-appointment'}>
New Appointment
</Link>
</Button>
<p className='copyright'>© 2024 AVM Ayurveda&apos;s</p>
</div>
<div className="flex h-screen max-h-screen px-[5%]">
<div className="success-img">
<Link href="/">
<Image src={"/assets/icons/logo-full.svg"} width={1000} height={1000} alt="Logo" className="h-10 w-fit" />
</Link>
<section className="flex flex-col items-center">
<Image src={"/assets/gifs/success.gif"} className="w-auto h-auto" priority width={300} height={280} alt="Success" />
<h2 className="header mb-6 max-w-[600px] text-center">
Your <span className="text-green-500">Appointment request</span> has been successfully submitted!.
</h2>
<p>We will be in touch shortly to confirm.</p>
</section>
<section className="request-details">
<p>Request Appointment details</p>
<div className="flex gap-3">
<Image src={"/assets/icons/calendar.svg"} width={24} height={24} alt="Calendar" />
<p>
Date: <span className="text-gray-300">October 12, 2022, 3:00 PM </span>
</p>
</div>
</section>
<Button variant={"outline"} className="shad-primary-btn" asChild>
<Link href={"/patient/new-appointment"}>New Appointment</Link>
</Button>
<p className="copyright">© 2024 AVM Ayurveda&apos;s</p>
</div>
</div>
)
}
);
};

export default SuccessPage
export default SuccessPage;
2 changes: 1 addition & 1 deletion client/lib/redux/StoreProvider.tsx → client/app/StoreProvider.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
'use client';

import { Provider } from 'react-redux';
import { store } from './store';
import { store } from '@/lib/redux/store';

export default function StoreProvider({ children }: { children: React.ReactNode }) {
return <Provider store={store}>{children}</Provider>;
Expand Down
2 changes: 1 addition & 1 deletion client/app/layout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { Plus_Jakarta_Sans } from "next/font/google";
import "../styles/globals.css";
import { cn } from "@/lib/utils";
import { ThemeProvider } from "@/components/theme-provider";
import StoreProvider from "../lib/redux/StoreProvider";
import StoreProvider from "./StoreProvider";
import NavBar from "@/components/NavBar";

const inter = Plus_Jakarta_Sans({
Expand Down
4 changes: 2 additions & 2 deletions client/components/CustomFormField.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ import { Select } from "@radix-ui/react-select";
import { SelectContent, SelectTrigger, SelectValue } from "./ui/select";
import { Checkbox } from "./ui/checkbox";
import { Textarea } from "./ui/textarea";
import { IconCalendar } from "@tabler/icons-react";


const RenderField = ({ field, props }: { field: any; props: CustomProps }) => {
const {
Expand Down Expand Up @@ -71,7 +71,7 @@ const RenderField = ({ field, props }: { field: any; props: CustomProps }) => {
case FormFieldType.DATE_PICKER:
return (
<div className="flex rounded-md border border-dark-500 bg-dark-400">
<IconCalendar className="ml-2 mt-1" />
<Image src={'/assets/icons/calendar.svg'} alt="Calendar" width={22} height={22} className="ml-2 mt-1" />
<FormControl>
<ReactDatePicker
showTimeSelect={props.showTimeSelect ?? false}
Expand Down
14 changes: 10 additions & 4 deletions client/components/NavBar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ export default function Component() {
return (
<header className="sticky top-0 flex h-16 items-center gap-4 border-b bg-background px-4 md:px-6">
<nav className="hidden flex-col gap-6 text-lg font-medium md:flex md:flex-row md:items-center md:gap-5 md:text-sm lg:gap-6">
<Link href="#" className="flex items-center gap-2 text-lg font-semibold md:text-base" prefetch={false}>
<Link href="/" className="flex items-center gap-2 text-lg font-semibold md:text-base" prefetch={false}>
<Package2 className="h-6 w-6" />
<span className="sr-only">Acme Inc</span>
</Link>
Expand All @@ -44,8 +44,14 @@ export default function Component() {
<span className="sr-only">Navigation Menu</span>
</SheetTitle>
<nav className="grid gap-6 text-lg font-medium">
<Link href="#" className="flex items-center gap-2 text-lg font-semibold" prefetch={false}>
<Package2 className="h-6 w-6" />
<Link href="/client" className="flex items-center gap-2 text-lg font-semibold" prefetch={false}>
<Image
src={"/assets/icons/logo-icon.svg"}
width={33}
height={33}
alt="Logo"
className="h-11 w-11"
/>
<span className="sr-only">Acme Inc</span>
</Link>
{NavLinks.map((link) => (
Expand Down Expand Up @@ -90,7 +96,7 @@ export default function Component() {
<span className="sr-only">Toggle user menu</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuContent align="end" className="mt-3">
<DropdownMenuLabel>My Account</DropdownMenuLabel>
<DropdownMenuSeparator />
<DropdownMenuItem>Settings</DropdownMenuItem>
Expand Down
5 changes: 2 additions & 3 deletions client/components/forms/SignupForm.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,6 @@ import SubmitButton from "@/components/SubmitButton";
import { signupFormValidation } from "@/lib/userValidation";
import { FormFieldType } from "@/types/fromTypes";
import Link from "next/link";
import { IconMail, IconUser } from "@tabler/icons-react";

const RegistrationForm = () => {
const [isLoading, setIsLoading] = useState<boolean>(false);
Expand Down Expand Up @@ -57,7 +56,7 @@ const RegistrationForm = () => {
name="name"
label="Full Name *"
placeholder="John Doe"
Icon={IconUser}
iconSrc="/assets/icons/user.svg"
/>

{/* EMAIL & PHONE */}
Expand All @@ -68,7 +67,7 @@ const RegistrationForm = () => {
name="email"
label="Email address *"
placeholder="[email protected]"
Icon={IconMail}
iconSrc={'/assets/icons/email.svg'}
/>

<CustomFormField
Expand Down
4 changes: 1 addition & 3 deletions client/components/forms/doctor/SigninForm.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,7 @@ import { Form } from "@/components/ui/form";
import CustomFormField from "@/components/CustomFormField";
import SubmitButton from "@/components/SubmitButton";
import { signinFormValidation } from "@/lib/adminValidation";
import Link from "next/link";
import { FormFieldType } from "@/types/fromTypes";
import { IconMail } from "@tabler/icons-react";

const SigninForm = () => {
const [isLoading, setIsLoading] = useState<boolean>(false);
Expand Down Expand Up @@ -44,7 +42,7 @@ const SigninForm = () => {
name="email"
label="Email address *"
placeholder="[email protected]"
Icon={IconMail}
iconSrc={'/assets/icons/email.svg'}
/>

<CustomFormField
Expand Down
67 changes: 20 additions & 47 deletions client/components/ui/sidebar.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { cn } from "@/lib/utils";
import Link, { LinkProps } from "next/link";
import React, { useState, createContext, useContext } from "react";
import { AnimatePresence, motion } from "framer-motion";
import { IconMenu2, IconX } from "@tabler/icons-react";
import Image from "next/image";

interface Links {
label: string;
Expand All @@ -17,9 +17,7 @@ interface SidebarContextProps {
animate: boolean;
}

const SidebarContext = createContext<SidebarContextProps | undefined>(
undefined
);
const SidebarContext = createContext<SidebarContextProps | undefined>(undefined);

export const useSidebar = () => {
const context = useContext(SidebarContext);
Expand All @@ -44,11 +42,7 @@ export const SidebarProvider = ({
const open = openProp !== undefined ? openProp : openState;
const setOpen = setOpenProp !== undefined ? setOpenProp : setOpenState;

return (
<SidebarContext.Provider value={{ open, setOpen, animate }}>
{children}
</SidebarContext.Provider>
);
return <SidebarContext.Provider value={{ open, setOpen, animate }}>{children}</SidebarContext.Provider>;
};

export const Sidebar = ({
Expand Down Expand Up @@ -78,11 +72,7 @@ export const SidebarBody = (props: React.ComponentProps<typeof motion.div>) => {
);
};

export const DesktopSidebar = ({
className,
children,
...props
}: React.ComponentProps<typeof motion.div>) => {
export const DesktopSidebar = ({ className, children, ...props }: React.ComponentProps<typeof motion.div>) => {
const { open, setOpen, animate } = useSidebar();
return (
<>
Expand All @@ -96,31 +86,29 @@ export const DesktopSidebar = ({
}}
onMouseEnter={() => setOpen(true)}
onMouseLeave={() => setOpen(false)}
{...props}
>
{...props}>
{children}
</motion.div>
</>
);
};

export const MobileSidebar = ({
className,
children,
...props
}: React.ComponentProps<"div">) => {
export const MobileSidebar = ({ className, children, ...props }: React.ComponentProps<"div">) => {
const { open, setOpen } = useSidebar();
return (
<>
<div
className={cn(
"h-10 px-4 py-4 flex flex-row md:hidden items-center justify-between bg-neutral-100 dark:bg-neutral-800 w-full"
)}
{...props}
>
{...props}>
<div className="flex justify-end z-20 w-full">
<IconMenu2
className="text-neutral-800 dark:text-neutral-200"
<Image
src={"/assets/icons/menu.svg"}
alt="Menu Icon"
width={28}
height={28}
className=""
onClick={() => setOpen(!open)}
/>
</div>
Expand All @@ -137,13 +125,11 @@ export const MobileSidebar = ({
className={cn(
"fixed h-full w-full inset-0 bg-white dark:bg-neutral-900 p-10 z-[100] flex flex-col justify-between",
className
)}
>
)}>
<div
className="absolute right-10 top-10 z-50 text-neutral-800 dark:text-neutral-200"
onClick={() => setOpen(!open)}
>
<IconX />
onClick={() => setOpen(!open)}>
<Image src="/assets/icons/x.svg" alt="X icon" width={23} height={23} />
</div>
{children}
</motion.div>
Expand All @@ -154,34 +140,21 @@ export const MobileSidebar = ({
);
};

export const SidebarLink = ({
link,
className,
...props
}: {
link: Links;
className?: string;
props?: LinkProps;
}) => {
export const SidebarLink = ({ link, className, ...props }: { link: Links; className?: string; props?: LinkProps }) => {
const { open, animate } = useSidebar();
return (
<Link
href={link.href}
className={cn(
"flex items-center justify-start gap-2 group/sidebar py-2",
className
)}
{...props}
>
className={cn("flex items-center justify-start gap-2 group/sidebar py-2", className)}
{...props}>
{link.icon}

<motion.span
animate={{
display: animate ? (open ? "inline-block" : "none") : "inline-block",
opacity: animate ? (open ? 1 : 0) : 1,
}}
className="text-neutral-700 dark:text-neutral-200 text-sm group-hover/sidebar:translate-x-1 transition duration-150 whitespace-pre inline-block !p-0 !m-0"
>
className="text-neutral-700 dark:text-neutral-200 text-sm group-hover/sidebar:translate-x-1 transition duration-150 whitespace-pre inline-block !p-0 !m-0">
{link.label}
</motion.span>
</Link>
Expand Down
Loading

0 comments on commit 8669817

Please sign in to comment.