bender/9fab83d1-eece-4d67-bbba-a0ce06953f79
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_1 into main

Browse Source 
Merge version_1 into main
This commit was merged in pull request #2.
This commit is contained in:
bender
2026-03-11 14:25:32 +00:00
parent 5f2c6bc87e 34dfd2bb6e
commit 2fb9b151ce
2 changed files with 87 additions and 151 deletions
Download Patch File Download Diff File Expand all files Collapse all files

158
src/app/page.tsx
View File

@@ -24,8 +24,7 @@ export default function HomePage() {
const footerColumns = [
{
title: "Navigation",
items: [
title: "Navigation", items: [
{ label: "Home", href: "/" },
{ label: "Dashboard", href: "/dashboard" },
{ label: "E-Learning", href: "/elearning" },
@@ -33,8 +32,7 @@ export default function HomePage() {
],
},
{
title: "Resources",
items: [
title: "Resources", items: [
{ label: "Study Materials", href: "/elearning" },
{ label: "Career Guidance", href: "/elearning" },
{ label: "Student Portal", href: "/dashboard" },
@@ -42,8 +40,7 @@ export default function HomePage() {
],
},
{
title: "About",
items: [
title: "About", items: [
{ label: "Our School", href: "/about" },
{ label: "Mission & Values", href: "/about" },
{ label: "Faculty", href: "/about" },
@@ -51,8 +48,7 @@ export default function HomePage() {
],
},
{
title: "Legal",
items: [
title: "Legal", items: [
{ label: "Privacy Policy", href: "#" },
{ label: "Terms of Service", href: "#" },
{ label: "Accessibility", href: "#" },
@@ -68,7 +64,7 @@ export default function HomePage() {
borderRadius="rounded"
contentWidth="small"
sizing="largeSmallSizeLargeTitles"
background="floatingGradient"
background="circleGradient"
cardStyle="inset"
primaryButtonStyle="double-inset"
secondaryButtonStyle="layered"
@@ -84,33 +80,23 @@ export default function HomePage() {
description="Your digital hub for academic excellence, student achievement tracking, and seamless school management. Access resources, track progress, and stay connected with our community."
tag="Digital Learning Hub"
tagIcon={BookOpen}
background={{ variant: "floatingGradient" }}
background={{ variant: "plain" }}
mediaItems={[
{
imageSrc:
"http://img.b2bpic.net/free-photo/young-diverse-students-discussing-ideas_23-2147655871.jpg",
imageAlt: "students collaborative learning group study",
},
"http://img.b2bpic.net/free-photo/young-diverse-students-discussing-ideas_23-2147655871.jpg", imageAlt: "students collaborative learning group study"},
{
imageSrc:
"http://img.b2bpic.net/free-photo/businesswoman-with-business-team_23-2147710239.jpg",
imageAlt: "modern school building exterior architecture",
},
"http://img.b2bpic.net/free-photo/businesswoman-with-business-team_23-2147710239.jpg", imageAlt: "modern school building exterior architecture"},
{
imageSrc:
"http://img.b2bpic.net/free-photo/group-friends-planning-trip-cafe_23-2148952343.jpg",
imageAlt: "interactive classroom with technology students",
},
"http://img.b2bpic.net/free-photo/group-friends-planning-trip-cafe_23-2148952343.jpg", imageAlt: "interactive classroom with technology students"},
{
imageSrc:
"http://img.b2bpic.net/free-photo/young-female-showing-winner-gesture-graduate-uniform-looking-lucky_176474-82410.jpg",
imageAlt: "students celebrating academic achievement success",
},
"http://img.b2bpic.net/free-photo/young-female-showing-winner-gesture-graduate-uniform-looking-lucky_176474-82410.jpg", imageAlt: "students celebrating academic achievement success"},
{
imageSrc:
"http://img.b2bpic.net/free-photo/girl-playing-tablet-game-evening_23-2147833833.jpg",
imageAlt: "students using digital learning platform tablet",
},
"http://img.b2bpic.net/free-photo/girl-playing-tablet-game-evening_23-2147833833.jpg", imageAlt: "students using digital learning platform tablet"},
]}
buttons={[
{ text: "Access Dashboard", href: "/dashboard" },
@@ -124,7 +110,7 @@ export default function HomePage() {
title="About Al-Imam Malik Secondary School"
description="For over two decades, Al-Imam Malik Secondary School has been committed to nurturing excellence in academics, character development, and holistic student growth. Our innovative digital portal bridges the gap between traditional education and modern technology."
tag="Our Mission"
imageSrc="http://img.b2bpic.net/free-photo/colleagues-doing-team-work-project_23-2149361611.jpg?_wi=1"
imageSrc="http://img.b2bpic.net/free-photo/colleagues-doing-team-work-project_23-2149361611.jpg"
imageAlt="school mission vision values illustration"
buttons={[{ text: "Learn Our Story", href: "/about" }]}
useInvertedBackground={false}
@@ -138,53 +124,25 @@ export default function HomePage() {
tag="Platform Capabilities"
features={[
{
id: "1",
title: "Student Achievement Dashboard",
descriptions: [
"Gamified XP-based ranking system that motivates students to excel",
"Real-time progress tracking with visual performance metrics",
"Honor roll recognition for top performers across all subjects",
],
id: "1", title: "Student Achievement Dashboard", descriptions: [
"Gamified XP-based ranking system that motivates students to excel", "Real-time progress tracking with visual performance metrics", "Honor roll recognition for top performers across all subjects"],
imageSrc:
"http://img.b2bpic.net/free-vector/colorful-infographic-elements-with-gradient-effect_23-2148160032.jpg?_wi=1",
imageAlt: "student achievement dashboard interface display",
},
"http://img.b2bpic.net/free-vector/colorful-infographic-elements-with-gradient-effect_23-2148160032.jpg", imageAlt: "student achievement dashboard interface display"},
{
id: "2",
title: "E-Learning Resource Hub",
descriptions: [
"Centralized repository for academic materials and study guides",
"IT career guidance and professional development resources",
"Organized by subject, grade level, and learning objectives",
],
id: "2", title: "E-Learning Resource Hub", descriptions: [
"Centralized repository for academic materials and study guides", "IT career guidance and professional development resources", "Organized by subject, grade level, and learning objectives"],
imageSrc:
"http://img.b2bpic.net/free-photo/trading-manager-working-with-stock-market-diagrams-looking-real-time-stattistics-trend-with-forex-exchange-profit-rate-analyzing-hedge-fund-index-global-money-investment-laptop_482257-50292.jpg?_wi=1",
imageAlt: "e-learning resource hub platform interface",
},
"http://img.b2bpic.net/free-photo/trading-manager-working-with-stock-market-diagrams-looking-real-time-stattistics-trend-with-forex-exchange-profit-rate-analyzing-hedge-fund-index-global-money-investment-laptop_482257-50292.jpg", imageAlt: "e-learning resource hub platform interface"},
{
id: "3",
title: "Real-Time Notifications",
descriptions: [
"Instant daily announcements for school-wide updates",
"Automated event calendar with integrated reminders",
"Customizable notification preferences for students and parents",
],
id: "3", title: "Real-Time Notifications", descriptions: [
"Instant daily announcements for school-wide updates", "Automated event calendar with integrated reminders", "Customizable notification preferences for students and parents"],
imageSrc:
"http://img.b2bpic.net/free-photo/side-view-business-people-sitting-bench-with-laptop_23-2147707513.jpg?_wi=1",
imageAlt: "real-time notification system interface design",
},
"http://img.b2bpic.net/free-photo/side-view-business-people-sitting-bench-with-laptop_23-2147707513.jpg", imageAlt: "real-time notification system interface design"},
{
id: "4",
title: "Bilingual Support",
descriptions: [
"Full Arabic and English localization for all content",
"Seamless language switching across all sections",
"Culturally relevant interface design for diverse learners",
],
id: "4", title: "Bilingual Support", descriptions: [
"Full Arabic and English localization for all content", "Seamless language switching across all sections", "Culturally relevant interface design for diverse learners"],
imageSrc:
"http://img.b2bpic.net/free-vector/flat-international-mother-language-day-landing-page-template_23-2149250150.jpg?_wi=1",
imageAlt: "bilingual interface Arabic English language switching",
},
"http://img.b2bpic.net/free-vector/flat-international-mother-language-day-landing-page-template_23-2149250150.jpg", imageAlt: "bilingual interface Arabic English language switching"},
]}
gridVariant="four-items-2x2-equal-grid"
animationType="slide-up"
@@ -218,29 +176,17 @@ export default function HomePage() {
author="Fatima Al-Mansouri, Parent"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/surprised-daughter-looking-her-mother_23-2148334868.jpg",
alt: "parent happy portrait smiling professional",
},
src: "http://img.b2bpic.net/free-photo/surprised-daughter-looking-her-mother_23-2148334868.jpg", alt: "parent happy portrait smiling professional"},
{
src: "http://img.b2bpic.net/free-photo/closeup-handsome-confident-middleaged-man-gray-sweater-showing-thumbsup-approval-recommendi_1258-129203.jpg",
alt: "parent satisfied testimonial person avatar",
},
src: "http://img.b2bpic.net/free-photo/closeup-handsome-confident-middleaged-man-gray-sweater-showing-thumbsup-approval-recommendi_1258-129203.jpg", alt: "parent satisfied testimonial person avatar"},
{
src: "http://img.b2bpic.net/free-photo/woman-tourist-holds-textbook-planner-spends-vacations-visiting-unknown-city_273609-55598.jpg",
alt: "young student happy portrait smiling",
},
src: "http://img.b2bpic.net/free-photo/woman-tourist-holds-textbook-planner-spends-vacations-visiting-unknown-city_273609-55598.jpg", alt: "young student happy portrait smiling"},
{
src: "http://img.b2bpic.net/free-photo/young-beautiful-hispanic-woman-standing-with-arms-crossed-gesture-street_839833-27487.jpg",
alt: "student testimonial person portrait smiling",
},
src: "http://img.b2bpic.net/free-photo/young-beautiful-hispanic-woman-standing-with-arms-crossed-gesture-street_839833-27487.jpg", alt: "student testimonial person portrait smiling"},
{
src: "http://img.b2bpic.net/free-photo/happy-beautiful-young-woman-standing-posing-co-working-coffee-shop-interior-looking-camera-smiling_74855-9955.jpg",
alt: "teacher professional portrait educator person",
},
src: "http://img.b2bpic.net/free-photo/happy-beautiful-young-woman-standing-posing-co-working-coffee-shop-interior-looking-camera-smiling_74855-9955.jpg", alt: "teacher professional portrait educator person"},
{
src: "http://img.b2bpic.net/free-photo/vertical-shot-white-female-smiling-front-festive-cheerful_181624-7962.jpg",
alt: "community member person testimonial avatar",
},
src: "http://img.b2bpic.net/free-photo/vertical-shot-white-female-smiling-front-festive-cheerful_181624-7962.jpg", alt: "community member person testimonial avatar"},
]}
ratingAnimation="slide-up"
avatarsAnimation="slide-up"
@@ -255,43 +201,25 @@ export default function HomePage() {
tag="Help & Support"
faqs={[
{
id: "1",
title: "How do I access my achievement dashboard?",
content:
"Log in to your account using your student credentials. Your personalized dashboard is available immediately upon login. You can view your XP points, rank, and progress across all subjects.",
},
id: "1", title: "How do I access my achievement dashboard?", content:
"Log in to your account using your student credentials. Your personalized dashboard is available immediately upon login. You can view your XP points, rank, and progress across all subjects."},
{
id: "2",
title: "Where can I find study resources?",
content:
"Navigate to the E-Learning Hub section from the main menu. Resources are organized by subject and grade level. You can download materials, access video tutorials, and explore IT career guidance resources.",
},
id: "2", title: "Where can I find study resources?", content:
"Navigate to the E-Learning Hub section from the main menu. Resources are organized by subject and grade level. You can download materials, access video tutorials, and explore IT career guidance resources."},
{
id: "3",
title: "How do I receive notifications?",
content:
"By default, you receive all important announcements. You can customize your notification preferences in your account settings to choose which types of updates you want to receive.",
},
id: "3", title: "How do I receive notifications?", content:
"By default, you receive all important announcements. You can customize your notification preferences in your account settings to choose which types of updates you want to receive."},
{
id: "4",
title: "Is the portal available in Arabic?",
content:
"Yes! The entire portal is fully localized in both Arabic and English. Simply click the language toggle in the navigation bar to switch between languages.",
},
id: "4", title: "Is the portal available in Arabic?", content:
"Yes! The entire portal is fully localized in both Arabic and English. Simply click the language toggle in the navigation bar to switch between languages."},
{
id: "5",
title: "Can parents access the student portal?",
content:
"Yes, parents can create a linked account to monitor their child's progress, view achievement metrics, and receive school notifications. Contact the administration for parent account setup.",
},
id: "5", title: "Can parents access the student portal?", content:
"Yes, parents can create a linked account to monitor their child's progress, view achievement metrics, and receive school notifications. Contact the administration for parent account setup."},
{
id: "6",
title: "What devices can I use?",
content:
"The portal is fully responsive and optimized for desktop, tablet, and mobile devices. Access it from any modern web browser for the best experience.",
},
id: "6", title: "What devices can I use?", content:
"The portal is fully responsive and optimized for desktop, tablet, and mobile devices. Access it from any modern web browser for the best experience."},
]}
imageSrc="http://img.b2bpic.net/free-photo/thoughtful-young-woman-with-question-mark_1134-622.jpg?_wi=1"
imageSrc="http://img.b2bpic.net/free-photo/thoughtful-young-woman-with-question-mark_1134-622.jpg"
imageAlt="customer support help illustration person"
mediaPosition="left"
mediaAnimation="slide-up"

