tmdinosaurcenter
/
tainacan-theme
mirror of https://github.com/tainacan/tainacan-theme.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Create the Section Carousel highlight images.

This commit is contained in:
Fabiano Alencar 2018-02-15 15:35:52 -02:00
parent ef68e22f83
commit 5ccf4d2cb9
3 changed files with 24 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/assets/scss/_single-colecoes.scss Normal file
View File

@ -0,0 +1,16 @@
.tainacan-img-dest{
.carousel {
.carousel-control-prev{
.prev-play{
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
}
i{
font-size: 45px;
}
}
}

2
src/assets/scss/style.scss
View File

@ -42,4 +42,6 @@ form{
} }
} }
@import "_single-colecoes";
@import "_footer"; @import "_footer";

12
src/single-colecoes.php
View File

@ -50,9 +50,9 @@
<div class="col-12 d-flex border-bottom"> <div class="col-12 d-flex border-bottom">
<h4 class="text-jelly-bean">Imagens em destaque</h4> <span class="text-jelly-bean ml-auto align-self-center">Ver mais</span> <h4 class="text-jelly-bean">Imagens em destaque</h4> <span class="text-jelly-bean ml-auto align-self-center">Ver mais</span>
</div> </div>
<div class="row p-5"> <div class="row p-3 p-md-5">
<div id="carouselExample" class="carousel slide" data-ride="carousel" data-interval="9000"> <div id="carouselExample" class="carousel slide" data-ride="carousel" data-interval="9000">
<div class="carousel-inner row w-100 mx-auto p-5" role="listbox"> <div class="carousel-inner row w-100 mx-auto p-md-5" role="listbox">
<div class="carousel-item col-md-4 p-5 active"> <div class="carousel-item col-md-4 p-5 active">
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400/000/fff?text=1" alt="slide 1"> <img class="img-fluid mx-auto d-block" src="//placehold.it/600x400/000/fff?text=1" alt="slide 1">
</div> </div>
@ -78,12 +78,12 @@
<img class="img-fluid mx-auto d-block" src="//placehold.it/600x400?text=8" alt="slide 7"> <img class="img-fluid mx-auto d-block" src="//placehold.it/600x400?text=8" alt="slide 7">
</div> </div>
</div> </div>
<a class="carousel-control-prev" href="#carouselExample" role="button" data-slide="prev"> <a class="carousel-control-prev text-scooter justify-content-start" href="#carouselExample" role="button" data-slide="prev">
<i class="material-icons">chevron_left</i> <i class="material-icons prev-play">play_arrow</i>
<span class="sr-only">Previous</span> <span class="sr-only">Previous</span>
</a> </a>
<a class="carousel-control-next text-faded" href="#carouselExample" role="button" data-slide="next"> <a class="carousel-control-next text-scooter justify-content-end" href="#carouselExample" role="button" data-slide="next">
<i class="material-icons">chevron_right</i> <i class="material-icons">play_arrow</i>
<span class="sr-only">Next</span> <span class="sr-only">Next</span>
</a> </a>
</div> </div>