Andrey K. Choi
9477ff6de0
- Portfolio CRUD: добавление, редактирование, удаление, переключение публикации - Services CRUD: полное управление услугами с возможностью активации/деактивации - Banner system: новая модель Banner с CRUD операциями и аналитикой кликов - Telegram integration: расширенные настройки бота, обнаружение чатов, отправка сообщений - Media management: улучшенная загрузка файлов с оптимизацией изображений и превью - UI improvements: обновлённые админ-панели с rich-text редактором и drag&drop загрузкой - Database: добавлена таблица banners с полями для баннеров и аналитики
160 lines
7.9 KiB
Plaintext
160 lines
7.9 KiB
Plaintext
<!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><%- __('about.meta.title') %> - SmartSolTech</title>
|
|
|
|
<!-- SEO Meta Tags -->
|
|
<meta name="description" content="<%- __('about.meta.description') %>">
|
|
|
|
<!-- Styles -->
|
|
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
|
|
<link href="/css/main.css" rel="stylesheet">
|
|
<link href="/css/fixes.css" rel="stylesheet">
|
|
<link href="/css/dark-theme.css" rel="stylesheet">
|
|
</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 hero-section-compact">
|
|
<div class="absolute inset-0 bg-black opacity-50 dark:opacity-70"></div>
|
|
<div class="relative max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
|
<h1 class="text-4xl md:text-5xl font-bold text-white mb-4">
|
|
<%- __('about.hero.title') %>
|
|
</h1>
|
|
<p class="text-lg text-gray-300 dark:text-gray-200 max-w-2xl mx-auto">
|
|
<%- __('about.hero.subtitle') %>
|
|
</p>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- About Section -->
|
|
<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="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
|
|
<div>
|
|
<h2 class="text-4xl font-bold text-gray-900 dark:text-white mb-6">
|
|
<%- __('about.company.title') %>
|
|
</h2>
|
|
<p class="text-lg text-gray-600 dark:text-gray-300 mb-6">
|
|
<%- __('about.company.description1') %>
|
|
</p>
|
|
<p class="text-lg text-gray-600 dark:text-gray-300 mb-8">
|
|
<%- __('about.company.description2') %>
|
|
</p>
|
|
|
|
<!-- Stats -->
|
|
<div class="grid grid-cols-3 gap-6">
|
|
<div class="text-center">
|
|
<div class="text-3xl font-bold text-blue-600 dark:text-blue-400 mb-2">50+</div>
|
|
<div class="text-gray-600 dark:text-gray-300"><%- __('about.stats.projects') %></div>
|
|
</div>
|
|
<div class="text-center">
|
|
<div class="text-3xl font-bold text-purple-600 dark:text-purple-400 mb-2">3+</div>
|
|
<div class="text-gray-600 dark:text-gray-300"><%- __('about.stats.experience') %></div>
|
|
</div>
|
|
<div class="text-center">
|
|
<div class="text-3xl font-bold text-green-600 dark:text-green-400 mb-2">30+</div>
|
|
<div class="text-gray-600 dark:text-gray-300"><%- __('about.stats.clients') %></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Image placeholder -->
|
|
<div class="lg:order-first">
|
|
<div class="w-full h-96 bg-gradient-to-br from-blue-500 to-purple-600 rounded-2xl flex items-center justify-center">
|
|
<i class="fas fa-users text-white text-6xl"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Mission Section -->
|
|
<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">
|
|
<h2 class="text-4xl font-bold text-gray-900 dark:text-white mb-4">
|
|
<%- __('about.mission.title') %>
|
|
</h2>
|
|
<p class="text-xl text-gray-600 dark:text-gray-300 max-w-3xl mx-auto">
|
|
<%- __('about.mission.description') %>
|
|
</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
|
<!-- Innovation -->
|
|
<div class="text-center p-8 bg-white dark:bg-gray-700 rounded-2xl shadow-lg">
|
|
<div class="w-16 h-16 bg-blue-100 dark:bg-blue-900 rounded-full flex items-center justify-center mx-auto mb-6">
|
|
<i class="fas fa-lightbulb text-blue-600 dark:text-blue-400 text-2xl"></i>
|
|
</div>
|
|
<h3 class="text-2xl font-bold text-gray-900 dark:text-white mb-4">
|
|
<%- __('about.values.innovation.title') %>
|
|
</h3>
|
|
<p class="text-gray-600 dark:text-gray-300">
|
|
<%- __('about.values.innovation.description') %>
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Quality -->
|
|
<div class="text-center p-8 bg-white dark:bg-gray-700 rounded-2xl shadow-lg">
|
|
<div class="w-16 h-16 bg-purple-100 dark:bg-purple-900 rounded-full flex items-center justify-center mx-auto mb-6">
|
|
<i class="fas fa-award text-purple-600 dark:text-purple-400 text-2xl"></i>
|
|
</div>
|
|
<h3 class="text-2xl font-bold text-gray-900 dark:text-white mb-4">
|
|
<%- __('about.values.quality.title') %>
|
|
</h3>
|
|
<p class="text-gray-600 dark:text-gray-300">
|
|
<%- __('about.values.quality.description') %>
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Partnership -->
|
|
<div class="text-center p-8 bg-white dark:bg-gray-700 rounded-2xl shadow-lg">
|
|
<div class="w-16 h-16 bg-green-100 dark:bg-green-900 rounded-full flex items-center justify-center mx-auto mb-6">
|
|
<i class="fas fa-handshake text-green-600 dark:text-green-400 text-2xl"></i>
|
|
</div>
|
|
<h3 class="text-2xl font-bold text-gray-900 dark:text-white mb-4">
|
|
<%- __('about.values.partnership.title') %>
|
|
</h3>
|
|
<p class="text-gray-600 dark:text-gray-300">
|
|
<%- __('about.values.partnership.description') %>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CTA Section -->
|
|
<section class="py-20 cta-section">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
|
|
<h2 class="text-4xl font-bold text-white mb-6">
|
|
<%- __('about.cta.title') %>
|
|
</h2>
|
|
<p class="text-xl text-blue-100 mb-8 max-w-3xl mx-auto">
|
|
<%- __('about.cta.subtitle') %>
|
|
</p>
|
|
<a href="/contact" 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">
|
|
<%- __('about.cta.button') %>
|
|
<svg class="ml-2 w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"></path>
|
|
</svg>
|
|
</a>
|
|
</div>
|
|
</section>
|
|
|
|
<%- include('partials/footer') %>
|
|
|
|
<!-- Scripts -->
|
|
<script>
|
|
// Theme initialization
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const theme = localStorage.getItem('theme') || 'light';
|
|
document.documentElement.className = theme === 'dark' ? 'dark' : '';
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |