🎨 Fix UI transparency and color coordination issues
- Fix navigation transparency with proper backdrop blur and contrast - Change currency from USD to OMR for Omani market - Add video section to landing page with proper looping - Improve hero section readability with better contrast - Fix navigation positioning in layout.tsx - Enhance color coordination across all components - Add proper glass effect styling for modern UI
This commit is contained in:
Krikorios
@@ -11,7 +11,7 @@ export default function AdmissionsPage() {
|
||||
"SAT/ACT scores (optional for 2024)",
|
||||
"Personal statement",
|
||||
"Letters of recommendation",
|
||||
"Application fee: $50"
|
||||
"Application fee: OMR 20"
|
||||
]
|
||||
},
|
||||
{
|
||||
@@ -22,7 +22,7 @@ export default function AdmissionsPage() {
|
||||
"GRE/GMAT scores",
|
||||
"Research proposal",
|
||||
"Letters of recommendation (3)",
|
||||
"Application fee: $75"
|
||||
"Application fee: OMR 30"
|
||||
]
|
||||
},
|
||||
{
|
||||
@@ -33,7 +33,7 @@ export default function AdmissionsPage() {
|
||||
"Financial documentation",
|
||||
"Visa requirements",
|
||||
"Health insurance",
|
||||
"Application fee: $100"
|
||||
"Application fee: OMR 40"
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
@@ -3,6 +3,7 @@ import { Inter } from 'next/font/google';
|
||||
import './globals.css';
|
||||
import { ClientProviders } from '@/components/providers/ClientProviders';
|
||||
import { AIChatButton } from '@/components/Chat/AIChatButton';
|
||||
import { MainNavigation } from '@/components/Navigation/MainNavigation';
|
||||
|
||||
const inter = Inter({ subsets: ['latin'] });
|
||||
|
||||
@@ -20,6 +21,7 @@ export default function RootLayout({
|
||||
<html lang="en">
|
||||
<body className={inter.className}>
|
||||
<ClientProviders>
|
||||
<MainNavigation />
|
||||
{children}
|
||||
<AIChatButton />
|
||||
</ClientProviders>
|
||||
|
||||
+44
-42
@@ -3,43 +3,12 @@ import Link from 'next/link';
|
||||
export default function HomePage() {
|
||||
return (
|
||||
<div className="min-h-screen bg-white">
|
||||
{/* Navigation */}
|
||||
<nav className="bg-white shadow-lg">
|
||||
<div className="container mx-auto px-4">
|
||||
<div className="flex justify-between items-center h-16">
|
||||
<Link href="/" className="flex items-center space-x-3">
|
||||
<div className="w-10 h-10 bg-blue-600 rounded-lg flex items-center justify-center">
|
||||
<span className="text-white font-bold text-lg">U</span>
|
||||
</div>
|
||||
<div>
|
||||
<div className="text-xl font-bold text-gray-900">University Portal</div>
|
||||
<div className="text-xs text-gray-600">Excellence in Education</div>
|
||||
</div>
|
||||
</Link>
|
||||
|
||||
<div className="hidden md:flex items-center space-x-8">
|
||||
<Link href="/programs" className="text-gray-700 hover:text-blue-600">Programs</Link>
|
||||
<Link href="/admissions" className="text-gray-700 hover:text-blue-600">Admissions</Link>
|
||||
<Link href="/research" className="text-gray-700 hover:text-blue-600">Research</Link>
|
||||
<Link href="/campus" className="text-gray-700 hover:text-blue-600">Campus</Link>
|
||||
<Link href="/contact" className="text-gray-700 hover:text-blue-600">Contact</Link>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center space-x-4">
|
||||
<Link href="/login" className="text-gray-700 hover:text-blue-600">Sign In</Link>
|
||||
<Link href="/register" className="bg-blue-600 text-white px-4 py-2 rounded-lg hover:bg-blue-700">
|
||||
Apply Now
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
{/* Hero Section */}
|
||||
<section className="bg-gradient-to-br from-slate-900 via-blue-900 to-indigo-900 text-white py-20">
|
||||
<div className="container mx-auto px-4 text-center">
|
||||
<div className="max-w-4xl mx-auto">
|
||||
<div className="inline-flex items-center px-4 py-2 bg-white bg-opacity-10 rounded-full text-sm font-medium mb-8">
|
||||
<div className="inline-flex items-center px-4 py-2 bg-white/20 backdrop-blur-sm rounded-full text-sm font-medium mb-8 border border-white/20">
|
||||
<span className="w-2 h-2 bg-green-400 rounded-full mr-2"></span>
|
||||
Established 1995 • Accredited Institution
|
||||
</div>
|
||||
@@ -73,27 +42,60 @@ export default function HomePage() {
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-4 gap-8 max-w-4xl mx-auto">
|
||||
<div className="text-center p-6 bg-white bg-opacity-10 rounded-lg">
|
||||
<div className="text-center p-6 bg-white/20 backdrop-blur-sm rounded-lg border border-white/20">
|
||||
<div className="text-3xl font-bold text-white mb-2">25,000+</div>
|
||||
<div className="text-blue-200 text-sm">Students Enrolled</div>
|
||||
<div className="text-blue-100 text-sm font-medium">Students Enrolled</div>
|
||||
</div>
|
||||
<div className="text-center p-6 bg-white bg-opacity-10 rounded-lg">
|
||||
<div className="text-center p-6 bg-white/20 backdrop-blur-sm rounded-lg border border-white/20">
|
||||
<div className="text-3xl font-bold text-white mb-2">150+</div>
|
||||
<div className="text-blue-200 text-sm">Academic Programs</div>
|
||||
<div className="text-blue-100 text-sm font-medium">Academic Programs</div>
|
||||
</div>
|
||||
<div className="text-center p-6 bg-white bg-opacity-10 rounded-lg">
|
||||
<div className="text-center p-6 bg-white/20 backdrop-blur-sm rounded-lg border border-white/20">
|
||||
<div className="text-3xl font-bold text-white mb-2">95%</div>
|
||||
<div className="text-blue-200 text-sm">Graduate Success Rate</div>
|
||||
<div className="text-blue-100 text-sm font-medium">Graduate Success Rate</div>
|
||||
</div>
|
||||
<div className="text-center p-6 bg-white bg-opacity-10 rounded-lg">
|
||||
<div className="text-3xl font-bold text-white mb-2">$2.5B</div>
|
||||
<div className="text-blue-200 text-sm">Research Funding</div>
|
||||
<div className="text-center p-6 bg-white/20 backdrop-blur-sm rounded-lg border border-white/20">
|
||||
<div className="text-3xl font-bold text-white mb-2">OMR 2.5B</div>
|
||||
<div className="text-blue-100 text-sm font-medium">Research Funding</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Video Section */}
|
||||
<section className="py-20 bg-gray-900">
|
||||
<div className="container mx-auto px-4">
|
||||
<div className="text-center mb-12">
|
||||
<h2 className="text-4xl md:text-5xl font-bold text-white mb-6">
|
||||
Experience Our
|
||||
<span className="text-blue-400"> Campus</span>
|
||||
</h2>
|
||||
<p className="text-xl text-gray-300 max-w-3xl mx-auto">
|
||||
Take a virtual tour of our state-of-the-art facilities and discover the vibrant
|
||||
learning environment that awaits you at our university.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<div className="relative rounded-2xl overflow-hidden shadow-2xl">
|
||||
<video
|
||||
className="w-full h-auto"
|
||||
autoPlay
|
||||
muted
|
||||
loop
|
||||
playsInline
|
||||
poster="/images/hero1.jpg"
|
||||
>
|
||||
<source src="/Campus%20Tech%20Transformation%20July%2020%202025.mp4" type="video/mp4" />
|
||||
Your browser does not support the video tag.
|
||||
</video>
|
||||
<div className="absolute inset-0 bg-gradient-to-t from-black/20 to-transparent"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Features Section */}
|
||||
<section className="py-20 bg-gray-50">
|
||||
<div className="container mx-auto px-4">
|
||||
@@ -125,7 +127,7 @@ export default function HomePage() {
|
||||
</div>
|
||||
<h3 className="text-xl font-bold text-gray-900 mb-4">Research Leadership</h3>
|
||||
<p className="text-gray-600">
|
||||
Leading breakthrough research in medicine, technology, and environmental sciences with over $2.5 billion in research funding.
|
||||
Leading breakthrough research in medicine, technology, and environmental sciences with over OMR 2.5 billion in research funding.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user