ahasani/pasargad
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add font face and create navbar component

Browse Source
This commit is contained in:
zahravaziri
2025-05-31 18:03:15 +03:30
parent 0c2b91c602
commit 357544a145
18 changed files with 72 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/globals.css
+15 -15
View File
@@ -3,8 +3,8 @@
@font-face {
font-family: 'Manrope';
src: url('/fonts/manrope/manrope-cyrillic-200-normal.woff2') format('woff2'),
url('/fonts/manrope/manrope-cyrillic-200-normal.woff') format('woff');
src: url('../assets/fonts/manrope/manrope-cyrillic-200-normal.woff2') format('woff2'),
url('../assets/fonts/manrope/manrope-cyrillic-200-normal.woff') format('woff');
font-weight: 200;
font-style: normal;
}
@@ -12,43 +12,43 @@
@font-face {
font-family: 'Manrope';
src: url('/fonts/manrope/manrope-cyrillic-300-normal.woff2') format('woff2'),
url('/fonts/manrope/manrope-cyrillic-300-normal.woff') format('woff');
src: url('../assets/fonts/manrope/manrope-cyrillic-300-normal.woff2') format('woff2'),
url('../assets/fonts/manrope/manrope-cyrillic-300-normal.woff') format('woff');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'Manrope';
src: url('/fonts/manrope/manrope-cyrillic-400-normal.woff2') format('woff2'),
url('/fonts/manrope/manrope-cyrillic-400-normal.woff') format('woff');
src: url('../assets/fonts/manrope/manrope-cyrillic-400-normal.woff2') format('woff2'),
url('../assets/fonts/manrope/manrope-cyrillic-400-normal.woff') format('woff');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Manrope';
src: url('/fonts/manrope/manrope-cyrillic-500-normal.woff2') format('woff2'),
url('/fonts/manrope/manrope-cyrillic-500-normal.woff') format('woff');
src: url('../assets/fonts/manrope/manrope-cyrillic-500-normal.woff2') format('woff2'),
url('../assets/fonts/manrope/manrope-cyrillic-500-normal.woff') format('woff');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'Manrope';
src: url('/fonts/manrope/manrope-cyrillic-600-normal.woff2') format('woff2'),
url('/fonts/manrope/manrope-cyrillic-600-normal.woff') format('woff');
src: url('../assets/fonts/manrope/manrope-cyrillic-600-normal.woff2') format('woff2'),
url('../assets/fonts/manrope/manrope-cyrillic-600-normal.woff') format('woff');
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: 'Manrope';
src: url('/fonts/manrope/manrope-cyrillic-700-normal.woff2') format('woff2'),
url('/fonts/manrope/manrope-cyrillic-700-normal.woff') format('woff');
src: url('../assets/fonts/manrope/manrope-cyrillic-700-normal.woff2') format('woff2'),
url('../assets/fonts/manrope/manrope-cyrillic-700-normal.woff') format('woff');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: 'Manrope';
src: url('/fonts/manrope/manrope-cyrillic-800-normal.woff2') format('woff2'),
url('/fonts/manrope/manrope-cyrillic-800-normal.woff') format('woff');
src: url('../assets/fonts/manrope/manrope-cyrillic-800-normal.woff2') format('woff2'),
url('../assets/fonts/manrope/manrope-cyrillic-800-normal.woff') format('woff');
font-weight: 800;
font-style: normal;
}
@@ -59,7 +59,7 @@
}
:root {
--primary: #6366F1;
--primary: #FA003F;
--secondary: #A78BFA;
--textColorLight: #FFFFFF;
--textColorGray: #222222;
src/app/page.tsx
+3 -40
View File
@@ -1,5 +1,5 @@
// ... existing imports ...
import Button from '../components/Button'; // Adjust the import path if necessary
import Navbar from '@/components/layout/navbar';
async function getData() {
// Simulate a delay to show server-side data fetching
@@ -11,45 +11,8 @@ export default async function Home() {
const data = await getData();
return (
<main className="flex min-h-screen flex-col items-center justify-between p-24 text-gray-300">
<div className="z-10 w-full max-w-5xl items-center justify-between font-mono text-sm lg:flex">
<p className="fixed left-0 top-0 flex w-full justify-center border-b border-gray-300 bg-gradient-to-b from-zinc-200 pb-6 pt-8 backdrop-blur-2xl dark:border-neutral-800 dark:bg-zinc-800/30 dark:from-inherit lg:static lg:w-auto lg:rounded-xl lg:border lg:bg-gray-200 lg:p-4 lg:dark:bg-zinc-800/30">
{data.message}
</p>
</div>
<div className="mt-8 flex gap-4">
<Button>Default Button</Button>
<Button disabled>Disabled Button</Button>
<Button loading>Loading Button</Button>
<Button endIcon={<span>→</span>}>Button with Icon</Button>
</div>
<div className="mt-8 flex flex-col gap-4">
<h3>Standard Buttons:</h3>
<div className="flex gap-4">
<Button>Default Button</Button>
<Button disabled>Disabled Button</Button>
<Button loading>Loading Button</Button>
<Button endIcon={<span>→</span>}>Button with Icon</Button>
</div>
<h3>Sized Buttons:</h3>
<div className="flex gap-4 items-center">
<Button size="small">Small Button</Button>
<Button size="medium">Medium Button</Button>
<Button size="large">Large Button</Button>
</div>
<h3>Icon Buttons:</h3>
<div className="flex gap-4 items-center">
<Button iconOnly endIcon={<span>←</span>} size="small" />
<Button iconOnly endIcon={<span>←</span>} size="medium" />
<Button iconOnly endIcon={<span>←</span>} size="large" />
<Button iconOnly endIcon={<span>←</span>} disabled size="medium" />
<Button iconOnly endIcon={<span>←</span>} loading size="medium" />
</div>
</div>
<main className=" container mx-auto">
<Navbar/>
</main>
);
}