little better
This commit is contained in:
parent
1e5c56fb31
commit
47f3bbd826
2 changed files with 11 additions and 14 deletions
|
@ -9,7 +9,7 @@
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="carousel-caption">
|
<div class="carousel-caption">
|
||||||
<h3 class="display-4">{{ this.title }}</h5>
|
<h3 class="display-4">{{ this.title }}</h3>
|
||||||
<p class="lead">
|
<p class="lead">
|
||||||
{{ this.description }}
|
{{ this.description }}
|
||||||
<br>
|
<br>
|
||||||
|
|
|
@ -44,6 +44,7 @@
|
||||||
<style>
|
<style>
|
||||||
video{
|
video{
|
||||||
width:100%;
|
width:100%;
|
||||||
|
object-fit: cover;
|
||||||
}
|
}
|
||||||
|
|
||||||
.carousel-caption {
|
.carousel-caption {
|
||||||
|
@ -55,39 +56,39 @@
|
||||||
|
|
||||||
/* Extra small devices (portrait phones, less than 576px) */
|
/* Extra small devices (portrait phones, less than 576px) */
|
||||||
@media (max-width: 575.98px) {
|
@media (max-width: 575.98px) {
|
||||||
.carousel-item {
|
.carousel-item img, video {
|
||||||
height: 200px;
|
height: 280px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Small devices (landscape phones, 576px and up) */
|
/* Small devices (landscape phones, 576px and up) */
|
||||||
@media (min-width: 576px) and (max-width: 767.98px) {
|
@media (min-width: 576px) and (max-width: 767.98px) {
|
||||||
.carousel-item {
|
.carousel-item img, video {
|
||||||
height: 300px;
|
height: 300px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Medium devices (tablets, 768px and up) */
|
/* Medium devices (tablets, 768px and up) */
|
||||||
@media (min-width: 768px) and (max-width: 991.98px) {
|
@media (min-width: 768px) and (max-width: 991.98px) {
|
||||||
.carousel-item {
|
.carousel-item img, video {
|
||||||
height: 400px;
|
height: 400px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Large devices (desktops, 992px and up) */
|
/* Large devices (desktops, 992px and up) */
|
||||||
@media (min-width: 992px) and (max-width: 1199.98px) {
|
@media (min-width: 992px) and (max-width: 1199.98px) {
|
||||||
.carousel-item {
|
.carousel-item img, video {
|
||||||
height: 450px;
|
height: 450px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Extra large devices (large desktops, 1200px and up) */
|
/* Extra large devices (large desktops, 1200px and up) */
|
||||||
/*
|
|
||||||
@media (min-width: 1200px) {
|
@media (min-width: 1200px) {
|
||||||
.carousel-item {
|
.carousel-item img, video {
|
||||||
height: 900px;
|
height: 900px;
|
||||||
}
|
}
|
||||||
} */
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
@ -159,11 +160,7 @@
|
||||||
<div id="head-carousel" class="carousel slide" data-ride="carousel">
|
<div id="head-carousel" class="carousel slide" data-ride="carousel">
|
||||||
<ol class="carousel-indicators">
|
<ol class="carousel-indicators">
|
||||||
{% for slide in this.slide.blocks %}
|
{% for slide in this.slide.blocks %}
|
||||||
{% if loop.index0 == 0 %}
|
{% 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 %}
|
||||||
<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 %}
|
{% endfor %}
|
||||||
</ol>
|
</ol>
|
||||||
<div class="carousel-inner">
|
<div class="carousel-inner">
|
||||||
|
|
Loading…
Reference in a new issue