Zikil
1299038a1d
All checks were successful
Deploy FastAPI Application / deploy (push) Successful in 13s
565 lines
37 KiB
HTML
565 lines
37 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>SYBIKO - IT-решения</title>
|
||
<link rel="icon" type="image/x-icon" href="/static/images/SYBIKO_favicon.ico">
|
||
<!-- <link rel="shortcut icon" type="image/x-icon" href="{{ url_for('static', path='/images/SYBIKO_favicon.ico') }}"> -->
|
||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
|
||
<script src="https://cdn.tailwindcss.com"></script>
|
||
<script>
|
||
tailwind.config = {
|
||
theme: {
|
||
extend: {
|
||
colors: {
|
||
sybiko: {
|
||
red: '#FF0000',
|
||
dark: '#1A1A1A',
|
||
light: '#F5F5F5',
|
||
},
|
||
},
|
||
fontFamily: {
|
||
sans: ['Inter', 'sans-serif'],
|
||
},
|
||
},
|
||
},
|
||
}
|
||
</script>
|
||
<style>
|
||
body {
|
||
background-color: #FFFFFF;
|
||
color: #1A1A1A;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body class="font-sans">
|
||
<header class="container mx-auto px-4 py-6 flex justify-between items-center relative">
|
||
<a href="#" class="flex items-center">
|
||
<img src="static/images/SYBIKO_123.svg" alt="SYBIKO logo" class="w-48 h-9 md:w-64 md:h-12 mr-2">
|
||
</a>
|
||
<nav class="hidden md:block">
|
||
<a href="#about" class="text-sybiko-dark hover:text-sybiko-red mr-4">О нас</a>
|
||
<a href="#contact" class="bg-sybiko-dark text-white px-4 py-2 rounded-full hover:bg-sybiko-red transition duration-300">Связаться</a>
|
||
</nav>
|
||
<button id="mobile-menu-button" class="md:hidden">
|
||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16m-7 6h7"></path>
|
||
</svg>
|
||
</button>
|
||
<div id="mobile-menu" class="hidden absolute top-full left-0 right-0 bg-white shadow-md py-4 px-4 md:hidden">
|
||
<a href="#about" class="block text-sybiko-dark hover:text-sybiko-red px-4 py-2">О нас</a>
|
||
<a href="#contact" class="block bg-sybiko-dark text-white px-4 py-2 rounded-full hover:bg-sybiko-red transition duration-300 mt-2">Связаться</a>
|
||
</div>
|
||
</header>
|
||
|
||
<main>
|
||
<section id="hero" class="container mx-auto px-4 py-20">
|
||
<h1 class="text-6xl font-bold mb-8">
|
||
Мы создаем IT-решения для бизнеса.
|
||
</h1>
|
||
<p class="text-xl mb-8 max-w-2xl">
|
||
SYBIKO - команда профессионалов с опытом разработки передовых технологических решений для оптимизации бизнес-процессов.
|
||
</p>
|
||
<a href="#services" class="bg-sybiko-dark text-white px-6 py-3 rounded-full inline-flex items-center hover:bg-sybiko-red transition duration-300">
|
||
Узнать больше
|
||
<svg class="w-4 h-4 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 5l7 7m0 0l-7 7m7-7H3"></path>
|
||
</svg>
|
||
</a>
|
||
</section>
|
||
|
||
<section id="about" class="bg-sybiko-light py-20">
|
||
<div class="container mx-auto px-4">
|
||
<h2 class="text-4xl font-bold mb-8">О нас</h2>
|
||
<p class="text-xl mb-6 max-w-3xl">
|
||
SYBIKO - IT-компания, которая выполняет полный цикл работ от предварительного анализа и создания до внедрения и сопровождения конечных продуктов с использованием современных методик управления проектами и современных технологий разработки.
|
||
<p class="text-xl max-w-3xl">
|
||
Наша миссия - помогать компаниям оптимизировать свои процессы, используя силу современных технологий и инновационный подход к решению задач.
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="services" class="py-20">
|
||
<div class="container mx-auto px-4">
|
||
<h2 class="text-4xl font-bold mb-12">Наши услуги</h2>
|
||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||
<div class="bg-white p-8 rounded-lg shadow-lg">
|
||
<h3 class="text-2xl font-bold mb-4">Разработка и поддержка сайтов</h3>
|
||
<ul class="list-disc list-inside space-y-2">
|
||
<li>Создание сайтов с нуля</li>
|
||
<li>Поддержание работоспособности сайта</li>
|
||
<li>Мониторинг домена и хостинга</li>
|
||
</ul>
|
||
</div>
|
||
<div class="bg-white p-8 rounded-lg shadow-lg">
|
||
<h3 class="text-2xl font-bold mb-4">Разработка ПО</h3>
|
||
<ul class="list-disc list-inside space-y-2">
|
||
<li>Создание программного обеспечения</li>
|
||
<li>Внедрение готовых решений</li>
|
||
<li>Кастомизация под потребности клиента</li>
|
||
</ul>
|
||
</div>
|
||
<div class="bg-white p-8 rounded-lg shadow-lg">
|
||
<h3 class="text-2xl font-bold mb-4">Внедрение CRM</h3>
|
||
<ul class="list-disc list-inside space-y-2">
|
||
<li>Подбор оптимального CRM-решения</li>
|
||
<li>Настройка и адаптация под бизнес-процессы</li>
|
||
<li>Обучение сотрудников работе с CRM</li>
|
||
</ul>
|
||
</div>
|
||
<div class="bg-white p-8 rounded-lg shadow-lg">
|
||
<h3 class="text-2xl font-bold mb-4">Мобильные приложения</h3>
|
||
<ul class="list-disc list-inside space-y-2">
|
||
<li>Разработка для iOS и Android</li>
|
||
<li>Создание кроссплатформенных решений</li>
|
||
<li>Интеграция с существующими системами</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<!--
|
||
<section id="about" class="bg-sybiko-light py-20">
|
||
<div class="container mx-auto px-4">
|
||
<h2 class="text-4xl font-bold mb-8">О компании</h2>
|
||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||
<div>
|
||
<h3 class="text-2xl font-bold mb-4">Наша деятельность</h3>
|
||
<p class="mb-4">ООО "Сайбико" специализируется на разработке инновационных IT-решений для бизнеса. Мы предоставляем широкий спектр услуг от создания веб-сайтов до разработки сложных программных комплексов.</p>
|
||
<h3 class="text-2xl font-bold mb-4">Контакты</h3>
|
||
<ul class="list-disc list-inside mb-4">
|
||
<li>Название: ООО "Сайбико"</li>
|
||
<li>ИНН: 1234567890</li>
|
||
<li>Телефон: +7 (999) 123-45-67</li>
|
||
<li>Email: info@sybiko.ru</li>
|
||
</ul>
|
||
</div>
|
||
<div>
|
||
<h3 class="text-2xl font-bold mb-4">Технологический стек</h3>
|
||
<p class="mb-4">Мы используем современные технологии для создания эффективных решений:</p>
|
||
<ul class="list-disc list-inside mb-4">
|
||
<li>Языки программирования: Python, JavaScript, TypeScript</li>
|
||
<li>Фреймворки: FastAPI, React, Vue.js</li>
|
||
<li>Базы данных: PostgreSQL, MongoDB</li>
|
||
<li>Инфраструктура: Docker, Kubernetes</li>
|
||
<li>Облачные платформы: AWS, Google Cloud</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section> -->
|
||
|
||
<!-- <section id="tech-stack" class="py-20">
|
||
<div class="container mx-auto px-4">
|
||
<h2 class="text-4xl font-bold mb-12">Технологический стек</h2>
|
||
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
||
<div class="bg-white p-8 rounded-lg shadow-lg">
|
||
<h3 class="text-2xl font-bold mb-4">Языки программирования</h3>
|
||
<ul class="list-disc list-inside">
|
||
<li>Python</li>
|
||
<li>JavaScript</li>
|
||
<li>TypeScript</li>
|
||
<li>Java</li>
|
||
<li>C#</li>
|
||
</ul>
|
||
</div>
|
||
<div class="bg-white p-8 rounded-lg shadow-lg">
|
||
<h3 class="text-2xl font-bold mb-4">Фреймворки и библиотеки</h3>
|
||
<ul class="list-disc list-inside">
|
||
<li>FastAPI</li>
|
||
<li>Django</li>
|
||
<li>React</li>
|
||
<li>Vue.js</li>
|
||
<li>Angular</li>
|
||
<li>.NET Core</li>
|
||
</ul>
|
||
</div>
|
||
<div class="bg-white p-8 rounded-lg shadow-lg">
|
||
<h3 class="text-2xl font-bold mb-4">Инфраструктура и инструменты</h3>
|
||
<ul class="list-disc list-inside">
|
||
<li>Docker</li>
|
||
<li>Kubernetes</li>
|
||
<li>Git</li>
|
||
<li>Jenkins</li>
|
||
<li>AWS</li>
|
||
<li>Google Cloud</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="mt-12 text-center">
|
||
<p class="text-xl">Наша команда постоянно следит за новейшими технологиями и регулярно обновляет свои навыки, чтобы предоставлять клиентам самые современные и эффективные решения.</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
-->
|
||
<section id="tech-stack" class="py-20 bg-gray-100">
|
||
<div class="container mx-auto px-4">
|
||
<h2 class="text-4xl font-bold mb-12">Наш технологический стек</h2>
|
||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||
<div class="bg-white p-6 rounded-lg shadow">
|
||
<h3 class="text-2xl font-bold mb-4 text-sybiko">Разработка</h3>
|
||
<ul class="list-disc list-inside space-y-2">
|
||
<li>Python (FastAPI, Django)</li>
|
||
<li>JavaScript (React, Vue.js)</li>
|
||
<li>TypeScript</li>
|
||
<li>HTML5 / CSS3</li>
|
||
</ul>
|
||
</div>
|
||
<div class="bg-white p-6 rounded-lg shadow">
|
||
<h3 class="text-2xl font-bold mb-4 text-sybiko">Базы данных</h3>
|
||
<ul class="list-disc list-inside space-y-2">
|
||
<li>PostgreSQL</li>
|
||
<li>MySQL</li>
|
||
<li>Redis</li>
|
||
</ul>
|
||
</div>
|
||
<div class="bg-white p-6 rounded-lg shadow">
|
||
<h3 class="text-2xl font-bold mb-4 text-sybiko">Инфраструктура</h3>
|
||
<ul class="list-disc list-inside space-y-2">
|
||
<li>Docker</li>
|
||
<li>Kubernetes</li>
|
||
<li>Яндекс Cloud</li>
|
||
<li>Nginx</li>
|
||
</ul>
|
||
</div>
|
||
<div class="bg-white p-6 rounded-lg shadow">
|
||
<h3 class="text-2xl font-bold mb-4 text-sybiko">Инструменты</h3>
|
||
<ul class="list-disc list-inside space-y-2">
|
||
<li>Git</li>
|
||
<li>GitLab CI</li>
|
||
<li>Яндекс Трекер</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<p class="mt-12 text-center text-lg">
|
||
Мы постоянно следим за новыми технологиями и совершенствуем наши навыки,
|
||
чтобы предоставлять клиентам самые эффективные и современные решения.
|
||
</p>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="projects" class="py-20">
|
||
<div class="container mx-auto px-4">
|
||
<h2 class="text-4xl font-bold mb-12">Наши проекты</h2>
|
||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||
<div class="bg-white p-8 rounded-lg shadow-lg">
|
||
<h3 class="text-3xl font-bold mb-4">TrackLink</h3>
|
||
<p class="mb-6">TrackLink - наш флагманский продукт. Программное обеспечение по контролю, аналитике, диспетчеризации и мониторингу транспорта. Интегратор систем ГЛОНАСС/GPS мониторинга транспорта, тахографического контроля.</p>
|
||
<ul class="list-disc list-inside mb-6 space-y-2">
|
||
<li>Собственная команда разработчиков</li>
|
||
<li>Интуитивно понятный интерфейс</li>
|
||
<li>Гибкие настройки под различные методологии</li>
|
||
<li>Расширенная аналитика и отчетность</li>
|
||
<li>Регулярные обновления</li>
|
||
<li>Мобильное приложение</li>
|
||
</ul>
|
||
<a href="/tracklink-presentation"
|
||
class="text-sybiko-red hover:underline flex items-center"
|
||
target="_blank"
|
||
rel="noopener noreferrer">
|
||
<svg class="w-5 h-5 mr-2" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
|
||
<path fill-rule="evenodd" d="M4 4a2 2 0 012-2h4.586A2 2 0 0112 2.586L15.414 6A2 2 0 0116 7.414V16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm2 6a1 1 0 011-1h6a1 1 0 110 2H7a1 1 0 01-1-1zm1 3a1 1 0 100 2h6a1 1 0 100-2H7z" clip-rule="evenodd"></path>
|
||
</svg>
|
||
Узнать больше о TrackerLink (PDF)
|
||
</a>
|
||
</div>
|
||
<div class="bg-white p-8 rounded-lg shadow-lg">
|
||
<h3 class="text-3xl font-bold mb-4">Wanlanda.ru</h3>
|
||
<p class="mb-6">Сайт wanlanda.ru - проект, разработанный нами для компании Anthill. Это современный, функциональный веб-сайт, отражающий уникальный характер и услуги компании.</p>
|
||
<ul class="list-disc list-inside mb-6 space-y-2">
|
||
<li>Адаптивный дизайн для всех устройств</li>
|
||
<li>Оптимизация для поисковых систем (SEO)</li>
|
||
<li>Интуитивно понятный пользовательский интерфейс</li>
|
||
<li>Интеграция с системами управления контентом</li>
|
||
<li>Высокая производительность и скорость загрузки</li>
|
||
<li>Соответствие современным веб-стандартам</li>
|
||
</ul>
|
||
<a href="https://wanlanda.ru"
|
||
class="text-sybiko-red hover:underline flex items-center"
|
||
target="_blank"
|
||
rel="noopener noreferrer">
|
||
<svg class="w-5 h-5 mr-2" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
|
||
<path d="M11 3a1 1 0 100 2h2.586l-6.293 6.293a1 1 0 101.414 1.414L15 6.414V9a1 1 0 102 0V4a1 1 0 00-1-1h-5z"></path>
|
||
<path d="M5 5a2 2 0 00-2 2v8a2 2 0 002 2h8a2 2 0 002-2v-3a1 1 0 10-2 0v3H5V7h3a1 1 0 000-2H5z"></path>
|
||
</svg>
|
||
Посетить сайт Wanlanda.ru
|
||
</a>
|
||
</div>
|
||
<div class="bg-white p-8 rounded-lg shadow-lg">
|
||
<h3 class="text-3xl font-bold mb-4">Оптимизация CRM для компании Anthill</h3>
|
||
<p class="mb-6">Провели комплексную оптимизацию CRM-системы для тендерного отдела компании Anthill, что значительно повысило эффективность работы сотрудников.</p>
|
||
<ul class="list-disc list-inside mb-6 space-y-2">
|
||
<li>Разработка карты бизнес-процессов</li>
|
||
<li>Детальный анализ и структурирование рабочих процессов</li>
|
||
<li>Выявление областей для оптимизации</li>
|
||
<li>Настройка и внедрение дополнительного функционала</li>
|
||
<!-- <li>Платформа: Битрикс 24</li> -->
|
||
</ul>
|
||
<p class="mb-6 space-y-2"><strong>Платформа:</strong> Битрикс 24</p>
|
||
<p class="mb-6 space-y-2"><strong>Цель:</strong> улучшение системы управления взаимоотношениями с клиентами</p>
|
||
<p class="mb-6">
|
||
<strong>Результаты оптимизации:</strong>
|
||
<ul class="list-disc list-inside space-y-2">
|
||
<li>Расширение возможностей работы сотрудников внутри компании</li>
|
||
<li>Повышение эффективности развития тендерного отдела</li>
|
||
</ul>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="prices" class="bg-sybiko-light py-20">
|
||
<div class="container mx-auto px-4">
|
||
<h2 class="text-4xl font-bold mb-12">Цены на услуги</h2>
|
||
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
|
||
<div class="bg-white p-8 rounded-lg shadow-lg">
|
||
<h3 class="text-2xl font-bold mb-4">Разработка веб-сайта</h3>
|
||
<p class="text-3xl font-bold mb-4">от 100 000 ₽</p>
|
||
<ul class="list-disc list-inside mb-4">
|
||
<li>Дизайн</li>
|
||
<li>Вёрстка</li>
|
||
<li>Базовая SEO-оптимизация</li>
|
||
</ul>
|
||
</div>
|
||
<div class="bg-white p-8 rounded-lg shadow-lg">
|
||
<h3 class="text-2xl font-bold mb-4">Разработка веб-приложения</h3>
|
||
<p class="text-3xl font-bold mb-4">от 300 000 ₽</p>
|
||
<ul class="list-disc list-inside mb-4">
|
||
<li>Проектирование архитектуры</li>
|
||
<li>Разработка frontend и backend</li>
|
||
<li>Интеграция с API</li>
|
||
</ul>
|
||
</div>
|
||
<div class="bg-white p-8 rounded-lg shadow-lg">
|
||
<h3 class="text-2xl font-bold mb-4">Разработка мобильного приложения</h3>
|
||
<p class="text-3xl font-bold mb-4">от 500 000 ₽</p>
|
||
<ul class="list-disc list-inside mb-4">
|
||
<li>iOS и Android версии</li>
|
||
<li>Нативная разработка</li>
|
||
<li>Публикация в App Store и Google Play</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="future" class="py-20">
|
||
<div class="container mx-auto px-4">
|
||
<h2 class="text-4xl font-bold mb-12">Наши перспективы</h2>
|
||
<p class="text-xl mb-6">Как молодая и динамичная компания, благодаря современным цифровым возможностям, мы имеет масштабные планы на развитие:</p>
|
||
<ul class="list-disc list-inside mb-6 space-y-3 text-xl">
|
||
<li>Расширение линейки продуктов для охвата новых сегментов рынка</li>
|
||
<li>Развитие партнерских отношений с ведущими IT-компаниями</li>
|
||
<li>Выход на международный рынок</li>
|
||
<li>Улучшение клиентского опыта</li>
|
||
<li>Оптимизация бизнес-процессов</li>
|
||
<li>Маркетинг и брендинг</li>
|
||
<li>Инвестиции в исследования и разработку инновационных технологий</li>
|
||
<li>Социальная ответственность и устойчивое развитие</li>
|
||
</ul>
|
||
<p class="text-xl">Мы стремимся стать лидером в области IT-решений, предоставляя нашим клиентам самые передовые и эффективные инструменты для развития их бизнеса.</p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Секция новостей компании -->
|
||
<section id="news" class="bg-sybiko-light py-20">
|
||
<div class="container mx-auto px-4">
|
||
<h2 class="text-4xl font-bold mb-12">Новости компании</h2>
|
||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||
<article class="bg-white rounded-lg shadow-lg overflow-hidden">
|
||
<img src="static/images/conference1.jpeg" alt="Конференция в Омске" class="w-full h-64 object-cover">
|
||
<div class="p-6">
|
||
<h3 class="text-2xl font-bold mb-2">SYBIKO на конференции "Отечественный софт" в Омске</h3>
|
||
<p class="text-gray-600 mb-4">4 сентября 2024</p>
|
||
<p class="text-gray-800 mb-4">
|
||
4 сентября в Омске состоялась практическая ИТ-конференция и выставка для представителей промышленных предприятий Сибирского федерального округа «Отечественный софт: путь к технологическому лидерству». Наша команда приняла участие в этом важном мероприятии.
|
||
</p>
|
||
<a href="/news/conference-omsk" class="text-sybiko-red hover:underline">Читать далее</a>
|
||
</div>
|
||
</article>
|
||
<!-- Здесь можно добавить дополнительные новости, используя тот же формат -->
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
|
||
<section id="contact" class=" py-20">
|
||
<div class="container mx-auto px-4">
|
||
<h2 class="text-4xl font-bold mb-12">Свяжитесь с нами</h2>
|
||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||
<div>
|
||
<h3 class="text-2xl font-bold mb-4">Контакты</h3>
|
||
<ul class="list-disc list-inside mb-4 y-2">
|
||
<li>ООО "Сайбико"</li>
|
||
<li>ИНН: 4217210995</li>
|
||
<li>Телефон: +7 (981) 738-29-09</li>
|
||
<li>Email: info@sybiko.ru</li>
|
||
<li>Email: sybikosib@gmail.com</li>
|
||
</ul>
|
||
</div>
|
||
<div>
|
||
<h3 class="text-2xl font-bold mb-4">Напишите нам</h3>
|
||
<form id="contactForm" onsubmit="submitForm(event)">
|
||
<div class="mb-4">
|
||
<label for="name" class="block text-gray-700 font-bold mb-2">Имя</label>
|
||
<input type="text" id="name" name="name" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-sybiko-red" required>
|
||
</div>
|
||
<div class="mb-4">
|
||
<label for="email" class="block text-gray-700 font-bold mb-2">Email</label>
|
||
<input type="email" id="email" name="email" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-sybiko-red" required>
|
||
</div>
|
||
<div class="mb-4">
|
||
<label for="message" class="block text-gray-700 font-bold mb-2">Сообщение</label>
|
||
<textarea id="message" name="message" rows="4" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-sybiko-red" required></textarea>
|
||
</div>
|
||
<button type="submit" class="bg-sybiko-dark text-white px-6 py-3 rounded-full hover:bg-sybiko-red transition duration-300">Отправить</button>
|
||
</form>
|
||
<div id="formMessage" class="mt-4 text-center hidden"></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<footer class="bg-sybiko-dark text-white py-20">
|
||
<div class="container mx-auto px-4">
|
||
<div class="grid grid-cols-1 md:grid-cols-3 gap-12">
|
||
<div>
|
||
<a href="#" class="flex items-center mb-4">
|
||
<img src="static/images/SYBIKO_123_white.svg" alt="SYBIKO logo" class="w-48 h-8 mr-2">
|
||
<!-- <span class="text-xl font-bold">SYBIKO</span> -->
|
||
</a>
|
||
<p class="text-gray-400">IT-решения для вашего бизнеса</p>
|
||
<br>
|
||
<p class="text-gray-400">ООО «САЙБИКО» является аккредитованной IT-компанией «Министерством цифрового развития,связи и массовых коммуникаций Российской Федерации».</p>
|
||
<p class="text-gray-400">Решение о предоставлении государственной аккредитации организации, осуществляющей деятельность в области информационных технологий
|
||
от 02.08.2024 No АО-20240731-19054932804-3</p>
|
||
</div>
|
||
<div>
|
||
<h4 class="font-bold mb-4">Навигация</h4>
|
||
<ul class="space-y-2">
|
||
<li><a href="#about" class="hover:text-sybiko-red transition duration-300">О нас</a></li>
|
||
<li><a href="#services" class="hover:text-sybiko-red transition duration-300">Услуги</a></li>
|
||
<li><a href="#projects" class="hover:text-sybiko-red transition duration-300">Проекты</a></li>
|
||
<li><a href="#future" class="hover:text-sybiko-red transition duration-300">Перспективы</a></li>
|
||
<li><a href="#contact" class="hover:text-sybiko-red transition duration-300">Контакты</a></li>
|
||
</ul>
|
||
</div>
|
||
<div>
|
||
<h4 class="font-bold mb-4">Контакты</h4>
|
||
<ul class="space-y-2">
|
||
<!-- <li>+7 (999) 123-45-67</li> -->
|
||
<li>ООО "Сайбико"</li>
|
||
<li>ИНН: 4217210995</li>
|
||
<li>Телефон: +7 (981) 738-29-09</li>
|
||
<li>Email: info@sybiko.ru</li>
|
||
<li>Email: sybikosib@gmail.com</li>
|
||
<!-- <li>г. Новокузнецк, ул. Тольятти, д. 5Б, пом. 10</li> -->
|
||
</ul>
|
||
<!-- <div class="mt-4 flex space-x-4">
|
||
<a href="#" class="text-white hover:text-sybiko-red transition duration-300">
|
||
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/></svg>
|
||
</a>
|
||
<a href="#" class="text-white hover:text-sybiko-red transition duration-300">
|
||
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085 4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z"/></svg>
|
||
</a>
|
||
<a href="#" class="text-white hover:text-sybiko-red transition duration-300">
|
||
<svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.225 0z"/></svg>
|
||
</a>
|
||
</div> -->
|
||
</div>
|
||
</div>
|
||
<div class="mt-8 pt-8 border-t border-gray-700 text-center">
|
||
<p>© 2024 SYBIKO. Все права защищены.</p>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
<script>
|
||
// Плавная прокрутка к секциям
|
||
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
||
anchor.addEventListener('click', function (e) {
|
||
e.preventDefault();
|
||
document.querySelector(this.getAttribute('href')).scrollIntoView({
|
||
behavior: 'smooth'
|
||
});
|
||
});
|
||
});
|
||
|
||
|
||
async function submitForm(event) {
|
||
event.preventDefault();
|
||
const form = event.target;
|
||
const formData = new FormData(form);
|
||
const formMessage = document.getElementById('formMessage');
|
||
|
||
try {
|
||
const response = await fetch('/submit-form', {
|
||
method: 'POST',
|
||
body: JSON.stringify(Object.fromEntries(formData)),
|
||
headers: {
|
||
'Content-Type': 'application/json'
|
||
}
|
||
});
|
||
|
||
const result = await response.json();
|
||
|
||
if (response.ok) {
|
||
formMessage.textContent = 'Спасибо за ваше сообщение! Мы свяжемся с вами в ближайшее время.';
|
||
formMessage.classList.remove('hidden', 'text-red-500');
|
||
formMessage.classList.add('text-green-500');
|
||
form.reset();
|
||
} else {
|
||
throw new Error(result.detail || 'Произошла ошибка при отправке формы.');
|
||
}
|
||
} catch (error) {
|
||
formMessage.textContent = error.message;
|
||
formMessage.classList.remove('hidden', 'text-green-500');
|
||
formMessage.classList.add('text-red-500');
|
||
}
|
||
}
|
||
const mobileMenuButton = document.getElementById('mobile-menu-button');
|
||
const mobileMenu = document.getElementById('mobile-menu');
|
||
|
||
mobileMenuButton.addEventListener('click', () => {
|
||
mobileMenu.classList.toggle('hidden');
|
||
});
|
||
|
||
// Close mobile menu when clicking outside
|
||
document.addEventListener('click', (event) => {
|
||
if (!mobileMenu.contains(event.target) && !mobileMenuButton.contains(event.target)) {
|
||
mobileMenu.classList.add('hidden');
|
||
}
|
||
});
|
||
|
||
// Close mobile menu when a link is clicked
|
||
mobileMenu.querySelectorAll('a').forEach(link => {
|
||
link.addEventListener('click', () => {
|
||
mobileMenu.classList.add('hidden');
|
||
});
|
||
});
|
||
|
||
// // Анимация появления элементов при прокрутке
|
||
// const observerOptions = {
|
||
// root: null,
|
||
// rootMargin: '0px',
|
||
// threshold: 0.1
|
||
// };
|
||
|
||
// const observer = new IntersectionObserver((entries) => {
|
||
// entries.forEach(entry => {
|
||
// if (entry.isIntersecting) {
|
||
// entry.target.classList.add('animate-fade-in-up');
|
||
// }
|
||
// });
|
||
// }, observerOptions);
|
||
|
||
// document.querySelectorAll('section > div').forEach(el => {
|
||
// el.classList.add('opacity-0', 'transform', 'translate-y-10', 'transition', 'duration-1000');
|
||
// observer.observe(el);
|
||
// });
|
||
</script>
|
||
</body>
|
||
</html> |