110 lines
3.6 KiB
HTML
110 lines
3.6 KiB
HTML
{% extends 'programmer/base.html' %}
|
||
{% load django_bootstrap5 %}
|
||
|
||
{% block content %}
|
||
<div class="hero-section fade-in">
|
||
<h1 class="hero-title">🚀 Добро пожаловать!</h1>
|
||
<p class="hero-subtitle">Я профессиональный программист 1С с опытом создания эффективных бизнес-решений</p>
|
||
</div>
|
||
|
||
<div class="grid grid-2">
|
||
{% autoescape off %}
|
||
{% for p in posts %}
|
||
<div class="modern-card fade-in {% cycle '' 'secondary' %}">
|
||
<div class="card-header">
|
||
<h2 class="card-title">{{p.title}}</h2>
|
||
</div>
|
||
<div class="card-content">
|
||
{{p.content}}
|
||
</div>
|
||
<div class="card-actions">
|
||
<button onclick="openModal()" class="btn btn-primary">🎯 Получить консультацию</button>
|
||
</div>
|
||
</div>
|
||
{% endfor %}
|
||
{% endautoescape %}
|
||
</div>
|
||
|
||
<!-- Модальное окно формы -->
|
||
<div id="callbackModal" class="modal">
|
||
<div class="modal-content">
|
||
<div class="modal-header">
|
||
<h3>📞 Заявка на консультацию</h3>
|
||
<button class="modal-close" onclick="closeModal()">×</button>
|
||
</div>
|
||
<div class="modal-body">
|
||
<form method="post" action="{% url 'callback' %}" id="callbackForm">
|
||
{% csrf_token %}
|
||
|
||
<div class="form-group">
|
||
<label for="id_name">Имя *</label>
|
||
{{ form.name }}
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="id_phone">Телефон *</label>
|
||
{{ form.phone }}
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="id_email">Электронная почта</label>
|
||
{{ form.email }}
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="id_question">Ваш вопрос</label>
|
||
{{ form.question }}
|
||
</div>
|
||
|
||
{% if form.captcha %}
|
||
<div class="form-group">
|
||
<label for="id_captcha">Защитный код *</label>
|
||
{{ form.captcha }}
|
||
</div>
|
||
{% endif %}
|
||
|
||
<div class="form-actions">
|
||
<button type="submit" class="btn btn-primary" style="width: 100%;">
|
||
📨 Отправить заявку
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
{% if not posts %}
|
||
<div class="modern-card text-center fade-in">
|
||
<h3>🚀 Контент скоро появится</h3>
|
||
<p class="card-subtitle">Мы готовим для вас интересные материалы и кейсы</p>
|
||
<div class="card-actions justify-center">
|
||
<button onclick="openModal()" class="btn btn-primary">🎯 Получить консультацию</button>
|
||
</div>
|
||
</div>
|
||
{% endif %}
|
||
|
||
<script>
|
||
function openModal() {
|
||
document.getElementById('callbackModal').style.display = 'block';
|
||
}
|
||
|
||
function closeModal() {
|
||
document.getElementById('callbackModal').style.display = 'none';
|
||
}
|
||
|
||
// Закрытие модального окна при клике вне его
|
||
window.onclick = function(event) {
|
||
const modal = document.getElementById('callbackModal');
|
||
if (event.target === modal) {
|
||
closeModal();
|
||
}
|
||
}
|
||
|
||
// Закрытие по ESC
|
||
document.addEventListener('keydown', function(event) {
|
||
if (event.key === 'Escape') {
|
||
closeModal();
|
||
}
|
||
});
|
||
</script>
|
||
{% endblock %} |