Добавлена ContactInfo модель с красивой страницей О нас
Some checks failed
continuous-integration/drone/push Build is failing

- 📊 Создана ContactInfo модель с полями компании, контактов и описания
- 🎨 Полностью переработана страница about.html с современными карточками
- 🔗 Админ-панель для управления контактной информацией
- 💎 CSS анимации и градиенты для улучшения UI/UX
- 🗄️ Миграция 0012_contactinfo.py для создания таблицы
- 🔧 Обновлены views для использования данных из БД
This commit is contained in:
2025-11-25 15:38:10 +09:00
parent 74e43066b6
commit c1616ac542
19 changed files with 1027 additions and 347 deletions

View File

@@ -1,7 +1,15 @@
from django.contrib import admin
from .models import Service, Project, Client, Order, Review, BlogPost, Category, ServiceRequest, HeroBanner
from .models import Service, Project, Client, Order, Review, BlogPost, Category, ServiceRequest, HeroBanner, ContactInfo
from .forms import ProjectForm
@admin.register(ContactInfo)
class ContactInfoAdmin(admin.ModelAdmin):
list_display = ('company_name', 'email', 'phone', 'is_active')
list_filter = ('is_active',)
search_fields = ('company_name', 'email', 'phone')
fields = ('company_name', 'email', 'phone', 'telegram', 'address', 'working_hours',
'description', 'call_to_action', 'subtitle', 'is_active')
@admin.register(HeroBanner)
class HeroBannerAdmin(admin.ModelAdmin):
list_display = ('title', 'is_active', 'order', 'created_at')

View File

