diff --git a/src/app/ar/history/page.tsx b/src/app/ar/history/page.tsx
index 3c80ec4..e0e671f 100644
--- a/src/app/ar/history/page.tsx
+++ b/src/app/ar/history/page.tsx
@@ -1,6 +1,7 @@
import About from "@/templates/About";
import ComingSoon from "@/templates/ComingSoon";
+import History from "@/templates/History";
export default function Page() {
- return ;
+ return ;
}
diff --git a/src/app/history/page.tsx b/src/app/history/page.tsx
index 5962c09..005b7b1 100644
--- a/src/app/history/page.tsx
+++ b/src/app/history/page.tsx
@@ -1,6 +1,7 @@
import About from "@/templates/About";
import ComingSoon from "@/templates/ComingSoon";
+import History from "@/templates/History";
export default function Page() {
- return ;
+ return ;
}
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index a088e07..0553799 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,52 +1,39 @@
/* eslint-disable @next/next/no-page-custom-font */
import clsx from "clsx";
import "./globals.css";
-import type { Metadata } from "next";
-import { Inter } from "next/font/google";
-import { Almarai } from "next/font/google";
+import type {Metadata} from "next";
+import {Inter} from "next/font/google";
+import {Almarai} from "next/font/google";
const almarai = Almarai({
- subsets: ["arabic"],
- weight: ["300", "400", "700", "800"],
+ subsets: ["arabic"],
+ weight: ["300", "400", "700", "800"],
});
-const inter = Inter({ subsets: ["latin"] });
+const inter = Inter({subsets: ["latin"]});
export const metadata: Metadata = {
- title: "EnCoach",
- description: "We are the best service and the only one",
+ title: "EnCoach",
+ description: "We are the best service and the only one",
};
-export default function RootLayout({
- children,
-}: {
- children: React.ReactNode;
-}) {
- return (
-
-
-
-
+export default function RootLayout({children}: {children: React.ReactNode}) {
+ return (
+
+
+
+
-
+
-
-
-
-
-
- {children}
-
-
- );
+
+
+
+
+ {children}
+
+ );
}
diff --git a/src/templates/History.tsx b/src/templates/History.tsx
new file mode 100644
index 0000000..8e1341c
--- /dev/null
+++ b/src/templates/History.tsx
@@ -0,0 +1,89 @@
+/* eslint-disable @next/next/no-img-element */
+import Footer from "@/components/Footer";
+import Navbar from "@/components/Navbar";
+import Title from "@/components/Title";
+import translation from "@/translation/history.json";
+import clsx from "clsx";
+import React from "react";
+import * as BsIcon from "react-icons/bs";
+import {IconType} from "react-icons";
+
+interface Props {
+ language: "en" | "ar";
+}
+
+interface ElementProps {
+ date: string;
+ Icon: IconType;
+ label: string;
+ language: "ar" | "en";
+ isEven?: boolean;
+}
+
+const Element = ({date, label, isEven, language, Icon}: ElementProps) => {
+ return (
+ <>
+
+
+ {label}
+
+
+
+
+
{date}
+
+
+
+ >
+ );
+};
+
+export default function History({language}: Props) {
+ return (
+
+
+
+
+
+
{translation.title[language]}
+
+
+
+
+
+
+ {translation.events.map((event, index) => (
+
+ ))}
+
+
+
+
+
+
+
+ );
+}
diff --git a/src/translation/history.json b/src/translation/history.json
new file mode 100644
index 0000000..e07d579
--- /dev/null
+++ b/src/translation/history.json
@@ -0,0 +1,151 @@
+{
+ "title": {
+ "en": "History",
+ "ar": "تاريخنا"
+ },
+ "events": [
+ {
+ "label": {
+ "en": "Idea conception",
+ "ar": "نشأة الفكرة"
+ },
+ "date": {
+ "en": "December 2021",
+ "ar": "ديسمبر 2021"
+ },
+ "icon": "BsLightbulbFill"
+ },
+ {
+ "label": {
+ "en": "Feasibility study and research",
+ "ar": "دراسة الجدوى والبحث"
+ },
+ "date": {
+ "en": "January 2022",
+ "ar": "يناير 2022"
+ },
+ "icon": "BsBook"
+ },
+ {
+ "label": {
+ "en": "Developer selection process",
+ "ar": "عملية اختيار المطورين"
+ },
+ "date": {
+ "en": "October 2022",
+ "ar": "أكتوبر 2022"
+ },
+ "icon": "BsCode"
+ },
+ {
+ "label": {
+ "en": "Developers identified and onboarded",
+ "ar": "تم تحديد المطورين واختيارهم"
+ },
+ "date": {
+ "en": "January 2023",
+ "ar": "يناير 2023"
+ },
+ "icon": "BsPeopleFill"
+ },
+ {
+ "label": {
+ "en": "Prototype development",
+ "ar": "تطوير النموذج الأولي"
+ },
+ "date": {
+ "en": "February 2023",
+ "ar": "فبراير 2023"
+ },
+ "icon": "BsCodeSlash"
+ },
+ {
+ "label": {
+ "en": "Design and user interface refinement",
+ "ar": "تصميم وتحسين واجهة المستخدم"
+ },
+ "date": {
+ "en": "April 2023",
+ "ar": "أبريل 2023"
+ },
+ "icon": "BsLayoutWtf"
+ },
+ {
+ "label": {
+ "en": "Backend development and integration",
+ "ar": "تطوير ودمج الجانب الخلفي للمنصة"
+ },
+ "date": {
+ "en": "August 2023",
+ "ar": "أغسطس 2023"
+ },
+ "icon": "BsDiscFill"
+ },
+ {
+ "label": {
+ "en": "Beta testing phase",
+ "ar": "مرحلة اختبار النسخة التجريبية (بيتا)"
+ },
+ "date": {
+ "en": "September 2023",
+ "ar": "سبتمبر 2023"
+ },
+ "icon": "BsClipboardDataFill"
+ },
+ {
+ "label": {
+ "en": "Soft launch of EnCoach platform",
+ "ar": "إطلاق تجريبي لمنصة إنكوتش"
+ },
+ "date": {
+ "en": "October 2023",
+ "ar": "أكتوبر 2023"
+ },
+ "icon": "BsCheckLg"
+ },
+ {
+ "label": {
+ "en": "User testing and feedback collection",
+ "ar": "اختبار المستخدمين وجمع الملاحظات والرواجع"
+ },
+ "date": {
+ "en": "November 2023",
+ "ar": "نوفمبر 2023"
+ },
+ "icon": "BsClipboardDataFill"
+ },
+ {
+ "label": {
+ "en": "Security and privacy assessment",
+ "ar": "تقييم الأمان والخصوصية"
+ },
+ "date": {
+ "en": "November 2023",
+ "ar": "نوفمبر 2023"
+ },
+ "icon": "BsShieldFill"
+ },
+ {
+ "label": {
+ "en": "Official launch of EnCoach platform",
+ "ar": "الإطلاق الرسمي لمنصة إنكوتش"
+ },
+ "date": {
+ "en": "December 2023",
+ "ar": "ديسمبر 2023"
+ },
+ "icon": "BsCheck2All"
+ },
+ {
+ "label": {
+ "en": "User onboarding",
+ "ar": "البدء في تسجيل المستخدمين"
+ },
+ "date": {
+ "en": "December 2023",
+ "ar": "ديسمبر 2023"
+ },
+ "icon": "BsPersonFillAdd"
+ }
+ ]
+}
\ No newline at end of file
diff --git a/tailwind.config.ts b/tailwind.config.ts
index 235bef7..9596b6d 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -48,9 +48,23 @@ const config: Config = {
"18": "4.5rem",
"30": "7.5rem",
"1/6": "16%",
+ "2/6": "32%",
+ "3/6": "48%",
+ "4/6": "64%",
+ "5/6": "80%",
"1/8": "12%",
"1/10": "10%",
"1/12": "8%",
+ "2/12": "16%",
+ "3/12": "24%",
+ "4/12": "32%",
+ "5/12": "40%",
+ "6/12": "48%",
+ "7/12": "56%",
+ "8/12": "64%",
+ "9/12": "72%",
+ "10/12": "80%",
+ "11/12": "88%",
},
screens: {
"-sm": {max: "639px"},