80
src/components/shared/SvgTextLogo/SvgTextLogo.tsx
View File

@@ -1,51 +1,59 @@
"use client";
import { memo } from "react";
import useSvgTextLogo from "./useSvgTextLogo";
import { cls } from "@/lib/utils";
import React, { useMemo } from "react";
interface SvgTextLogoProps {
logoText: string;
adjustHeightFactor?: number;
verticalAlign?: "top" | "center";
text: string;
fontSize?: number;
fontFamily?: string;
fontWeight?: string | number;
fill?: string;
className?: string;
}
const SvgTextLogo = memo<SvgTextLogoProps>(function SvgTextLogo({
logoText,
adjustHeightFactor,
verticalAlign = "top",
className = "",
}) {
const { svgRef, textRef, viewBox, aspectRatio } = useSvgTextLogo(logoText, false, adjustHeightFactor);
const SvgTextLogo: React.FC<SvgTextLogoProps> = ({
text,
fontSize = 24,
fontFamily = "Arial", fontWeight = "bold", fill = "currentColor", className = ""}) => {
const textMetrics = useMemo(() => {
const canvas = typeof document !== "undefined" ? document.createElement("canvas") : null;
if (!canvas) return { width: text.length * fontSize * 0.5, height: fontSize };
const ctx = canvas.getContext("2d");
if (!ctx) return { width: text.length * fontSize * 0.5, height: fontSize };
ctx.font = `${fontWeight} ${fontSize}px ${fontFamily}`;
const metrics = ctx.measureText(text);
return {
width: metrics.width,
height: fontSize,
};
}, [text, fontSize, fontFamily, fontWeight]);
const padding = 8;
const svgWidth = textMetrics.width + padding * 2;
const svgHeight = textMetrics.height + padding * 2;
return (
<svg
ref={svgRef}
viewBox={viewBox}
className={cls("w-full", className)}
style={{ aspectRatio: aspectRatio }}
preserveAspectRatio="none"
role="img"
aria-label={`${logoText} logo`}
width={svgWidth}
height={svgHeight}
viewBox={`0 0 ${svgWidth} ${svgHeight}`}
xmlns="http://www.w3.org/2000/svg"
className={className}
>
<text
ref={textRef}
x="0"
y={verticalAlign === "center" ? "50%" : "0"}
className="font-bold fill-current"
style={{
fontSize: "20px",
letterSpacing: "-0.02em",
dominantBaseline: verticalAlign === "center" ? "middle" : "text-before-edge"
}}
x={padding}
y={padding + fontSize * 0.75}
fontSize={fontSize}
fontFamily={fontFamily}
fontWeight={fontWeight}
fill={fill}
dominantBaseline="middle"
>
{logoText}
{text}
</text>
</svg>
);
});
};
SvgTextLogo.displayName = "SvgTextLogo";
export default SvgTextLogo;
export default SvgTextLogo;