@@ -0,0 +1,33 @@
# Generated by Django 5.1.1 on 2025-11-25 06:19
from django.db import migrations, models
class Migration(migrations.Migration):
dependencies = [
('web', '0011_add_video_fields'),
]
operations = [
migrations.CreateModel(
name='ContactInfo',
fields=[
('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
('company_name', models.CharField(default='SmartSolTech', max_length=200, verbose_name='Название компании')),
('email', models.EmailField(default='info@smartsoltech.kr', max_length=254, verbose_name='Email')),
('phone', models.CharField(default='+82-10-5693-6103', max_length=20, verbose_name='Телефон')),
('telegram', models.CharField(default='@smartsoltech', max_length=100, verbose_name='Telegram')),
('address', models.TextField(default='Чолланамдо, Кванджу', verbose_name='Адрес')),
('working_hours', models.CharField(default='Пн-Пт 9:00-18:00', max_length=100, verbose_name='Часы работы')),
('description', models.TextField(default='Мы - команда профессионалов в сфере IT-решений', verbose_name='Описание')),
('call_to_action', models.CharField(default='Начнем сотрудничество?', max_length=200, verbose_name='Призыв к действию')),
('subtitle', models.CharField(default='Свяжитесь с нами для обсуждения вашего проекта', max_length=200, verbose_name='Подзаголовок')),
('is_active', models.BooleanField(default=True, verbose_name='Активно')),
],
options={
'verbose_name': 'Контактная информация',
'verbose_name_plural': 'Контактная информация',
},
),
]

View File

@@ -3,6 +3,31 @@ from django.contrib.auth.models import AbstractUser, User
import uuid
from django.urls import reverse
class ContactInfo(models.Model):
"""Модель для контактной информации компании"""
company_name = models.CharField(max_length=200, default="SmartSolTech", verbose_name="Название компании")
email = models.EmailField(default="info@smartsoltech.kr", verbose_name="Email")
phone = models.CharField(max_length=20, default="+82-10-5693-6103", verbose_name="Телефон")
telegram = models.CharField(max_length=100, default="@smartsoltech", verbose_name="Telegram")
address = models.TextField(default="Чолланамдо, Кванджу", verbose_name="Адрес")
working_hours = models.CharField(max_length=100, default="Пн-Пт 9:00-18:00", verbose_name="Часы работы")
description = models.TextField(default="Мы - команда профессионалов в сфере IT-решений", verbose_name="Описание")
call_to_action = models.CharField(max_length=200, default="Начнем сотрудничество?", verbose_name="Призыв к действию")
subtitle = models.CharField(max_length=200, default="Свяжитесь с нами для обсуждения вашего проекта", verbose_name="Подзаголовок")
is_active = models.BooleanField(default=True, verbose_name="Активно")
class Meta:
verbose_name = 'Контактная информация'
verbose_name_plural = 'Контактная информация'
def __str__(self):
return f"Контакты - {self.company_name}"
@classmethod
def get_active(cls):
"""Получить активную контактную информацию"""
return cls.objects.filter(is_active=True).first() or cls.objects.create()
class HeroBanner(models.Model):
"""Модель для главного баннера на сайте"""
title = models.CharField(max_length=200, verbose_name="Заголовок")

View File

@@ -1,53 +1,280 @@
{% extends 'web/base_modern.html' %}
{% load static %}
{% block title %}{{ contact_info.company_name }} - О нас{% endblock %}
{% block extra_styles %}
<style>
.about-hero {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
padding: 4rem 0;
text-align: center;
position: relative;
overflow: hidden;
}
.about-hero::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none"><polygon fill="white" fill-opacity="0.1" points="1000,4 1000,100 0,100"/></svg>');
z-index: 1;
}
.about-hero .container {
position: relative;
z-index: 2;
}
.contact-card {
background: white;
border-radius: 20px;
padding: 2rem;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1);
border: 1px solid rgba(255,255,255,0.2);
margin-bottom: 2rem;
position: relative;
overflow: hidden;
}
.contact-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 4px;
background: linear-gradient(90deg, #667eea, #764ba2, #667eea);
background-size: 200% 100%;
animation: shimmer 2s linear infinite;
}
.contact-card:hover {
transform: translateY(-10px);
box-shadow: 0 20px 40px rgba(0,0,0,0.15);
}
.contact-icon {
width: 60px;
height: 60px;
background: linear-gradient(135deg, #667eea, #764ba2);
border-radius: 15px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 1.5rem;
color: white;
font-size: 24px;
}
.contact-title {
font-weight: 700;
font-size: 1.25rem;
color: #2c3e50;
margin-bottom: 0.5rem;
}
.contact-info {
color: #667eea;
font-size: 1rem;
font-weight: 500;
}
.contact-info a {
color: #667eea;
text-decoration: none;
transition: color 0.3s ease;
}
.contact-info a:hover {
color: #764ba2;
text-decoration: underline;
}
.cta-section {
background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
padding: 4rem 0;
text-align: center;
}
.cta-title {
font-size: 2.5rem;
font-weight: 700;
color: #2c3e50;
margin-bottom: 1rem;
}
.cta-subtitle {
font-size: 1.25rem;
color: #6c757d;
margin-bottom: 2rem;
}
.cta-button {
background: linear-gradient(135deg, #667eea, #764ba2);
color: white;
padding: 1rem 2rem;
border: none;
border-radius: 50px;
font-size: 1.1rem;
font-weight: 600;
transition: all 0.3s ease;
text-decoration: none;
display: inline-block;
}
.cta-button:hover {
transform: translateY(-2px);
box-shadow: 0 10px 20px rgba(102, 126, 234, 0.3);
color: white;
text-decoration: none;
}
.description-card {
background: white;
border-radius: 20px;
padding: 3rem;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
margin: 3rem 0;
}
.description-card h3 {
color: #2c3e50;
font-weight: 700;
margin-bottom: 1.5rem;
font-size: 1.8rem;
}
.description-card p {
color: #6c757d;
font-size: 1.1rem;
line-height: 1.7;
margin-bottom: 0;
}
@keyframes shimmer {
0% { background-position: -200% 0; }
100% { background-position: 200% 0; }
}
.working-hours-badge {
background: linear-gradient(135deg, #28a745, #20c997);
color: white;
padding: 0.5rem 1rem;
border-radius: 20px;
font-size: 0.9rem;
font-weight: 600;
display: inline-block;
margin-top: 1rem;
}
</style>
{% endblock %}
{% block content %}
<section class="position-relative py-4 py-xl-5">
<div class="container position-relative">
<div class="row mb-5">
<div class="col-md-8 col-xl-6 text-center mx-auto">
<h2>Contact us</h2>
<p class="w-lg-50"></p>
</div>
</div>
<div class="row d-flex justify-content-center">
<div class="col-md-6 col-lg-4 col-xl-4">
<div class="d-flex flex-column justify-content-center align-items-start h-100">
<div class="d-flex align-items-center p-3">
<div class="bs-icon-md bs-icon-rounded bs-icon-primary d-flex flex-shrink-0 justify-content-center align-items-center d-inline-block bs-icon"><svg class="bi bi-telephone" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16">
<path d="M3.654 1.328a.678.678 0 0 0-1.015-.063L1.605 2.3c-.483.484-.661 1.169-.45 1.77a17.568 17.568 0 0 0 4.168 6.608 17.569 17.569 0 0 0 6.608 4.168c.601.211 1.286.033 1.77-.45l1.034-1.034a.678.678 0 0 0-.063-1.015l-2.307-1.794a.678.678 0 0 0-.58-.122l-2.19.547a1.745 1.745 0 0 1-1.657-.459L5.482 8.062a1.745 1.745 0 0 1-.46-1.657l.548-2.19a.678.678 0 0 0-.122-.58L3.654 1.328zM1.884.511a1.745 1.745 0 0 1 2.612.163L6.29 2.98c.329.423.445.974.315 1.494l-.547 2.19a.678.678 0 0 0 .178.643l2.457 2.457a.678.678 0 0 0 .644.178l2.189-.547a1.745 1.745 0 0 1 1.494.315l2.306 1.794c.829.645.905 1.87.163 2.611l-1.034 1.034c-.74.74-1.846 1.065-2.877.702a18.634 18.634 0 0 1-7.01-4.42 18.634 18.634 0 0 1-4.42-7.009c-.362-1.03-.037-2.137.703-2.877L1.885.511z"></path>
</svg></div>
<div class="px-2">
<h6 class="mb-0">Телефон</h6>
<p class="mb-0"><a href ="tel:01056936103">010-5693-6103</a></p>
</div>
<!-- Hero Section -->
<section class="about-hero">
<div class="container">
<h1 class="display-4 fw-bold mb-3">{{ contact_info.call_to_action }}</h1>
<p class="lead">{{ contact_info.subtitle }}</p>
</div>
</section>
<!-- Contact Cards Section -->
<section class="py-5">
<div class="container">
<div class="row">
<!-- Email Card -->
<div class="col-lg-4 col-md-6">
<div class="contact-card">
<div class="contact-icon">
<i class="fas fa-envelope"></i>
</div>
<div class="d-flex align-items-center p-3">
<div class="bs-icon-md bs-icon-rounded bs-icon-primary d-flex flex-shrink-0 justify-content-center align-items-center d-inline-block bs-icon"><svg class="bi bi-envelope" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16">
<path d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2zm2-1a1 1 0 0 0-1 1v.217l7 4.2 7-4.2V4a1 1 0 0 0-1-1zm13 2.383-4.708 2.825L15 11.105zm-.034 6.876-5.64-3.471L8 9.583l-1.326-.795-5.64 3.47A1 1 0 0 0 2 13h12a1 1 0 0 0 .966-.741M1 11.105l4.708-2.897L1 5.383z"></path>
</svg></div>
<div class="px-2">
<h6 class="mb-0">Email</h6>
<p class="mb-0"><a href="mailto:a.choi@smartsoltech.kr">a.choi@smartsoltech.kr</a></p>
</div>
</div>
<div class="d-flex align-items-center p-3">
<div class="bs-icon-md bs-icon-rounded bs-icon-primary d-flex flex-shrink-0 justify-content-center align-items-center d-inline-block bs-icon"><svg class="bi bi-pin" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16">
<path d="M4.146.146A.5.5 0 0 1 4.5 0h7a.5.5 0 0 1 .5.5c0 .68-.342 1.174-.646 1.479-.126.125-.25.224-.354.298v4.431l.078.048c.203.127.476.314.751.555C12.36 7.775 13 8.527 13 9.5a.5.5 0 0 1-.5.5h-4v4.5c0 .276-.224 1.5-.5 1.5s-.5-1.224-.5-1.5V10h-4a.5.5 0 0 1-.5-.5c0-.973.64-1.725 1.17-2.189A5.921 5.921 0 0 1 5 6.708V2.277a2.77 2.77 0 0 1-.354-.298C4.342 1.674 4 1.179 4 .5a.5.5 0 0 1 .146-.354zm1.58 1.408-.002-.001.002.001m-.002-.001.002.001A.5.5 0 0 1 6 2v5a.5.5 0 0 1-.276.447h-.002l-.012.007-.054.03a4.922 4.922 0 0 0-.827.58c-.318.278-.585.596-.725.936h7.792c-.14-.34-.407-.658-.725-.936a4.915 4.915 0 0 0-.881-.61l-.012-.006h-.002A.5.5 0 0 1 10 7V2a.5.5 0 0 1 .295-.458 1.775 1.775 0 0 0 .351-.271c.08-.08.155-.17.214-.271H5.14c.06.1.133.191.214.271a1.78 1.78 0 0 0 .37.282"></path>
</svg></div>
<div class="px-2">
<h6 class="mb-0">Мы находимся:</h6>
<p class="mb-0">Чолланамдо, Кванджу</p>
</div>
<div class="contact-title">Email</div>
<div class="contact-info">
<a href="mailto:{{ contact_info.email }}">{{ contact_info.email }}</a>
</div>
</div>
</div>
<div class="col-md-6 col-lg-5 col-xl-4">
<div></div>
<h1>О нас</h1>
<p>Мы - команда профессионалов в своей отрасли. В нашей команде есть все, программисты, сетевые инженеры, системные администраторы, </p>
<!-- Phone Card -->
<div class="col-lg-4 col-md-6">
<div class="contact-card">
<div class="contact-icon">
<i class="fas fa-phone"></i>
</div>
<div class="contact-title">Телефон</div>
<div class="contact-info">
<a href="tel:{{ contact_info.phone }}">{{ contact_info.phone }}</a>
</div>
<div class="working-hours-badge">{{ contact_info.working_hours }}</div>
</div>
</div>
<!-- Telegram Card -->
<div class="col-lg-4 col-md-6">
<div class="contact-card">
<div class="contact-icon">
<i class="fab fa-telegram"></i>
</div>
<div class="contact-title">Telegram</div>
<div class="contact-info">
<a href="https://t.me/{{ contact_info.telegram|cut:'@' }}" target="_blank">{{ contact_info.telegram }}</a>
</div>
</div>
</div>
<!-- Address Card -->
<div class="col-lg-6 col-md-6">
<div class="contact-card">
<div class="contact-icon">
<i class="fas fa-map-marker-alt"></i>
</div>
<div class="contact-title">Мы находимся</div>
<div class="contact-info">
{{ contact_info.address }}
</div>
</div>
</div>
<!-- Company Card -->
<div class="col-lg-6 col-md-6">
<div class="contact-card">
<div class="contact-icon">
<i class="fas fa-building"></i>
</div>
<div class="contact-title">Компания</div>
<div class="contact-info">
{{ contact_info.company_name }}
</div>
</div>
</div>
</div>
<!-- Description Section -->
<div class="row">
<div class="col-12">
<div class="description-card">
<h3>О нашей компании</h3>
<p>{{ contact_info.description }}</p>
</div>
</div>
</div>
</div>
</section>
<!-- CTA Section -->
<section class="cta-section">
<div class="container">
<h2 class="cta-title">Начнем сотрудничество</h2>
<p class="cta-subtitle">Готовы воплотить ваш проект в жизнь</p>
<a href="{% url 'services' %}" class="cta-button">
<i class="fas fa-rocket me-2"></i>Посмотреть наши услуги
</a>
</div>
</section>
{% endblock %}

View File

@@ -1,29 +1,30 @@
{% load static %}
<!-- web/templates/web/base.html - Legacy redirected to modern version -->
<!DOCTYPE html>
<html lang="ko">
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{% block title %}SmartSolTech - IT Solutions{% endblock %}</title>
<meta name="description" content="SmartSolTech - Технологические решения для вашего бизнеса">
<meta name="keywords" content="веб-разработка, мобильные приложения, IT консалтинг">
<title>{% block title %}SmartSolTech - Технологические решения{% endblock %}</title>
<!-- Bootstrap CSS -->
<!-- Bootstrap 5 CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<!-- Custom Modern Styles -->
<!-- Custom CSS -->
<link rel="stylesheet" href="{% static 'assets/css/styles.min.css' %}">
<link rel="stylesheet" href="{% static 'assets/css/modern-styles.css' %}">
<link rel="stylesheet" href="{% static 'assets/css/modal-styles.css' %}">
<!-- PWA Manifest -->
<link rel="manifest" href="/static/manifest.json">
<!-- Modal Init Script -->
<script src="{% static 'assets/js/modal-init.js' %}"></script>
<!-- Favicon -->
<link rel="icon" type="image/png" href="{% static 'assets/img/favicon.png' %}">
<!-- Extra Styles Block -->
{% block extra_styles %}{% endblock %}
</head>
<body class="modern-body">
@@ -37,25 +38,23 @@
</div>
<!-- Navigation -->
{% include 'web/navbar_modern.html' %}
{% include 'web/navbar.html' %}
<!-- Main Content -->
<main class="main-content">
<div class="container-modern mt-4">
{% block content %}{% endblock %}
</div>
{% block content %}{% endblock %}
</main>
<!-- Footer -->
{% include 'web/footer_modern.html' %}
{% include 'web/footer.html' %}
<!-- Bootstrap JS -->
<!-- Bootstrap 5 JS -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
<!-- Custom Modern Scripts -->
<!-- Custom JS -->
<script src="{% static 'assets/js/script.min.js' %}"></script>
<script src="{% static 'assets/js/modern-scripts.js' %}"></script>
<!-- Extra Scripts Block -->
{% block extra_scripts %}{% endblock %}
<!-- Emergency Loading Screen Script -->

View File

@@ -1,4 +1,4 @@
{% extends 'web/base_modern.html' %}
{% extends 'web/base.html' %}
{% block content %}
<h2>Мои заказы</h2>

View File

@@ -1,4 +1,4 @@
{% extends 'web/base_modern.html' %}
{% extends 'web/base.html' %}
<!-- web/templates/web/complete_registration_basic.html -->
{% load static %}

View File

@@ -1,4 +1,4 @@
{% extends 'web/base_modern.html' %}
{% extends 'web/base.html' %}
<!-- web/templates/web/complete_registration_basic.html -->
{% load static %}

View File

@@ -1,48 +1,189 @@
<!-- web/templates/web/footer.html -->
{% load static %}
<footer class="text-light bg-dark pt-5 pb-4">
<div class="container text-md-left">
<div class="row text-md-left">
<div class="col-md-3 col-lg-3 col-xl-3 mx-auto mt-3">
<h5 class="text-uppercase text-warning mb-4 font-weight-bold">SmartSolTech</h5>
<p>Future begins here...</p>
{% load static %}
<footer class="bg-dark text-light section-padding mt-5">
<div class="container-modern">
<div class="row g-4">
<!-- Company Info -->
<div class="col-lg-4 col-md-6">
<div class="mb-4">
<h4 class="text-gradient mb-3">
<i class="fas fa-code me-2"></i>
SmartSolTech
</h4>
<p class="text-light opacity-75 mb-4">
Мы создаем инновационные IT-решения, которые помогают бизнесу расти и развиваться в цифровую эпоху.
</p>
<div class="d-flex gap-3">
<a href="#" class="btn btn-outline-light rounded-circle" style="width: 45px; height: 45px;">
<i class="fab fa-telegram-plane"></i>
</a>
<a href="#" class="btn btn-outline-light rounded-circle" style="width: 45px; height: 45px;">
<i class="fab fa-instagram"></i>
</a>
<a href="#" class="btn btn-outline-light rounded-circle" style="width: 45px; height: 45px;">
<i class="fab fa-linkedin-in"></i>
</a>
<a href="#" class="btn btn-outline-light rounded-circle" style="width: 45px; height: 45px;">
<i class="fab fa-github"></i>
</a>
</div>
</div>
</div>
<div class="col-md-2 col-lg-2 col-xl-2 mx-auto mt-3">
<h5 class="text-uppercase text-warning mb-4 font-weight-bold">Products</h5>
<p><a class="text-light" href="#" style="text-decoration: none;">Product 1</a></p>
<p><a class="text-light" href="#" style="text-decoration: none;">Product 2</a></p>
<p><a class="text-light" href="#" style="text-decoration: none;">Product 3</a></p>
<p><a class="text-light" href="#" style="text-decoration: none;">Product 4</a></p>
<!-- Services -->
<div class="col-lg-2 col-md-6">
<h5 class="mb-3 text-light">Услуги</h5>
<ul class="list-unstyled">
<li class="mb-2">
<a href="{% url 'services' %}" class="text-light opacity-75 text-decoration-none hover-primary">
Веб-разработка
</a>
</li>
<li class="mb-2">
<a href="{% url 'services' %}" class="text-light opacity-75 text-decoration-none hover-primary">
Мобильные приложения
</a>
</li>
<li class="mb-2">
<a href="{% url 'services' %}" class="text-light opacity-75 text-decoration-none hover-primary">
UI/UX Дизайн
</a>
</li>
<li class="mb-2">
<a href="{% url 'services' %}" class="text-light opacity-75 text-decoration-none hover-primary">
DevOps
</a>
</li>
</ul>
</div>
<div class="col-md-3 col-lg-2 col-xl-2 mx-auto mt-3">
<h5 class="text-uppercase text-warning mb-4 font-weight-bold">Usefu links:</h5>
<p><a class="text-light" href="#" style="text-decoration: none;">Your Account</a></p>
<p><a class="text-light" href="#" style="text-decoration: none;">Become an Affiliate</a></p>
<p><a class="text-light" href="#" style="text-decoration: none;">Shipping Rates</a></p>
<p><a class="text-light" href="#" style="text-decoration: none;">Help</a></p>
<!-- Company -->
<div class="col-lg-2 col-md-6">
<h5 class="mb-3 text-light">Компания</h5>
<ul class="list-unstyled">
<li class="mb-2">
<a href="{% url 'about' %}" class="text-light opacity-75 text-decoration-none hover-primary">
О нас
</a>
</li>
<li class="mb-2">
<a href="#" class="text-light opacity-75 text-decoration-none hover-primary">
Портфолио
</a>
</li>
<li class="mb-2">
<a href="#" class="text-light opacity-75 text-decoration-none hover-primary">
Команда
</a>
</li>
<li class="mb-2">
<a href="#" class="text-light opacity-75 text-decoration-none hover-primary">
Карьера
</a>
</li>
</ul>
</div>
<div class="col-md-4 col-lg-3 col-xl-3 mx-auto mt-3">
<h5 class="text-uppercase text-warning mb-4 font-weight-bold">Contact</h5>
<p><i class="fas fa-home mr-3"></i> Gwangju-si Cheollanam-do, Republic of Korea</p>
<p><i class="fas fa-envelope mr-3"></i> a.choi@smartsoltech.kr</p>
<p><i class="fas fa-phone mr-3"></i> + 8 (210) 5693 6103</p>
<!-- Contact Info -->
<div class="col-lg-4 col-md-6">
<h5 class="mb-3 text-light">Контакты</h5>
<div class="mb-3">
<div class="d-flex align-items-center mb-2">
<i class="fas fa-envelope me-3 text-primary"></i>
<a href="mailto:info@smartsoltech.kr" class="text-light opacity-75 text-decoration-none hover-primary">
a.choi@smartsoltech.kr
</a>
</div>
<div class="d-flex align-items-center mb-2">
<i class="fas fa-phone me-3 text-primary"></i>
<a href="tel:+82-10-5693-6103" class="text-light opacity-75 text-decoration-none hover-primary">
+82-10-5693-6103
</a>
</div>
<div class="d-flex align-items-start mb-2">
<i class="fas fa-map-marker-alt me-3 text-primary mt-1"></i>
<span class="text-light opacity-75">
Gwangju, South Korea
</span>
</div>
</div>
<!-- Newsletter -->
<div class="mt-4">
<h6 class="text-light mb-2">Подписаться на новости</h6>
<form class="d-flex">
<input type="email" class="form-control me-2 bg-transparent border-light text-light"
placeholder="Ваш email" style="border-radius: 10px;">
<button type="submit" class="btn btn-primary-modern">
<i class="fas fa-paper-plane"></i>
</button>
</form>
</div>
</div>
</div>
<hr class="mb-4" />
<hr class="my-5 border-light opacity-25">
<!-- Copyright -->
<div class="row align-items-center">
<div class="col-md-7 col-lg-8">
<p class="text-md-left">© 2024 SmartSolTech. All rights reserved.</p>
<div class="col-md-6">
<p class="mb-0 text-light opacity-75">
© 2025 SmartSolTech. Все права защищены.
</p>
</div>
<div class="col-md-5 col-lg-4">
<div class="text-md-right">
<ul class="list-unstyled list-inline">
<li class="list-inline-item"><a class="btn-floating btn-sm text-light" href="#" style="font-size: 23px;"><i class="fab fa-facebook"></i></a></li>
<li class="list-inline-item"><a class="btn-floating btn-sm text-light" href="#" style="font-size: 23px;"><i class="fab fa-twitter"></i></a></li>
<li class="list-inline-item"><a class="btn-floating btn-sm text-light" href="#" style="font-size: 23px;"><i class="fab fa-google-plus"></i></a></li>
<li class="list-inline-item"><a class="btn-floating btn-sm text-light" href="#" style="font-size: 23px;"><i class="fab fa-linkedin-in"></i></a></li>
<div class="col-md-6">
<div class="d-md-flex justify-content-md-end">
<ul class="list-inline mb-0">
<li class="list-inline-item">
<a href="#" class="text-light opacity-75 text-decoration-none hover-primary small">
Политика конфиденциальности
</a>
</li>
<li class="list-inline-item ms-3">
<a href="#" class="text-light opacity-75 text-decoration-none hover-primary small">
Условия использования
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</footer>
</footer>
<style>
.hover-primary {
transition: all 0.3s ease;
}
.hover-primary:hover {
color: var(--primary-color) !important;
opacity: 1 !important;
}
footer {
background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%) !important;
position: relative;
}
footer::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="dots" width="10" height="10" patternUnits="userSpaceOnUse"><circle cx="5" cy="5" r="0.5" fill="%236366f1" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23dots)"/></svg>');
opacity: 0.3;
}
footer .container-modern {
position: relative;
z-index: 1;
}
.btn-outline-light:hover {
background: var(--gradient-primary) !important;
border-color: transparent !important;
transform: translateY(-2px);
}
</style>

