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

Adds arrows to main slider on gallery mode. Adds more classes to customizer colors function.

This commit is contained in:
mateuswetah 2020-05-07 13:26:44 -03:00
parent 53a43114a5
commit 57f6cf1627
4 changed files with 77 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/assets/js/js.js
View File

@ -67,18 +67,20 @@ jQuery( document ).ready(function( $ ) {
$('.single-item-collection--gallery').slick({
slidesToShow: 1,
slidesToScroll: 1,
arrows: false,
arrows: true,
fade: true,
asNavFor: '.single-item-collection--gallery-items'
asNavFor: '.single-item-collection--gallery-items',
prevArrow: '<button type="button" data-role="none" class="single-item-collection--attachments-prev" aria-label="Previous" role="button" style="display: block;"><i class="tainacan-icon tainacan-icon-arrowleft"></i></button>',
nextArrow: '<button type="button" data-role="none" class="single-item-collection--attachments-next" aria-label="Next" role="button" style="display: block;"><i class="tainacan-icon tainacan-icon-arrowright"></i></button>',
});
$( '.single-item-collection--gallery-items' ).slick({
asNavFor: '.single-item-collection--gallery',
prevArrow: '<button type="button" data-role="none" class="single-item-collection--attachments-prev" aria-label="Previous" role="button" style="display: block;"><i class="tainacan-icon tainacan-icon-arrowleft"></i></button>',
nextArrow: '<button type="button" data-role="none" class="single-item-collection--attachments-next" aria-label="Next" role="button" style="display: block;"><i class="tainacan-icon tainacan-icon-arrowright"></i></button>',
arrows: false,
slidesToShow: 7,
slidesToScroll: 1,
infinite: false,
centerMode: false,
focusOnSelect: true,
autoplay: false,
autoplaySpeed: 2000,
@ -136,6 +138,7 @@ jQuery( document ).ready(function( $ ) {
slidesToShow: 7,
slidesToScroll: 1,
autoplay: false,
infinite: true,
autoplaySpeed: 2000,
responsive: [ {
breakpoint: 1330,

94
src/assets/scss/_post.scss
View File

@ -576,6 +576,46 @@
}
}
}
.single-item-collection--attachments-prev,
.single-item-collection--attachments-next {
position: absolute;
display: block;
height: 33px;
width: 45px;
line-height: 0px;
font-size: 3.75rem;
color: #298596;
cursor: pointer;
background: transparent;
top: 50%;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
padding: 0;
border: none;
outline: none;
}
.single-item-collection--attachments-prev {
left: -50px;
@media only screen and (max-width: 380px) {
right: -40px;
}
&.slick-disabled {
display: none;
visibility: hidden;
}
}
.single-item-collection--attachments-next {
right: -50px;
@media only screen and (max-width: 380px) {
right: -40px;
}
&.slick-disabled {
display: none;
visibility: hidden;
}
}
.single-item-collection--gallery {
margin-bottom: 24px;
.slick-list {
@ -601,17 +641,29 @@
.slick-slide {
max-height: 60vh;
}
.single-item-collection--attachments-next .tainacan-icon-arrowright::before {
content: 'next';
}
.single-item-collection--attachments-prev .tainacan-icon-arrowleft::before {
content: 'previous';
}
}
.single-item-collection--gallery-items {
font-weight: normal;
transition: font-weight 0.3s ease;
img {
border-bottom: 4px solid transparent;
margin-bottom: 4px;
transition: border 0.3s ease;
}
.slick-current img {
.slick-current{
font-weight: bold;
img {
border-bottom: 4px solid #298596;
}
}
}
.single-item-collection--attachments-file {
&:hover {
.tainacan-item-file-download {
@ -670,46 +722,6 @@
margin: 0 0 4px 0 !important;
}
}
.single-item-collection--attachments-prev {
left: -50px;
@media only screen and (max-width: 380px) {
right: -40px;
}
&.slick-disabled {
display: none;
visibility: hidden;
}
}
.single-item-collection--attachments-next {
right: -50px;
@media only screen and (max-width: 380px) {
right: -40px;
}
&.slick-disabled {
display: none;
visibility: hidden;
}
}
.single-item-collection--attachments-prev,
.single-item-collection--attachments-next {
position: absolute;
display: block;
height: 33px;
width: 45px;
line-height: 0px;
font-size: 3.75rem;
color: #298596;
cursor: pointer;
background: transparent;
top: 50%;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
padding: 0;
border: none;
outline: none;
}
}
.single-item-collection--information{
.card{

16
src/functions/customizer.php
View File

@ -1356,8 +1356,20 @@ function tainacan_get_color_scheme_css( $colors ) {
fill: {$colors['tainacan_link_color']} !important;
}
.tainacan-single-post .single-item-collection--attachments .single-item-collection--attachments-next,
.tainacan-single-post .single-item-collection--attachments .single-item-collection--attachments-prev {
.tainacan-single-post .single-item-collection--attachments-next,
.tainacan-single-post .single-item-collection--attachments-prev {
color: {$colors['tainacan_link_color']} !important;
}
.tainacan-single-post .single-item-collection .single-item-collection--gallery-items .slick-current img {
border-bottom: 4px solid {$colors['tainacan_link_color']} !important;
}
.tainacan-single-post .single-item-collection .tainacan-item-file-download {
background-color: {$colors['tainacan_link_color']} !important;
}
.tainacan-single-post .title-content-items {
color: {$colors['tainacan_link_color']} !important;
}

2
src/style.css.map
View File

File diff suppressed because one or more lines are too long