Browse Source

little better

slider
_ahmedbilal 2 years ago
parent
commit
47f3bbd826
  1. 2
      templates/blocks/slide.html
  2. 23
      templates/layout-2020.html

2
templates/blocks/slide.html

@ -9,7 +9,7 @@
{% endif %}
<div class="container">
<div class="carousel-caption">
<h3 class="display-4">{{ this.title }}</h5>
<h3 class="display-4">{{ this.title }}</h3>
<p class="lead">
{{ this.description }}
<br>

23
templates/layout-2020.html

@ -44,6 +44,7 @@
<style>
video{
width:100%;
object-fit: cover;
}
.carousel-caption {
@ -55,39 +56,39 @@
/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
.carousel-item {
height: 200px;
.carousel-item img, video {
height: 280px;
}
}
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) {
.carousel-item {
.carousel-item img, video {
height: 300px;
}
}
/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) {
.carousel-item {
.carousel-item img, video {
height: 400px;
}
}
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) {
.carousel-item {
.carousel-item img, video {
height: 450px;
}
}
/* Extra large devices (large desktops, 1200px and up) */
/*
@media (min-width: 1200px) {
.carousel-item {
.carousel-item img, video {
height: 900px;
}
} */
}
</style>
</head>
@ -159,11 +160,7 @@
<div id="head-carousel" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
{% for slide in this.slide.blocks %}
{% if loop.index0 == 0 %}
<li data-target="#head-carousel" data-slide-to="0" class="active"></li>
{% else %}
<li data-target="#head-carousel" data-slide-to="{{ loop.index0 }}"></li>
{% endif %}
{% if loop.index0 == 0 %}<li data-target="#head-carousel" data-slide-to="0" class="active"></li>{% else %}<li data-target="#head-carousel" data-slide-to="{{ loop.index0 }}"></li>{% endif %}
{% endfor %}
</ol>
<div class="carousel-inner">

Loading…
Cancel
Save