webpack-bootstrap-ui-kit/src/scss/_layout.scss

178 lines
2.7 KiB
SCSS
Raw Normal View History

2021-01-31 14:29:24 +01:00
.sidebar__col {
position: relative;
2021-02-20 07:00:59 +01:00
margin-top: $element-reduced-spacer-y;
margin-bottom: $element-reduced-spacer-y;
2021-01-31 14:29:24 +01:00
}
.content-holder__sidebar {
> .container {
padding: 0;
}
}
2019-06-08 17:20:51 +02:00
2021-01-31 14:29:24 +01:00
#SiteWideMessage {
text-align: center;
.alert {
margin-bottom: 0;
.btn-close {
margin-top: -0.5rem;
float: right;
}
}
2019-06-08 17:20:51 +02:00
}
2021-01-31 14:29:24 +01:00
#Header {
background-color: $header-bg;
color: $header-color;
a {
color: $header-link;
}
.nav-container {
display: flex;
justify-content: flex-end;
align-items: flex-end;
position: static;
}
.logo {
filter: invert(100%);
}
.tagline {
display: inline-block;
font-size: 1.2rem;
margin-left: 2em;
}
}
#Navigation {
font-size: 1.5rem;
text-transform: uppercase;
letter-spacing: 0.25rem;
width: 100%;
background: $header-bg;
.navbar-toggler {
color: $main-nav-link-color;
font-size: $main-nav-toggler-size;
}
.nav-item,
.nav-link {
2021-02-08 01:30:14 +01:00
flex-direction: column;
2021-02-23 14:51:02 +01:00
/*@media (min-width: $full-body-min-width) {
2021-02-08 01:30:14 +01:00
align-items: center;
justify-content: center;
text-align: center;
2021-02-23 14:51:02 +01:00
}*/
2021-01-31 14:29:24 +01:00
}
.nav-link {
color: $main-nav-link-color;
background: $main-nav-link-bg;
&:focus,
&:hover,
&.active {
background: $main-nav-link-hover-bg;
color: $main-nav-link-hover-color;
}
}
.active {
2021-02-23 14:51:02 +01:00
> .nav-link {
2021-01-31 14:29:24 +01:00
background: $main-nav-link-hover-bg;
color: $main-nav-link-hover-color;
}
}
.nav-item .nav-dropdown {
.fa-chevron-right
//&:after
{
display: none;
}
}
.dropdown-menu {
border-color: $main-nav-dropdown-bg;
background: $main-nav-dropdown-bg;
margin-top: 0;
border-top: 0;
2021-02-23 14:51:02 +01:00
min-width: 100%;
2021-01-31 14:29:24 +01:00
.nav-item-link {
color: $main-nav-dropdown-color;
}
}
.dropdown-item {
2021-02-23 14:51:02 +01:00
&.active,
&:active,
2021-01-31 14:29:24 +01:00
&:focus,
&:hover {
background: $main-nav-dropdown-hover-bg;
.nav-item-link {
color: $main-nav-dropdown-hover-color;
}
}
.nav-item-link {
width: 100%;
justify-content: flex-start;
align-items: flex-start;
}
}
2021-02-08 01:30:14 +01:00
@media (min-width: $full-body-min-width) {
2021-01-31 14:29:24 +01:00
.navbar-nav > .nav-item {
padding-right: 2rem;
padding-left: 2rem;
}
.dropdown-item .nav-item-link {
padding-left: 1rem;
padding-right: 1rem;
}
}
}
/*#MainContent {
2021-02-20 07:00:59 +01:00
padding-top: 2 * $element-reduced-spacer-y;
padding-bottom: 2 * $element-reduced-spacer-y;
2021-01-31 14:29:24 +01:00
}*/
#PageBreadcumbs {
position: relative;
z-index: 2;
}
2019-06-08 17:20:51 +02:00
#Footer {
2021-02-20 07:00:59 +01:00
display: flex;
flex-direction: column;
2021-01-31 14:29:24 +01:00
background-color: $footer-bg;
color: $footer-color;
2021-02-20 07:00:59 +01:00
2021-01-31 14:29:24 +01:00
> .wrapper {
2021-02-20 07:00:59 +01:00
padding-top: $element-reduced-spacer-y;
padding-bottom: $element-reduced-spacer-y;
2021-01-31 14:29:24 +01:00
}
2019-06-08 17:20:51 +02:00
2021-02-20 07:00:59 +01:00
a,
.a {
2021-01-31 14:29:24 +01:00
color: $footer-link;
}
2019-06-08 17:20:51 +02:00
2021-01-31 14:29:24 +01:00
.footer {
2021-02-20 07:00:59 +01:00
padding-top: $element-reduced-spacer-y;
padding-bottom: $element-reduced-spacer-y;
2021-01-31 14:29:24 +01:00
background-color: $footer-footer-bg;
2019-06-08 17:20:51 +02:00
2021-01-31 14:29:24 +01:00
.copyright {
padding-right: 0.5rem;
}
2019-06-08 17:20:51 +02:00
2021-01-31 14:29:24 +01:00
li {
padding: 0 0.5rem;
}
}
}