Main functions
This commit is contained in:
118
views/index.ejs
118
views/index.ejs
@@ -1,58 +1,4 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="<%= locale %>" class="<%= theme === 'dark' ? 'dark' : '' %>">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title><%- title || 'SmartSolTech - Innovative Technology Solutions' %></title>
|
||||
|
||||
<!-- SEO Meta Tags -->
|
||||
<meta name="description" content="<%- __('meta.description') %>">
|
||||
<meta name="keywords" content="<%- __('meta.keywords') %>">
|
||||
|
||||
<!-- Open Graph -->
|
||||
<meta property="og:title" content="<%- __('meta.title') %>">
|
||||
<meta property="og:description" content="<%- __('meta.description') %>">
|
||||
<meta property="og:type" content="website">
|
||||
|
||||
<!-- PWA -->
|
||||
<meta name="theme-color" content="#3B82F6">
|
||||
<link rel="manifest" href="/manifest.json">
|
||||
<link rel="apple-touch-icon" href="/images/icon-192x192.png">
|
||||
|
||||
<!-- Custom CSS (load first) -->
|
||||
<link href="/css/base.css" rel="stylesheet">
|
||||
<link href="/css/main.css" rel="stylesheet">
|
||||
<link href="/css/fixes.css" rel="stylesheet">
|
||||
|
||||
<!-- Tailwind CSS via CDN -->
|
||||
<script src="https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio"></script>
|
||||
|
||||
<!-- Font Awesome -->
|
||||
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" rel="stylesheet" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous">
|
||||
|
||||
<!-- AOS Animation Library -->
|
||||
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
|
||||
|
||||
<!-- Tailwind Configuration -->
|
||||
<script>
|
||||
tailwind.config = {
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
'primary': '#3B82F6',
|
||||
'secondary': '#8B5CF6',
|
||||
'accent': '#10B981',
|
||||
},
|
||||
fontFamily: {
|
||||
'sans': ['Inter', 'system-ui', 'sans-serif'],
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
<body class="font-sans dark:bg-gray-900 dark:text-gray-100">
|
||||
<%- include('partials/navigation') %>
|
||||
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="relative bg-gradient-to-br from-blue-900 via-purple-900 to-indigo-900 dark:from-gray-900 dark:via-blue-900 dark:to-purple-900 min-h-screen flex items-center overflow-hidden hero-section">
|
||||
@@ -68,7 +14,7 @@
|
||||
|
||||
<div class="relative max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-24">
|
||||
<div class="text-center">
|
||||
<h1 class="text-5xl md:text-7xl font-bold text-white mb-6 leading-tight" data-aos="fade-up">
|
||||
<h1 class="text-3xl md:text-5xl font-bold text-white mb-6 leading-tight" data-aos="fade-up">
|
||||
<%- __('hero.title.smart') %>
|
||||
<span class="text-transparent bg-clip-text bg-gradient-to-r from-blue-400 to-purple-400"><%- __('hero.title.solutions') %></span>
|
||||
</h1>
|
||||
@@ -98,10 +44,10 @@
|
||||
<section class="py-20 bg-white dark:bg-gray-900">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="text-center mb-16" data-aos="fade-up">
|
||||
<h2 class="text-4xl md:text-5xl font-bold text-gray-900 dark:text-white mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-bold text-gray-900 dark:text-white mb-4">
|
||||
<%- __('services.title.our') %> <span class="text-blue-600 dark:text-blue-400"><%- __('services.title.services') %></span>
|
||||
</h2>
|
||||
<p class="text-xl text-gray-600 dark:text-gray-300 max-w-3xl mx-auto">
|
||||
<p class="text-lg text-white text-center max-w-3xl mx-auto">
|
||||
<%- __('services.subtitle') %>
|
||||
</p>
|
||||
</div>
|
||||
@@ -163,10 +109,10 @@
|
||||
<section class="py-20 bg-gray-50 dark:bg-gray-800">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="text-center mb-16" data-aos="fade-up">
|
||||
<h2 class="text-4xl md:text-5xl font-bold text-gray-900 dark:text-white mb-4">
|
||||
<h2 class="text-2xl md:text-3xl font-bold text-gray-900 dark:text-white mb-4">
|
||||
<%- __('portfolio.title.recent') %> <span class="text-purple-600 dark:text-purple-400"><%- __('portfolio.title.projects') %></span>
|
||||
</h2>
|
||||
<p class="text-xl text-gray-600 dark:text-gray-300 max-w-3xl mx-auto">
|
||||
<p class="text-lg text-white text-center max-w-3xl mx-auto">
|
||||
<%- __('portfolio.subtitle') %>
|
||||
</p>
|
||||
</div>
|
||||
@@ -264,10 +210,10 @@
|
||||
<section class="py-20 cta-section">
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center relative z-10">
|
||||
<div data-aos="fade-up">
|
||||
<h2 class="text-4xl md:text-5xl font-bold text-white mb-6">
|
||||
<h2 class="text-2xl md:text-3xl font-bold text-white mb-6">
|
||||
<%- __('calculator.cta.title') %>
|
||||
</h2>
|
||||
<p class="text-xl text-blue-100 mb-8 max-w-3xl mx-auto">
|
||||
<p class="text-lg text-blue-100 mb-8 max-w-3xl mx-auto">
|
||||
<%- __('calculator.cta.subtitle') %>
|
||||
</p>
|
||||
<a href="/calculator" class="inline-flex items-center px-8 py-4 bg-white text-blue-600 font-bold rounded-full text-lg hover:bg-gray-100 transition-colors transform hover:scale-105">
|
||||
@@ -283,10 +229,10 @@
|
||||
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
|
||||
<div data-aos="fade-right">
|
||||
<h2 class="text-4xl md:text-5xl font-bold text-gray-900 dark:text-white mb-6">
|
||||
<h2 class="text-2xl md:text-3xl font-bold text-gray-900 dark:text-white mb-6">
|
||||
<%- __('contact.cta.ready') %> <span class="text-blue-600 dark:text-blue-400"><%- __('contact.cta.start') %></span><%- __('contact.cta.question') %>
|
||||
</h2>
|
||||
<p class="text-xl text-gray-600 dark:text-gray-300 mb-8">
|
||||
<p class="text-lg text-white text-center mb-8">
|
||||
<%- __('contact.cta.subtitle') %>
|
||||
</p>
|
||||
<div class="space-y-4">
|
||||
@@ -356,39 +302,15 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<%- include('partials/footer') %>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
|
||||
<script src="/js/main.js"></script>
|
||||
|
||||
<!-- Initialize AOS -->
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
if (typeof AOS !== 'undefined') {
|
||||
AOS.init({
|
||||
duration: 800,
|
||||
easing: 'ease-in-out',
|
||||
once: true
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<!-- PWA Service Worker -->
|
||||
<script>
|
||||
if ('serviceWorker' in navigator) {
|
||||
window.addEventListener('load', () => {
|
||||
navigator.serviceWorker.register('/sw.js')
|
||||
.then(registration => {
|
||||
console.log('SW registered: ', registration);
|
||||
})
|
||||
.catch(registrationError => {
|
||||
console.log('SW registration failed: ', registrationError);
|
||||
});
|
||||
<!-- Initialize AOS -->
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
if (typeof AOS !== 'undefined') {
|
||||
AOS.init({
|
||||
duration: 800,
|
||||
easing: 'ease-in-out',
|
||||
once: true
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user