AutorÃa | Ultima modificación | Ver Log |
/**
* This file contains the styles required to make the footer sticky.
*/
html,
body {
height: 100%;
}
.stickyfooter {
position: fixed;
right: 0;
left: 0;
height: $stickyfooter-height;
bottom: calc(#{$stickyfooter-height} * -1);
transition: bottom .5s;
z-index: $zindex-fixed;
overflow: hidden;
box-shadow: 0 0 1rem rgba($black, .15);
font-size: calc(#{$font-size-base} * 1.10);
// Adjust sticky footer width to the main content area.
.sticky-footer-content {
@include media-breakpoint-up(md) {
.pagelayout-standard &,
body.limitedwidth.uses-drawers & {
max-width: $course-content-maxwidth;
}
body.mediumwidth.uses-drawers & {
max-width: $medium-content-maxwidth;
}
}
}
// Adjust sticky footer width when drawers are open.
.sticky-footer-content-wrapper {
@include transition(0.2s);
@include media-breakpoint-up(lg) {
.drawers {
padding: 0 3rem;
}
.show-drawer-left & {
margin-left: $drawer-left-width;
padding: 0 3rem 0 1rem;
}
.show-drawer-right & {
margin-right: $drawer-right-width;
padding: 0 1rem 0 3rem;
}
.show-drawer-right.show-drawer-left & {
padding: 0 1rem;
}
}
}
}
.hasstickyfooter .stickyfooter {
bottom: 0;
}
/* Standard components fixes for sticky footer. */
.stickyfooter ul.pagination {
margin-bottom: map-get($spacers, 1);
}
.stickyfooter .btn {
font-size: calc(#{$font-size-base} * 1.10);
}
/* Breakpoints fixes. */
@include media-breakpoint-up(sm) {
#page-wrapper {
height: 100%;
display: flex;
flex-direction: column;
#page {
&:not(.drawers) {
flex: 1 0 auto;
}
display: flex;
flex-direction: column;
#page-content {
flex: 1 0 auto;
}
}
#page-footer {
flex-shrink: 0;
}
}
}
@include media-breakpoint-down(sm) {
#page-wrapper {
height: 100%;
display: flex;
flex-direction: column;
#page {
&:not(.drawers) {
flex: 1 0 auto;
}
display: flex;
flex-direction: column;
}
}
}