View File

@@ -1,20 +0,0 @@
<!-- web/templates/web/header.html -->
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" href="{% url 'home' %}">Smartsoltech</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="{% url 'home' %}">Главная</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'services' %}">Услуги</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{% url 'about' %}">Контакты</a>
</li>
</ul>
</div>
</nav>

View File

@@ -1,6 +1,226 @@
<!-- web/templates/web/home.html -->
{% extends 'web/base_modern.html' %}
{% load static %}
{% block title %}SmartSolTech - Инновационные технологические решения{% endblock %}
{% block content %}
<!-- Hero Section with Modern Carousel -->
<section class="hero-modern">
{% if hero_banners %}
<div id="heroCarousel" class="carousel slide" data-bs-ride="carousel" data-bs-interval="5000">
<div class="carousel-inner">
{% for banner in hero_banners %}
<div class="carousel-item {% if forloop.first %}active{% endif %}">
{% if banner.video %}
<video class="hero-video" muted autoplay loop playsinline
{% if banner.video_poster %}poster="{{ banner.video_poster.url }}"{% endif %}>
<source src="{{ banner.video.url }}" type="video/mp4">
{% if banner.image %}
<img src="{{ banner.image.url }}" alt="{{ banner.title }}" class="hero-fallback">
{% endif %}
</video>
{% elif banner.image %}
<img src="{{ banner.image.url }}" alt="{{ banner.title }}" class="hero-image">
{% endif %}
<div class="hero-overlay"></div>
<div class="hero-content">
<div class="container-modern">
<div class="row align-items-center justify-content-center text-center">
<div class="col-lg-8">
<h1 class="hero-title">{{ banner.title }}</h1>
<p class="hero-subtitle">{{ banner.subtitle }}</p>
{% if banner.button_text and banner.button_url %}
<a href="{{ banner.button_url }}" class="btn btn-primary-modern btn-lg mt-4">
{{ banner.button_text }}
</a>
{% endif %}
</div>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
<!-- Modern Pill Indicators -->
{% if hero_banners|length > 1 %}
<div class="hero-indicators">
<div class="pill-container">
{% for banner in hero_banners %}
<button type="button"
data-bs-target="#heroCarousel"
data-bs-slide-to="{{ forloop.counter0 }}"
class="pill-indicator {% if forloop.first %}active{% endif %}"
aria-current="{% if forloop.first %}true{% endif %}"
aria-label="Slide {{ forloop.counter }}"></button>
{% endfor %}
</div>
</div>
{% endif %}
</div>
{% else %}
<!-- Default Hero when no banners -->
<div class="hero-default">
<div class="hero-overlay"></div>
<div class="hero-content">
<div class="container-modern">
<div class="row align-items-center justify-content-center text-center">
<div class="col-lg-8">
<h1 class="hero-title">SmartSolTech</h1>
<p class="hero-subtitle">Инновационные технологические решения для вашего бизнеса</p>
<a href="{% url 'services' %}" class="btn btn-primary-modern btn-lg mt-4">
Наши услуги
</a>
</div>
</div>
</div>
</div>
</div>
{% endif %}
</section>
<!-- Services Preview -->
<section class="section-padding">
<div class="container-modern">
<div class="text-center mb-5">
<h2 class="display-6 fw-bold mb-4">
Наши <span class="text-gradient">услуги</span>
</h2>
<p class="lead text-muted">
Предоставляем полный спектр IT-решений
</p>
</div>
<div class="row g-4">
{% for service in services %}
<div class="col-lg-4 col-md-6">
<div class="card-modern h-100">
<div class="card-body text-center">
<div class="service-icon mb-3">
<i class="fas fa-code text-primary"></i>
</div>
<h5 class="mb-3">{{ service.name }}</h5>
<p class="text-muted mb-4">{{ service.description|truncatewords:15 }}</p>
<a href="{% url 'service_detail' service.pk %}" class="btn btn-outline-primary">
Подробнее
</a>
</div>
</div>
</div>
{% endfor %}
</div>
<div class="text-center mt-5">
<a href="{% url 'services' %}" class="btn btn-primary-modern btn-lg">
Все услуги
</a>
</div>
</div>
</section>
<!-- About Preview -->
<section class="section-padding bg-light">
<div class="container-modern">
<div class="row g-5 align-items-center">
<div class="col-lg-6">
<h2 class="display-6 fw-bold mb-4">
О <span class="text-gradient">SmartSolTech</span>
</h2>
<p class="lead mb-4">
Мы - команда профессионалов, специализирующихся на создании
инновационных технологических решений для бизнеса.
</p>
<div class="row g-3 mb-4">
<div class="col-sm-6">
<div class="d-flex align-items-center">
<i class="fas fa-check-circle text-success me-3"></i>
<span>Индивидуальный подход</span>
</div>
</div>
<div class="col-sm-6">
<div class="d-flex align-items-center">
<i class="fas fa-check-circle text-success me-3"></i>
<span>Современные технологии</span>
</div>
</div>
<div class="col-sm-6">
<div class="d-flex align-items-center">
<i class="fas fa-check-circle text-success me-3"></i>
<span>Качественная поддержка</span>
</div>
</div>
<div class="col-sm-6">
<div class="d-flex align-items-center">
<i class="fas fa-check-circle text-success me-3"></i>
<span>Соблюдение сроков</span>
</div>
</div>
</div>
<a href="{% url 'about' %}" class="btn btn-primary-modern">
Узнать больше
</a>
</div>
<div class="col-lg-6">
<div class="position-relative">
<img src="{% static 'assets/img/about-preview.jpg' %}"
class="img-fluid rounded-4 shadow-lg"
alt="О нас">
</div>
</div>
</div>
</div>
</section>
<!-- CTA Section -->
<section class="section-padding bg-gradient text-white">
<div class="container-modern text-center">
<div class="row justify-content-center">
<div class="col-lg-8">
<h2 class="display-6 fw-bold mb-4">
Готовы воплотить ваши идеи в жизнь?
</h2>
<p class="lead mb-5 opacity-90">
Свяжитесь с нами для бесплатной консультации
</p>
<div class="d-flex flex-wrap gap-3 justify-content-center">
<button class="btn btn-light btn-lg text-primary"
onclick="openServiceModal(0, 'Консультация')">
<i class="fas fa-comments me-2"></i>
Бесплатная консультация
</button>
<a href="{% url 'services' %}" class="btn btn-outline-light btn-lg">
<i class="fas fa-th-large me-2"></i>
Наши услуги
</a>
</div>
</div>
</div>
</div>
</section>
<!-- Include Modal -->
{% include 'web/modal_order_form.html' %}
{% endblock %}
{% block extra_scripts %}
<script>
// Hero carousel enhancements
document.addEventListener('DOMContentLoaded', function() {
const carousel = document.querySelector('#heroCarousel');
if (carousel) {
const indicators = document.querySelectorAll('.pill-indicator');
carousel.addEventListener('slide.bs.carousel', function(e) {
indicators.forEach((indicator, index) => {
indicator.classList.toggle('active', index === e.to);
});
});
}
});
</script>
{% endblock %}
{% load static %}
{% block title %}SmartSolTech - IT Solutions{% endblock %}
{% block content %}

