homepage carousel is getting slides from web_services table

smartsoltech/static/assets/css/styles.min.css

@@ -213,3 +213,18 @@ ul.main-nav > li ul.sub-menu-lists > li > a {
 .text-muted {
     font-size: 0.8rem; /* Make muted text slightly smaller */
 }
+
+
+.carousel-overlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: rgba(0, 0, 0, 0.5); /* Затемнение */
+    z-index: 1;
+}
+
+.carousel-item img {
+    z-index: -1;
+}

smartsoltech/web/models.py

@@ -1,5 +1,7 @@
 # web/models.py
 from django.db import models
+from django.contrib.auth.models import AbstractUser
+
 
 class Category(models.Model):
     name = models.CharField(max_length=100)
@@ -80,3 +82,17 @@ class Review(models.Model):
 
     def __str__(self):
         return f"Review by {self.client.first_name} {self.client.last_name} for {self.service.name}"
+    
+    COMMUNICATION_METHODS = [
+    ('email', 'Email'),
+    ('telegram', 'Telegram'),
+    ('sms', 'SMS'),
+]
+
+class User(AbstractUser):
+    telegram_id = models.CharField(max_length=50, blank=True, null=True, unique=True)
+    preferred_communication = models.CharField(
+        max_length=20,
+        choices=COMMUNICATION_METHODS,
+        default='email',
+    )

smartsoltech/web/templates/web/home.html

@@ -6,44 +6,30 @@
 {% block content %}
 <div id="carousel-1" class="carousel slide" data-bs-ride="carousel" style="height: 600px;">
     <div class="carousel-inner h-100">
-        <div class="carousel-item active h-100"><img class="w-100 d-block position-absolute h-100 fit-cover" src="{% static 'img/1.png'%}" alt="Slide Image" style="z-index: -1;" />
+        {% for service in services %}
-            <div class="container d-flex flex-column justify-content-center h-100">
+        <div class="carousel-item {% if forloop.first %}active{% endif %} h-100">
+            <div class="carousel-overlay"></div>
+            <img class="w-100 d-block position-absolute h-100 fit-cover" src="{{ service.image.url }}" alt="{{ service.name }}" style="z-index: -1; filter: brightness(0.5);" />
+            <div class="container d-flex flex-column justify-content-center h-100 position-relative" style="z-index: 2;">
                 <div class="row">
                     <div class="col-md-6 col-xl-4 offset-md-2">
                         <div style="max-width: 350px;">
-                            <h1 class="text-uppercase fw-bold">Сайты<br />разработка сайтов</h1>
+                            <h1 class="text-uppercase fw-bold text-white">{{ service.name }}</h1>
-                            <p class="my-3">Tincidunt laoreet leo, adipiscing taciti tempor. Primis senectus sapien, risus donec ad fusce augue interdum.</p><a class="btn btn-primary btn-lg me-2" role="button" href="service/1">Подробнее</a>
+                            <p class="my-3 text-white">{{ service.description }}</p>
-                        </div>
+                            <a class="btn btn-primary btn-lg me-2" role="button" href="{% url 'service_detail' service.pk %}">Подробнее</a>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="carousel-item h-100"><img class="w-100 d-block position-absolute h-100 fit-cover" src="{% static 'img/3.png'%}" alt="Slide Image" style="z-index: -1;" />
-            <div class="container d-flex flex-column justify-content-center h-100">
-                <div class="row">
-                    <div class="col-md-6 col-xl-4 offset-md-2">
-                        <div style="max-width: 350px;">
-                            <h1 class="text-uppercase fw-bold">Biben dum<br />fringi dictum, augue purus</h1>
-                            <p class="my-3">Tincidunt laoreet leo, adipiscing taciti tempor. Primis senectus sapien, risus donec ad fusce augue interdum.</p><a class="btn btn-primary btn-lg me-2" role="button" href="/service/3">Подробее</a>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div class="carousel-item h-100"><img class="w-100 d-block position-absolute h-100 fit-cover" src="{% static 'img/2.png'%}" alt="Slide Image" style="z-index: -1;" />
-            <div class="container d-flex flex-column justify-content-center h-100">
-                <div class="row">
-                    <div class="col-md-6 col-xl-4 offset-md-2">
-                        <div style="max-width: 350px;">
-                            <h1 class="text-uppercase fw-bold">Biben dum<br />fringi dictum, augue purus</h1>
-                            <p class="my-3">Tincidunt laoreet leo, adipiscing taciti tempor. Primis senectus sapien, risus donec ad fusce augue interdum.</p><a class="btn btn-primary btn-lg me-2" role="button" href="#">Button</a><a class="btn btn-outline-primary btn-lg" role="button" href="#">Button</a>
                         </div>
                     </div>
                 </div>
             </div>
         </div>
+        {% endfor %}
     </div>
     <div><a class="carousel-control-prev" href="#carousel-1" role="button" data-bs-slide="prev"><span class="carousel-control-prev-icon"></span><span class="visually-hidden">Previous</span></a><a class="carousel-control-next" href="#carousel-1" role="button" data-bs-slide="next"><span class="carousel-control-next-icon"></span><span class="visually-hidden">Next</span></a></div>
-    <div class="carousel-indicators"><button class="active" type="button" data-bs-target="#carousel-1" data-bs-slide-to="0"></button><button type="button" data-bs-target="#carousel-1" data-bs-slide-to="1"></button><button type="button" data-bs-target="#carousel-1" data-bs-slide-to="2"></button></div>
+    <div class="carousel-indicators">
+        {% for service in services %}
+        <button class="{% if forloop.first %}active{% endif %}" type="button" data-bs-target="#carousel-1" data-bs-slide-to="{{ forloop.counter0 }}"></button>
+        {% endfor %}
+    </div>
 </div>
+<br><br><br>
 {% endblock %}

smartsoltech/web/views.py

@@ -4,7 +4,8 @@ from django.db.models import Avg
 
 
 def home(request):
-    return render(request, 'web/home.html')
+    services = Service.objects.all()
+    return render(request, 'web/home.html', {'services': services})
 
 def service_detail(request, pk):
     service = get_object_or_404(Service, pk=pk)