Files
LeafWeb/WebCms/Content/bootstrap_leafweb.scss
T

291 lines
6.6 KiB
SCSS

@import "bootstrap_variables_leafweb";
@import "bootstrap/bootstrap.scss";
.navbar-brand img {
width: 140px;
}
@include media-breakpoint-up(md) {
.navbar-brand img {
width: 175px;
}
}
@include media-breakpoint-up(lg) {
.navbar-brand img {
width: 205px;
}
}
/*
$bgDefault: $dark;
$bgHighlight: $primary;
$colDefault: #ecf0f1;
$colHighlight: #b7f696;
$dropDown: false;
.navbar {
background-color: $bgDefault !important;
.navbar-brand {
color: $colDefault;
&:hover, &:focus {
color: $colHighlight;
}
}
.navbar-text {
color: $colDefault;
a {
color: $colHighlight;
&:hover, &:focus {
color: $colHighlight;
}
}
}
.navbar-nav {
.nav-link {
color: $colDefault;
border-radius: .25rem;
margin: 0 0.25em;
&:not(.disabled) {
&:hover, &:focus {
color: $colHighlight;
}
}
}
@if ($dropDown) {
.dropdown-menu {
background-color: $bgDefault;
border-color: $bgHighlight;
.dropdown-item {
color: $colDefault;
&:hover, &:focus, &.active {
color: $colHighlight;
background-color: $bgHighlight;
}
}
.dropdown-divider {
border-top-color: $bgHighlight;
}
}
}
.nav-item.active, .nav-item.show {
.nav-link, .nav-link:hover, .nav-link:focus {
color: $colHighlight;
background-color: $bgHighlight;
}
}
}
.navbar-toggle {
border-color: $bgHighlight;
&:hover, &:focus {
background-color: $bgHighlight;
}
.navbar-toggler-icon {
color: $colDefault;
}
}
.navbar-collapse,
.navbar-form {
border-color: $colDefault;
}
.navbar-link {
color: $colDefault;
&:hover {
color: $colHighlight;
}
}
}
@media (max-width: 575px) {
.navbar-expend-sm .navbar-nav .show .dropdown-menu {
.dropdown-item {
color: $colDefault;
&:hover, &:focus {
color: $colHighlight;
}
}
.dropdown-item.active {
color: $colHighlight;
background-color: $bgHighlight;
}
}
}
@media (max-width: 767px) {
.navbar-expend-md .navbar-nav .show .dropdown-menu {
.dropdown-item {
color: $colDefault;
&:hover, &:focus {
color: $colHighlight;
}
}
.dropdown-item.active {
color: $colHighlight;
background-color: $bgHighlight;
}
}
}
@media (max-width: 991px) {
.navbar-expend-lg .navbar-nav .show .dropdown-menu {
.dropdown-item {
color: $colDefault;
&:hover, &:focus {
color: $colHighlight;
}
}
.dropdown-item.active {
color: $colHighlight;
background-color: $bgHighlight;
}
}
}
@media (max-width: 1199px) {
.navbar-expend-xl .navbar-nav .show .dropdown-menu {
.dropdown-item {
color: $colDefault;
&:hover, &:focus {
color: $colHighlight;
}
}
.dropdown-item.active {
color: $colHighlight;
background-color: $bgHighlight;
}
}
}
.navbar-expend .navbar-nav .show .dropdown-menu {
.dropdown-item {
color: $colDefault;
&:hover, &:focus {
color: $colHighlight;
}
}
.dropdown-item.active {
color: $colHighlight;
background-color: $bgHighlight;
}
}
*/
/*
// Alternate buttons styles inverse and transparent
// --------------------------------------------------
.btn-default {
&.btn-inverse {
@include button-variant($btn-secondary-bg, $btn-secondary-color, $btn-secondary-bg);
&:hover {
@include button-variant($btn-secondary-color, $btn-secondary-bg, $btn-secondary-border);
}
}
&.btn-transparent {
@include button-variant($btn-secondary-bg, transparent, $btn-secondary-bg);
&:hover {
@include button-variant($btn-secondary-bg, darken($btn-secondary-bg, 25%), $btn-secondary-bg);
}
}
}
.btn-primary {
&.btn-inverse {
@include button-variant($btn-primary-bg, $btn-primary-color, $btn-primary-bg);
&:hover {
@include button-variant($btn-primary-color, $btn-primary-bg, $btn-primary-border);
}
}
&.btn-transparent {
@include button-variant($btn-primary-bg, transparent, $btn-primary-bg);
&:hover {
@include button-variant($btn-primary-bg, darken($btn-primary-bg, 25%), $btn-primary-bg);
}
}
}
.btn-success {
&.btn-inverse {
@include button-variant($btn-success-bg, $btn-success-color, $btn-success-bg);
&:hover {
@include button-variant($btn-success-color, $btn-success-bg, $btn-success-border);
}
}
&.btn-transparent {
@include button-variant($btn-success-bg, transparent, $btn-success-bg);
&:hover {
@include button-variant($btn-success-bg, darken($btn-success-bg, 25%), $btn-success-bg);
}
}
}
.btn-info {
&.btn-inverse {
@include button-variant($btn-info-bg, $btn-info-color, $btn-info-bg);
&:hover {
@include button-variant($btn-info-color, $btn-info-bg, $btn-info-border);
}
}
&.btn-transparent {
@include button-variant($btn-info-bg, transparent, $btn-info-bg);
&:hover {
@include button-variant($btn-info-bg, darken($btn-info-bg, 25%), $btn-info-bg);
}
}
}
.btn-warning {
&.btn-inverse {
@include button-variant($btn-warning-bg, $btn-warning-color, $btn-warning-bg);
&:hover {
@include button-variant($btn-warning-color, $btn-warning-bg, $btn-warning-border);
}
}
&.btn-transparent {
@include button-variant($btn-warning-bg, transparent, $btn-warning-bg);
&:hover {
@include button-variant($btn-warning-bg, darken($btn-warning-bg, 25%), $btn-warning-bg);
}
}
}
.btn-danger {
&.btn-inverse {
@include button-variant($btn-danger-bg, $btn-danger-color, $btn-danger-bg);
&:hover {
@include button-variant($btn-danger-color, $btn-danger-bg, $btn-danger-border);
}
}
&.btn-transparent {
@include button-variant($btn-danger-bg, transparent, $btn-danger-bg);
&:hover {
@include button-variant($btn-danger-bg, darken($btn-danger-bg, 25%), $btn-danger-bg);
}
}
}
*/