View File

@@ -1,99 +1,157 @@
{% load static %}
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<title>Модальное окно для заявки на услугу</title>
<style>
/* Стили для модального окна */
.modal {
display: none;
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgba(0, 0, 0, 0.4);
}
.modal-content {
background-color: #fefefe;
margin: 15% auto;
padding: 20px;
border: 1px solid #888;
width: 80%;
max-width: 600px;
}
<!-- Modern Service Request Modal -->
<div class="modal fade" id="serviceModal" tabindex="-1" aria-labelledby="serviceModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content border-0 shadow-lg">
<div class="modal-header bg-gradient text-white border-0">
<h5 class="modal-title" id="serviceModalLabel">
<i class="fas fa-paper-plane me-2"></i>
Заказать услугу
</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body p-4">
<form id="serviceRequestForm">
{% csrf_token %}
<input type="hidden" id="serviceId" name="service_id">
<div class="row g-3">
<div class="col-md-6">
<label for="firstName" class="form-label">Имя *</label>
<input type="text" class="form-control" id="firstName" name="first_name" required>
</div>
<div class="col-md-6">
<label for="lastName" class="form-label">Фамилия *</label>
<input type="text" class="form-control" id="lastName" name="last_name" required>
</div>
<div class="col-md-6">
<label for="email" class="form-label">Email *</label>
<input type="email" class="form-control" id="email" name="email" required>
</div>
<div class="col-md-6">
<label for="phone" class="form-label">Телефон</label>
<input type="tel" class="form-control" id="phone" name="phone">
</div>
<div class="col-12">
<label for="description" class="form-label">Описание проекта *</label>
<textarea class="form-control" id="description" name="description" rows="4"
placeholder="Опишите ваш проект, цели и требования..." required></textarea>
</div>
<div class="col-md-6">
<label for="budget" class="form-label">Примерный бюджет</label>
<select class="form-select" id="budget" name="budget">
<option value="">Не определен</option>
<option value="1000-5000">₩ 1,000,000 - 5,000,000</option>
<option value="5000-10000">₩ 5,000,000 - 10,000,000</option>
<option value="10000+">₩ 10,000,000+</option>
</select>
</div>
<div class="col-md-6">
<label for="timeline" class="form-label">Желаемые сроки</label>
<select class="form-select" id="timeline" name="timeline">
<option value="">Не определены</option>
<option value="urgent">Срочно (1-2 недели)</option>
<option value="normal">Обычно (1-2 месяца)</option>
<option value="flexible">Гибкие сроки</option>
</select>
</div>
</div>
<!-- QR Code Section (Hidden by default) -->
<div class="mt-4" id="qrCodeSection" style="display: none;">
<div class="alert alert-info text-center">
<h6><i class="fas fa-qrcode me-2"></i>Завершите регистрацию через Telegram</h6>
<p class="mb-3">Отсканируйте QR-код или перейдите по ссылке для подтверждения заявки:</p>
<div class="d-flex justify-content-center mb-3">
<img id="qrCodeImage" src="" alt="QR Code" class="img-fluid border rounded" style="max-width: 200px; min-width: 200px; height: 200px; object-fit: contain; display: none;">
</div>
<div class="mb-3">
<a id="telegramLink" href="" target="_blank" class="btn btn-info">
<i class="fab fa-telegram-plane me-2"></i>Открыть в Telegram
</a>
</div>
<div class="d-flex align-items-center justify-content-center">
<div class="spinner-border spinner-border-sm text-primary me-2" role="status" aria-hidden="true"></div>
<small class="text-muted">Ожидаем подтверждения в Telegram...</small>
</div>
</div>
</div>
.close {
color: #aaa;
float: right;
font-size: 28px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: #000;
text-decoration: none;
cursor: pointer;
}
#qrCodeImg {
display: none;
margin: 20px auto;
width: 200px;
height: 200px;
}
</style>
</head>
<body>
<!-- Модальное окно -->
<div id="serviceModal" class="modal">
<div class="modal-content">
<span class="close">&times;</span>
<form id="serviceRequestForm">
<div class="form-group">
<label for="clientName">Ваше имя:</label>
<input type="text" class="form-control" id="clientName" name="client_name" required>
<!-- Success Animation Section (Hidden by default) -->
<div class="mt-4" id="successSection" style="display: none;">
<div class="text-center py-5">
<div class="success-checkmark">
<div class="check-icon">
<span class="icon-line line-tip"></span>
<span class="icon-line line-long"></span>
<div class="icon-circle"></div>
<div class="icon-fix"></div>
</div>
</div>
<h4 class="text-success mt-3 mb-2">Заявка подана успешно!</h4>
<p class="text-muted">Мы свяжемся с вами в ближайшее время</p>
</div>
</div>
<div class="mt-4">
<div class="form-check">
<input class="form-check-input" type="checkbox" id="agreeTerms" required>
<label class="form-check-label small" for="agreeTerms">
Я соглашаюсь с <a href="#" class="text-primary">условиями обработки персональных данных</a>
</label>
</div>
</div>
</form>
</div>
<div class="form-group">
<label for="clientEmail">Ваш email:</label>
<input type="email" class="form-control" id="clientEmail" name="client_email" required>
<div class="modal-footer border-0">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Отмена</button>
<button type="submit" form="serviceRequestForm" class="btn btn-primary-modern">
<i class="fas fa-paper-plane me-2"></i>
Отправить заявку
</button>
</div>
<div class="form-group">
<label for="clientPhone">Ваш телефон:</label>
<input type="text" class="form-control" id="clientPhone" name="client_phone" required pattern="^\+?[0-9\s\-]{7,15}$">
</div>
<div class="form-group">
<label for="description">Описание заявки:</label>
<textarea class="form-control" id="description" name="description" required></textarea>
</div>
<div id="qrCodeContainer">
<p>QR-код для завершения регистрации:</p>
<img id="qrCodeImg" src="" alt="QR Code">
</div>
<button type="button" id="generateQrButton" class="btn btn-primary">Продолжить</button>
</form>
</div>
</div>
</div>
<div id="confirmationModal" class="modal">
<div class="modal-content">
<span class="close">&times;</span>
<h4>Заявка успешно создана!</h4>
<p>Ваши данные были отправлены и заявка зарегистрирована. Пожалуйста, проверьте ваш Telegram для получения подтверждения.</p>
</div>
</div>
<script>
// Service modal function
function openServiceModal(serviceId, serviceName) {
document.getElementById('serviceId').value = serviceId;
document.getElementById('serviceModalLabel').innerHTML =
'<i class="fas fa-paper-plane me-2"></i>Заказать услугу: ' + serviceName;
const modal = new bootstrap.Modal(document.getElementById('serviceModal'));
modal.show();
}
<script <script src="{% static 'assets/js/modal-init.js' %}"> </script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
</body>
</html>
// Form submission handling
document.addEventListener('DOMContentLoaded', function() {
const form = document.getElementById('serviceRequestForm');
if (form) {
form.addEventListener('submit', function(e) {
e.preventDefault();
const formData = new FormData(this);
const submitBtn = document.querySelector('button[type="submit"][form="serviceRequestForm"]');
const originalContent = submitBtn.innerHTML;
submitBtn.innerHTML = '<i class="fas fa-spinner fa-spin me-2"></i>Отправляем...';
submitBtn.disabled = true;
// Get CSRF token
const csrfToken = document.querySelector('[name=csrfmiddlewaretoken]').value;
// Submit form logic would go here
// This is a placeholder for the actual submission logic
// Reset button after delay (placeholder)
setTimeout(() => {
submitBtn.innerHTML = originalContent;
submitBtn.disabled = false;
}, 2000);
});
}
});
</script>

