Main Navigation
+
+
+
+
+
+
+
+ Welcome to the world of learning
+ Welcome to the corner of learning
diff --git a/src/pages/dashboard.astro b/src/pages/dashboard.astro
new file mode 100644
index 00000000..583c82d8
--- /dev/null
+++ b/src/pages/dashboard.astro
@@ -0,0 +1,37 @@
+---
+import "@/assets/styles/dashboard.css";
+import Header from "@/layouts/common/Header";
+---
+
+
+
+ Dashboard
+
+
+
+
+
+
+
+
+
+
diff --git a/src/pages/forgot-password.astro b/src/pages/forgot-password.astro
new file mode 100644
index 00000000..09157ccc
--- /dev/null
+++ b/src/pages/forgot-password.astro
@@ -0,0 +1,68 @@
+---
+import "@/assets/styles/signup.css";
+import SunIcon from "@/assets/icons/sun.svg";
+import MoonIcon from "@/assets/icons/moon.svg";
+import Base from "@/layouts/Base";
+---
+
+
+
+
+
diff --git a/src/pages/signup.astro b/src/pages/signup.astro
new file mode 100644
index 00000000..668b9be2
--- /dev/null
+++ b/src/pages/signup.astro
@@ -0,0 +1,236 @@
+---
+import "@/assets/styles/signup.css";
+import GoogleIcon from "@/assets/icons/google.svg";
+import EyeIcon from "@/assets/icons/eye.svg";
+import XIcon from "@/assets/icons/x.svg";
+import SunIcon from "@/assets/icons/sun.svg";
+import MoonIcon from "@/assets/icons/moon.svg";
+import Base from "@/layouts/Base";
+
+const slideImages = [
+ { dark: "/assets/images/screenshots/dark/capital.PNG", light: "/assets/images/screenshots/light/capitalLight.png" },
+ { dark: "/assets/images/screenshots/dark/colors.PNG", light: "/assets/images/screenshots/light/colorsLight.png" },
+ { dark: "/assets/images/screenshots/dark/quote.PNG", light: "/assets/images/screenshots/light/quoteLight.png" },
+ { dark: "/assets/images/screenshots/dark/story.png", light: "/assets/images/screenshots/light/storyLight.png" },
+ { dark: "/assets/images/screenshots/dark/map.png", light: "/assets/images/screenshots/light/mapLight.png" },
+ { dark: "/assets/images/screenshots/dark/varnmala.png", light: "/assets/images/screenshots/light/varnmalaLight.png" }
+];
+---
+
+
+
+ {
+ sortBy(key: K): T[];
+ }
+}
+
export type { LetterEntity } from "./alphabet";
export type { BlogCardProps, BlogMeta, BlogPost } from "./blog";
export type { LinkProps } from "./link";
diff --git a/src/utils/common.ts b/src/utils/common.ts
index 2ae099da..286b27a2 100644
--- a/src/utils/common.ts
+++ b/src/utils/common.ts
@@ -52,3 +52,17 @@ export const getInitials = (name: string): string => {
return initials;
};
+
+/* sort an array of object based on its key */
+Array.prototype.sortBy = function (this: T[], key: K): T[] {
+ return this.slice().sort((a, b) => {
+ const valA = a[key];
+ const valB = b[key];
+
+ if (valA < valB) return -1;
+ if (valA > valB) return 1;
+ return 0;
+ });
+};
+
+export const capitalizeThis = (text: string) => text?.charAt(0).toUpperCase() + text?.slice(1);
diff --git a/src/utils/constants.ts b/src/utils/constants.ts
index 81f636a0..ae258dd0 100644
--- a/src/utils/constants.ts
+++ b/src/utils/constants.ts
@@ -211,6 +211,12 @@ export const NavbarLinks: LinkProps[] = [
title: "Stories",
path: "/stories",
isActive: true
+ },
+ {
+ name: "Poems",
+ title: "Poems",
+ path: "/poems",
+ isActive: true
}
];
+
+ Hello there!
++ This is your personal dashboard. From here you can manage your account, view your activity, and much more. +
+ +
+
+
+
+
diff --git a/src/pages/login.astro b/src/pages/login.astro
new file mode 100644
index 00000000..c8057787
--- /dev/null
+++ b/src/pages/login.astro
@@ -0,0 +1,206 @@
+---
+import "@/assets/styles/signup.css";
+import GoogleIcon from "@/assets/icons/google.svg";
+import EyeIcon from "@/assets/icons/eye.svg";
+import XIcon from "@/assets/icons/x.svg";
+import SunIcon from "@/assets/icons/sun.svg";
+import MoonIcon from "@/assets/icons/moon.svg";
+import Base from "@/layouts/Base";
+
+const slideImages = [
+ { dark: "/assets/images/screenshots/dark/capital.png", light: "/assets/images/screenshots/light/capitalLight.png" },
+ { dark: "/assets/images/screenshots/dark/colors.png", light: "/assets/images/screenshots/light/colorsLight.png" },
+ { dark: "/assets/images/screenshots/dark/quote.png", light: "/assets/images/screenshots/light/quoteLight.png" },
+ { dark: "/assets/images/screenshots/dark/story.png", light: "/assets/images/screenshots/light/storyLight.png" },
+ { dark: "/assets/images/screenshots/dark/map.png", light: "/assets/images/screenshots/light/mapLight.png" },
+ { dark: "/assets/images/screenshots/dark/varnmala.png", light: "/assets/images/screenshots/light/varnmalaLight.png" }
+];
+---
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/src/pages/poems.astro b/src/pages/poems.astro
new file mode 100644
index 00000000..c206307d
--- /dev/null
+++ b/src/pages/poems.astro
@@ -0,0 +1,40 @@
+---
+import "@/assets/styles/poems.css";
+import BackIcon from "@/components/Back.astro";
+import Help from "@/components/Help.astro";
+import PoemCard from "@/components/PoemCard.astro";
+import PoemDialog from "@/components/PoemDialog.astro";
+import SharePopover from "@/components/ShareButton.astro";
+import SquareBubble from "@/components/SquareBubble.astro";
+import poem from "@/data/poem.json";
+import BaseLayout from "@/layouts/Base";
+import "@/utils/common"; /* for sortBy method */
+const { poems } = poem;
+poems.sortBy("title");
+const title = "Poems";
+---
+
+
+
+
+
+
+
+
+
+ {
+ slideImages.map((image, index) => (
+
+
+
+
+ ![{`Image]()
+
+
+ ))
+ }
+
+
+
+
+
+ Welcome back!
+Don't have an account? Sign up
+ + +
+
+
+
+
+
+ Welcome to Poem World!
+ Hello, little reader!
+
+
+
+ {poems.map((poem) =>
+
+
+
+
+
diff --git a/src/pages/varnmala/hindi.astro b/src/pages/varnmala/hindi.astro
index 6accdd55..08261480 100644
--- a/src/pages/varnmala/hindi.astro
+++ b/src/pages/varnmala/hindi.astro
@@ -2,9 +2,9 @@
import AlphabetComponent from "@/components/Alphabet.astro";
import BackButton from "@/components/BackButton.astro";
import Help from "@/components/Help.astro";
+import SharePopover from "@/components/ShareButton.astro";
import BaseLayout from "@/layouts/Base";
import { hindiVowelList, varnmala_hindi } from "@/utils/characters";
-import SharePopover from "@/components/ShareButton.astro";
// Vowels to be excluded
const vowelsToRemove = ["เค", "เค", "เค"];
@@ -24,7 +24,7 @@ const formattedVowelList = hindiVowelList
+
+
+
+
+
+
+
+ {
+ slideImages.map((image, index) => (
+
+
+
+
+ ![{`Image]()
+
+
+ ))
+ }
+
+
+
+
+
+ Create an account
+Already have an account? Log in
+ + +