Allows multiple rows of footer and improves responsiveness of some footer elements. #39

This commit is contained in:
mateuswetah 2021-04-22 11:11:01 -03:00
parent 1f0e7c45ea
commit c12abc6d6f
4 changed files with 46 additions and 33 deletions

View File

@ -19,6 +19,9 @@ footer {
margin: 0 calc(4.16666666667% * 2);
margin: 0 calc(4.16666666667vw * 2);
}
nav {
border: none;
}
.tainacan-side ul,
.tainacan-side ol {
list-style: inside;
@ -49,6 +52,32 @@ footer {
}
}
}
.gallery {
display: flex;
flex-wrap: wrap;
max-height: 485px;
overflow: hidden;
justify-content: flex-start;
align-items: flex-start;
.gallery-item{
margin: 5px !important;
width: auto !important;
img {
border: none !important;
}
}
.gallery-caption {
display: none;
}
br{
display: none;
}
}
.image {
max-width: 100%;
height: auto;
}
}
.tainacan-footer-info {
font-size: 0.875rem;

View File

@ -144,20 +144,6 @@ footer {
margin: 5px 0 0.5em 0;
}
}
.gallery{
display: grid;
max-height: 485px;
overflow: hidden;
justify-content: center;
.gallery-item{
margin: 5px 0 !important;
}
br{
display: none;
}
}
&{
border-top: 1px solid white;
}
@ -194,7 +180,7 @@ footer {
z-index: 1;
opacity: 0;
&:checked{
&~h6~p, &~h6~div, &~h6~ul, &~h6~img{
&~h6~p, &~h6~div, &~h6~ul, &~h6~img, &~h6~nav, &~h6~form {
margin-top: 0;
max-height: 0;
opacity: 0;
@ -204,7 +190,7 @@ footer {
&~h6{
position: relative;
i:before{
content: "more";
content: "plus";
letter-spacing: normal;
position: absolute;
right: 0;
@ -259,6 +245,7 @@ footer {
margin-right: 4.16666666667%;
margin-right: 4.16666666667vw;
flex-grow: 1;
flex-basis: 18%;
&:last-child{
margin-right: 0;
@ -297,17 +284,7 @@ footer {
.textwidget{
max-width: 200px;
}
.gallery{
display: grid;
max-height: 485px;
overflow: hidden;
.gallery-item{
margin: 5px 0 !important;
}
br{
display: none;
}
}
}
}
}
@ -354,6 +331,12 @@ footer {
}
}
@media only screen and (min-width: 992px) and (max-width: 1280px) {
footer ul li.tainacan-side {
flex-basis: 24%;
}
}
// 1400px is the maximum the inner cointainer should get, so we
// use 1526px - 1 column - 1 column;
@media only screen and (min-width: 1526px){
@ -367,6 +350,9 @@ footer {
padding-left: 2.6rem;
}
}
footer ul li.tainacan-side {
flex-basis: 13%;
}
/* #comments {
#form-comment{
textarea {

View File

@ -2,11 +2,9 @@
<footer class="container-fluid p-4 p-sm-5 mt-5 tainacan-footer <?php echo ('tainacan-footer-' . get_theme_mod( 'tainacan_footer_color', 'dark' )) ?>" style="padding-bottom: 0 !important;">
<?php if ( is_active_sidebar( 'tainacan-sidebar-footer' ) ) { ?>
<div class="row tainacan-footer-widgets-area">
<div class="col-12 col-lg">
<ul class="pt-3 pb-3 pl-0 pr-0 d-lg-flex justify-content-xs-center mb-md-0">
<?php dynamic_sidebar( 'tainacan-sidebar-footer' ); ?>
</ul>
</div>
<ul class="col-12 col-lg pt-3 pb-3 pl-0 pr-0 d-lg-flex flex-wrap justify-content-xs-center mb-md-0">
<?php dynamic_sidebar( 'tainacan-sidebar-footer' ); ?>
</ul>
</div>
<?php } ?>
<hr class="bg-scooter"/>

View File

@ -263,7 +263,7 @@ function tainacan_widgets_footer_init() {
register_sidebar( array(
'name' => __( 'Tainacan Sidebar Footer', 'tainacan-interface' ),
'id' => 'tainacan-sidebar-footer',
'before_widget' => '<li class="border-left-0 border-right-0 tainacan-side"><input type="checkbox" checked><i></i>',
'before_widget' => '<li class="mb-lg-4 border-left-0 border-right-0 border-bottom-0 tainacan-side"><input type="checkbox" checked><i></i>',
'after_widget' => '</li>',
'before_title' => '<h6 class="text-white font-weight-bold mb-lg-4">',
'after_title' => ' <i class="tainacan-icon mt-0"></i></h6>',