feat: add AchievementTextBox and InnerPageBanner components with respective types
- Created AchievementTextBox component for displaying achievement titles. - Implemented InnerPageBanner component for inner page banners with image and title. - Added SectionTitle component for displaying section titles and descriptions. - Updated AboutTopInfo component to utilize new AchievementTextBox and SectionTitle components. - Defined TypeScript interfaces for props in each new component.
This commit is contained in:
@@ -1,17 +0,0 @@
|
||||
// ... existing imports ...
|
||||
|
||||
async function getData() {
|
||||
// Simulate a delay to show server-side data fetching
|
||||
await new Promise((resolve) => setTimeout(resolve, 1000));
|
||||
return { message: 'This data was fetched on the server!' };
|
||||
}
|
||||
|
||||
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-bg-primary">
|
||||
ssss
|
||||
</main>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,25 @@
|
||||
import images from '@/assets/images/images';
|
||||
import Header from '@/components/layout/header';
|
||||
import InnerPageBanner from '@/components/layout/innerPages/banner';
|
||||
import SectionTitle from '@/components/layout/sectionTitle';
|
||||
import AboutTopInfo from '@/components/pages/about/TopInfo';
|
||||
import { t } from '@/locales/translates';
|
||||
|
||||
async function getData() {
|
||||
await new Promise((resolve) => setTimeout(resolve, 1000));
|
||||
return { message: 'This data was fetched on the server!' };
|
||||
}
|
||||
|
||||
export default async function Home() {
|
||||
const data = await getData();
|
||||
|
||||
return (
|
||||
<main className="flex flex-col items-center justify-between">
|
||||
<InnerPageBanner
|
||||
title={t('pages_about_title') as string}
|
||||
imageSrc={images.aboutBanner.src}
|
||||
/>
|
||||
<AboutTopInfo />
|
||||
</main>
|
||||
);
|
||||
}
|
||||
+75
-23
@@ -1,56 +1,108 @@
|
||||
@import "tailwindcss";
|
||||
@import "tailwindcss/utilities";
|
||||
|
||||
/* manrope-200 - latin */
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
|
||||
font-family: 'Manrope';
|
||||
src: url('../assets/fonts/manrope/manrope-cyrillic-200-normal.woff2') format('woff2'),
|
||||
url('../assets/fonts/manrope/manrope-cyrillic-200-normal.woff') format('woff');
|
||||
font-style: normal;
|
||||
font-weight: 200;
|
||||
font-style: normal;
|
||||
src: url('../assets/fonts/manrope/manrope-v15-latin-200.eot');
|
||||
src: url('../assets/fonts/manrope/manrope-v15-latin-200.eot?#iefix') format('embedded-opentype'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-200.woff2') format('woff2'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-200.woff') format('woff'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-200.ttf') format('truetype'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-200.svg#Manrope') format('svg');
|
||||
}
|
||||
|
||||
|
||||
/* manrope-300 - latin */
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
|
||||
font-family: 'Manrope';
|
||||
src: url('../assets/fonts/manrope/manrope-cyrillic-300-normal.woff2') format('woff2'),
|
||||
url('../assets/fonts/manrope/manrope-cyrillic-300-normal.woff') format('woff');
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
font-style: normal;
|
||||
src: url('../assets/fonts/manrope/manrope-v15-latin-300.eot');
|
||||
src: url('../assets/fonts/manrope/manrope-v15-latin-300.eot?#iefix') format('embedded-opentype'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-300.woff2') format('woff2'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-300.woff') format('woff'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-300.ttf') format('truetype'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-300.svg#Manrope') format('svg');
|
||||
}
|
||||
|
||||
/* manrope-regular - latin */
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
|
||||
font-family: 'Manrope';
|
||||
src: url('../assets/fonts/manrope/manrope-cyrillic-400-normal.woff2') format('woff2'),
|
||||
url('../assets/fonts/manrope/manrope-cyrillic-400-normal.woff') format('woff');
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
src: url('../assets/fonts/manrope/manrope-v15-latin-regular.eot');
|
||||
src: url('../assets/fonts/manrope/manrope-v15-latin-regular.eot?#iefix') format('embedded-opentype'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-regular.woff2') format('woff2'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-regular.woff') format('woff'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-regular.ttf') format('truetype'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-regular.svg#Manrope') format('svg');
|
||||
}
|
||||
|
||||
/* manrope-500 - latin */
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
|
||||
font-family: 'Manrope';
|
||||
src: url('../assets/fonts/manrope/manrope-cyrillic-500-normal.woff2') format('woff2'),
|
||||
url('../assets/fonts/manrope/manrope-cyrillic-500-normal.woff') format('woff');
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-style: normal;
|
||||
src: url('../assets/fonts/manrope/manrope-v15-latin-500.eot');
|
||||
src: url('../assets/fonts/manrope/manrope-v15-latin-500.eot?#iefix') format('embedded-opentype'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-500.woff2') format('woff2'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-500.woff') format('woff'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-500.ttf') format('truetype'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-500.svg#Manrope') format('svg');
|
||||
}
|
||||
|
||||
/* manrope-600 - latin */
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
|
||||
font-family: 'Manrope';
|
||||
src: url('../assets/fonts/manrope/manrope-cyrillic-600-normal.woff2') format('woff2'),
|
||||
url('../assets/fonts/manrope/manrope-cyrillic-600-normal.woff') format('woff');
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
src: url('../assets/fonts/manrope/manrope-v15-latin-600.eot');
|
||||
src: url('../assets/fonts/manrope/manrope-v15-latin-600.eot?#iefix') format('embedded-opentype'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-600.woff2') format('woff2'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-600.woff') format('woff'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-600.ttf') format('truetype'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-600.svg#Manrope') format('svg');
|
||||
}
|
||||
|
||||
/* manrope-700 - latin */
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
|
||||
font-family: 'Manrope';
|
||||
src: url('../assets/fonts/manrope/manrope-cyrillic-700-normal.woff2') format('woff2'),
|
||||
url('../assets/fonts/manrope/manrope-cyrillic-700-normal.woff') format('woff');
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
src: url('../assets/fonts/manrope/manrope-v15-latin-700.eot');
|
||||
src: url('../assets/fonts/manrope/manrope-v15-latin-700.eot?#iefix') format('embedded-opentype'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-700.woff2') format('woff2'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-700.woff') format('woff'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-700.ttf') format('truetype'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-700.svg#Manrope') format('svg');
|
||||
}
|
||||
|
||||
/* manrope-800 - latin */
|
||||
@font-face {
|
||||
font-display: swap;
|
||||
|
||||
font-family: 'Manrope';
|
||||
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;
|
||||
font-weight: 800;
|
||||
src: url('../assets/fonts/manrope/manrope-v15-latin-800.eot');
|
||||
src: url('../assets/fonts/manrope/manrope-v15-latin-800.eot?#iefix') format('embedded-opentype'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-800.woff2') format('woff2'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-800.woff') format('woff'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-800.ttf') format('truetype'),
|
||||
url('../assets/fonts/manrope/manrope-v15-latin-800.svg#Manrope') format('svg');
|
||||
}
|
||||
|
||||
* {
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
// ... existing imports ...
|
||||
import Header from '@/components/layout/header';
|
||||
|
||||
async function getData() {
|
||||
|
||||
@@ -1,17 +0,0 @@
|
||||
// ... existing imports ...
|
||||
|
||||
async function getData() {
|
||||
// Simulate a delay to show server-side data fetching
|
||||
await new Promise((resolve) => setTimeout(resolve, 1000));
|
||||
return { message: 'This data was fetched on the server!' };
|
||||
}
|
||||
|
||||
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">
|
||||
ssss
|
||||
</main>
|
||||
);
|
||||
}
|
||||
@@ -1,17 +0,0 @@
|
||||
// ... existing imports ...
|
||||
|
||||
async function getData() {
|
||||
// Simulate a delay to show server-side data fetching
|
||||
await new Promise((resolve) => setTimeout(resolve, 1000));
|
||||
return { message: 'This data was fetched on the server!' };
|
||||
}
|
||||
|
||||
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">
|
||||
ssss
|
||||
</main>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user