View File

@@ -1,14 +1,127 @@
{% load static %}
<nav class="navbar navbar-expand-md bg-dark py-3" data-bs-theme="dark">
<div class="container"><a class="navbar-brand d-flex align-items-center" href="/"><span class="bs-icon-sm bs-icon-rounded bs-icon-primary d-flex justify-content-center align-items-center me-2 bs-icon"><svg class="bi bi-bezier" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M0 10.5A1.5 1.5 0 0 1 1.5 9h1A1.5 1.5 0 0 1 4 10.5v1A1.5 1.5 0 0 1 2.5 13h-1A1.5 1.5 0 0 1 0 11.5zm1.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zm10.5.5A1.5 1.5 0 0 1 13.5 9h1a1.5 1.5 0 0 1 1.5 1.5v1a1.5 1.5 0 0 1-1.5 1.5h-1a1.5 1.5 0 0 1-1.5-1.5zm1.5-.5a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5zM6 4.5A1.5 1.5 0 0 1 7.5 3h1A1.5 1.5 0 0 1 10 4.5v1A1.5 1.5 0 0 1 8.5 7h-1A1.5 1.5 0 0 1 6 5.5zM7.5 4a.5.5 0 0 0-.5.5v1a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-1a.5.5 0 0 0-.5-.5z"></path>
<path d="M6 4.5H1.866a1 1 0 1 0 0 1h2.668A6.517 6.517 0 0 0 1.814 9H2.5c.123 0 .244.015.358.043a5.517 5.517 0 0 1 3.185-3.185A1.503 1.503 0 0 1 6 5.5zm3.957 1.358A1.5 1.5 0 0 0 10 5.5v-1h4.134a1 1 0 1 1 0 1h-2.668a6.517 6.517 0 0 1 2.72 3.5H13.5c-.123 0-.243.015-.358.043a5.517 5.517 0 0 0-3.185-3.185z"></path>
</svg></span><span>SmartSolTech</span></a><button class="navbar-toggler" data-bs-toggle="collapse" data-bs-target="#navcol-5"><span class="visually-hidden">Toggle navigation</span><span class="navbar-toggler-icon"></span></button>
<div id="navcol-5" class="collapse navbar-collapse">
<nav class="navbar navbar-expand-lg navbar-modern">
<div class="container-modern">
<a class="navbar-brand-modern" href="{% url 'home' %}">
<i class="fas fa-code me-2"></i>
SmartSolTech
</a>
<button class="navbar-toggler border-0" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Переключить навигацию">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item"><a class="nav-link active" href="{% url 'services' %}">Услуги</a></li>
<li class="nav-item"><a class="nav-link" href="{% url 'about' %}">О нас</a></li>
<li class="nav-item">
<a class="nav-link-modern {% if request.resolver_match.url_name == 'home' %}active{% endif %}"
href="{% url 'home' %}">
<i class="fas fa-home me-2"></i>Главная
</a>
</li>
<li class="nav-item">
<a class="nav-link-modern {% if request.resolver_match.url_name == 'services' %}active{% endif %}"
href="{% url 'services' %}">
<i class="fas fa-cog me-2"></i>Услуги
</a>
</li>
<li class="nav-item">
<a class="nav-link-modern {% if request.resolver_match.url_name == 'about' %}active{% endif %}"
href="{% url 'about' %}">
<i class="fas fa-info-circle me-2"></i>О нас
</a>
</li>
<li class="nav-item">
<a class="nav-link-modern" href="#contact">
<i class="fas fa-envelope me-2"></i>Контакты
</a>
</li>
<li class="nav-item ms-3">
<a class="btn btn-primary-modern" href="{% url 'services' %}">
<i class="fas fa-rocket me-2"></i>Начать проект
</a>
</li>
</ul>
</div>
</div>
</nav>
</nav>
<style>
.navbar-toggler {
position: relative;
width: 40px;
height: 40px;
border: none !important;
outline: none !important;
box-shadow: none !important;
}
.navbar-toggler:focus {
box-shadow: none !important;
}
.navbar-toggler-icon {
display: block;
width: 25px;
height: 2px;
background-color: var(--text-dark);
position: relative;
transition: all 0.3s ease;
margin: auto;
}
.navbar-toggler-icon::before,
.navbar-toggler-icon::after {
content: '';
position: absolute;
width: 25px;
height: 2px;
background-color: var(--text-dark);
transition: all 0.3s ease;
}
.navbar-toggler-icon::before {
top: -8px;
}
.navbar-toggler-icon::after {
top: 8px;
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
background-color: transparent;
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before {
transform: rotate(45deg);
top: 0;
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::after {
transform: rotate(-45deg);
top: 0;
}
@media (max-width: 991.98px) {
.navbar-collapse {
margin-top: 1rem;
padding: 1.5rem;
background: var(--bg-light);
border-radius: 16px;
border: 1px solid var(--border-color);
box-shadow: var(--shadow);
}
.nav-link-modern {
padding: 0.75rem 1rem;
margin: 0.25rem 0;
border-radius: 12px;
}
.btn-primary-modern {
margin-top: 1rem;
width: 100%;
justify-content: center;
}
}
</style>

View File

@@ -1,4 +1,4 @@
{% extends 'web/base_modern.html' %}
{% extends 'web/base.html' %}
{% load static %}
{% block content %}

View File

@@ -1,4 +1,4 @@
{% extends 'web/base_modern.html' %}
{% extends 'web/base.html' %}
{% block content %}
<h2>Детали заказа</h2>

View File

@@ -1,4 +1,4 @@
{% extends 'web/base_modern.html' %}
{% extends 'web/base.html' %}
{% block content %}
<div class="container mt-4">

View File

@@ -173,83 +173,7 @@
</section>
<!-- Service Request Modal -->
<div class="modal fade" id="serviceModal" tabindex="-1" aria-labelledby="serviceModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content border-0 shadow-lg">
<div class="modal-header bg-gradient text-white border-0">
<h5 class="modal-title" id="serviceModalLabel">
<i class="fas fa-paper-plane me-2"></i>
Заказать услугу
</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body p-4">
<form id="serviceRequestForm">
{% csrf_token %}
<input type="hidden" id="serviceId" name="service_id">
<div class="row g-3">
<div class="col-md-6">
<label for="firstName" class="form-label">Имя *</label>
<input type="text" class="form-control" id="firstName" name="first_name" required>
</div>
<div class="col-md-6">
<label for="lastName" class="form-label">Фамилия *</label>
<input type="text" class="form-control" id="lastName" name="last_name" required>
</div>
<div class="col-md-6">
<label for="email" class="form-label">Email *</label>
<input type="email" class="form-control" id="email" name="email" required>
</div>
<div class="col-md-6">
<label for="phone" class="form-label">Телефон</label>
<input type="tel" class="form-control" id="phone" name="phone">
</div>
<div class="col-12">
<label for="description" class="form-label">Описание проекта *</label>
<textarea class="form-control" id="description" name="description" rows="4"
placeholder="Опишите ваш проект, цели и требования..." required></textarea>
</div>
<div class="col-md-6">
<label for="budget" class="form-label">Примерный бюджет</label>
<select class="form-select" id="budget" name="budget">
<option value="">Не определен</option>
<option value="1000-5000">₩ 1,000,000 - 5,000,000</option>
<option value="5000-10000">₩ 5,000,000 - 10,000,000</option>
<option value="10000+">₩ 10,000,000+</option>
</select>
</div>
<div class="col-md-6">
<label for="timeline" class="form-label">Желаемые сроки</label>
<select class="form-select" id="timeline" name="timeline">
<option value="">Не определены</option>
<option value="urgent">Срочно (1-2 недели)</option>
<option value="normal">Обычно (1-2 месяца)</option>
<option value="flexible">Гибкие сроки</option>
</select>
</div>
</div>
<div class="mt-4">
<div class="form-check">
<input class="form-check-input" type="checkbox" id="agreeTerms" required>
<label class="form-check-label small" for="agreeTerms">
Я соглашаюсь с <a href="#" class="text-primary">условиями обработки персональных данных</a>
</label>
</div>
</div>
</form>
</div>
<div class="modal-footer border-0">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Отмена</button>
<button type="submit" form="serviceRequestForm" class="btn btn-primary-modern">
<i class="fas fa-paper-plane me-2"></i>
Отправить заявку
</button>
</div>
</div>
</div>
</div>
{% include 'web/modal_order_form.html' %}
{% endblock %}
{% block extra_scripts %}
@@ -263,55 +187,6 @@ function openServiceModal(serviceId, serviceName) {
const modal = new bootstrap.Modal(document.getElementById('serviceModal'));
modal.show();
}
// Form submission - simplified version
document.getElementById('serviceRequestForm').addEventListener('submit', function(e) {
e.preventDefault();
const formData = new FormData(this);
const submitBtn = document.querySelector('button[type="submit"][form="serviceRequestForm"]');
const originalContent = submitBtn.innerHTML;
submitBtn.innerHTML = '<i class="fas fa-spinner fa-spin me-2"></i>Отправляем...';
submitBtn.disabled = true;
// Симуляция отправки
setTimeout(() => {
submitBtn.innerHTML = '<i class="fas fa-check me-2"></i>Отправлено!';
submitBtn.classList.remove('btn-primary-modern');
submitBtn.classList.add('btn-success');
setTimeout(() => {
const modal = bootstrap.Modal.getInstance(document.getElementById('serviceModal'));
modal.hide();
showNotification('Заявка отправлена! Мы свяжемся с вами в ближайшее время.', 'success');
// Reset form
this.reset();
submitBtn.innerHTML = originalContent;
submitBtn.disabled = false;
submitBtn.classList.remove('btn-success');
submitBtn.classList.add('btn-primary-modern');
}, 2000);
}, 1500);
});
function showNotification(message, type) {
const notification = document.createElement('div');
notification.className = `alert alert-${type} position-fixed top-0 end-0 m-3`;
notification.style.zIndex = '9999';
notification.innerHTML = `
<i class="fas fa-${type === 'success' ? 'check-circle' : 'exclamation-triangle'} me-2"></i>
${message}
<button type="button" class="btn-close" onclick="this.parentElement.remove()"></button>
`;
document.body.appendChild(notification);
setTimeout(() => {
notification.remove();
}, 5000);
}
</script>
<style>

View File

@@ -1,5 +1,5 @@
from django.shortcuts import render, get_object_or_404, redirect
from .models import Service, Project, Client, BlogPost, Review, Order, ServiceRequest, HeroBanner, Category
from .models import Service, Project, Client, BlogPost, Review, Order, ServiceRequest, HeroBanner, Category, ContactInfo
from django.db.models import Avg
from comunication.models import TelegramSettings
import qrcode
@@ -95,7 +95,8 @@ def services_view(request):
})
def about_view(request):
return render(request, 'web/about_modern.html')
contact_info = ContactInfo.get_active()
return render(request, 'web/about.html', {'contact_info': contact_info})
def portfolio_view(request):
projects = Project.objects.all()