/*————————————
Custom Bootstrap
————————————*/
// // Container // .container-semiboxed {
box-sizing: border-box; max-width: 100%; padding-left: 15px; padding-right: 15px; margin-left: auto; margin-right: auto;
}
@media (min-width: 576px) {
.container-semiboxed { width: 540px; }
}
@media (min-width: 768px) {
.container-semiboxed { width: 720px; }
}
@media (min-width: 992px) {
.container-semiboxed { width: 960px; }
}
@media (min-width: 1200px) {
.container-semiboxed { width: 1140px; }
}
@media (min-width: 1400px) {
.container-semiboxed { width: 1340px; }
}
// // Typography //
.text-muted {
color: $g-color-gray-dark-v5 !important;
}
// // List Groups //
.list-group-item {
border-color: $g-color-gray-light-v4;
}
.list-group-item-action:hover {
background-color: $g-color-gray-light-v5;
}
.list-group-item.active {
background-color: $g-color-primary; border-color: $g-color-primary;
}
.list-group-border-0 .list-group-item:first-child, .list-group-border-0 .list-group-item:last-child {
border-radius: 0;
}
// // Paginations //
/* Paginations */ .page-link {
color: $g-color-primary; &:focus, &:hover { color: $g-color-primary; }
}
.page-item.active .page-link, .page-item.active .page-focus, .page-item.active .page-hover {
border-color: $g-color-primary; background-color: $g-color-primary;
}
// // Nav pills //
.nav-pills .nav-item.show .nav-link, .nav-pills .nav-link.active {
background-color: $g-color-primary;
}
// // Nav tabs //
.nav-tabs {
border-bottom: 1px solid $g-color-gray-light-v4;
}
.nav-tabs .nav-focus, .nav-tabs .nav-hover {
border-color: transparent;
}
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
color: $g-color-main; border-color: $g-color-gray-light-v4 $g-color-gray-light-v4 #fff;
}
// // Progress Bar //
.progress {
font-size: 1rem; line-height: inherit; background-color: $g-color-gray-light-v4; &-bar { height: auto; min-height: 12px; background-color: $g-color-primary; }
}
// // Buttons //
.btn-primary {
background-color: $g-color-primary; border-color: $g-color-primary; &:hover { color: #fff; background-color: $g-color-primary-dark-v1; border-color: $g-color-primary-dark-v1; } &:focus, &.focus { box-shadow: 0 0 0 2px rgba($g-color-primary, .5); } &.disabled, &:disabled { background-color: $g-color-primary; border-color: $g-color-primary; } &:active, &.active, .show > &.dropdown-toggle { background-color: $g-color-primary-dark-v1; border-color: $g-color-primary-dark-v1; }
}
.btn-outline-primary {
color: $g-color-primary; border-color: $g-color-primary; &:hover { background-color: $g-color-primary-dark-v1; border-color: $g-color-primary-dark-v1; } &:focus, &.focus { box-shadow: 0 0 0 2px rgba($g-color-primary, .5); } &.disabled, &:disabled { color: $g-color-primary; } &:active, &.active, .show > &.dropdown-toggle { background-color: $g-color-primary-dark-v1; border-color: $g-color-primary-dark-v1; }
}
// // Card //
.card, .card-header {
border-color: $g-color-gray-light-v4;
}
.card-header {
@include px-to-rem(padding, 10px 15px);
}
.card-block {
@include px-to-rem(padding, 15px);
}
// // Forms //
.form-control {
border-color: $g-color-gray-light-v2; &-md { padding: .8rem 1rem .6rem; }
}
.form-control, .form-control:focus {
color: $g-color-main;
}
.form-control:focus, .custom-select:focus {
border-color: $g-color-primary;
}
.form-control::placeholder {
color: inherit; opacity: .5;
}
.has-success .col-form-label, .has-success .custom-control, .has-success .form-check-label, .has-success .form-control-feedback, .has-success .form-control-label {
color: $g-color-success;
}
.has-success .form-control {
border-color: $g-color-success;
}
.has-warning .col-form-label, .has-warning .custom-control, .has-warning .form-check-label, .has-warning .form-control-feedback, .has-warning .form-control-label {
color: $g-color-warning;
}
.has-warning .form-control {
border-color: $g-color-warning;
}
.has-danger .col-form-label, .has-danger .custom-control, .has-danger .form-check-label, .has-danger .form-control-feedback, .has-danger .form-control-label {
color: $g-color-danger;
}
.has-danger .form-control {
border-color: $g-color-danger;
}
.input-group-addon {
min-width: 38px; background-color: transparent; border-color: $g-color-gray-light-v2; transition: border-color .15s ease-in-out 0s; > * { white-space: normal; } i { margin: 0 auto; } // &:first-child { // border-right: none; // } // &:last-child { // border-left: none; // }
}
.input-group .form-control:active, .input-group .form-control:focus, .input-group .form-control:hover {
z-index: auto;
}
.btn-group {
display: block;
}
//.embed-responsive { // > div { // position: absolute; // top: 0; // left: 0; // width: 100%; // height: 100%; // } //}
.input-group-addon {
& + .input-group-addon { border-left: solid 1px $g-color-gray-light-v2; }
}
.table-striped tbody tr:nth-of-type(2n+1) {
background-color: $g-color-gray-light-v5;
}
.table-striped tbody td {
border-top: none;
}
@media (min-width: 768px) {
.btn-group { display: inline-flex; } .justified-content { display: table; width: 100%; table-layout: fixed; > * { display: table-cell; width: 1%; float: none; } }
}
// Dropdown menu .dropdown-menu {
min-width: 15rem; padding: 0;
}
.dropdown-toggle {
&::before { display: none; } &::after { content: "\e900"; position: relative; @include px-to-rem(top, 3px); font-family: "hs-icons" !important; font-size: 10px; display: inline; border: none; @include px-to-rem(margin-left, 7px); }
}
.dropdown-item {
@include px-to-rem(padding, 3px 15px); &:focus, &:hover { background: rgba($g-color-black, .03); } &.active, &:active { background: rgba($g-color-black, .05); color: inherit !important; & > a { color: inherit !important; &::before, &::after { background-color: $g-color-white; } } .u-header__section--dark & > a { color: #fff !important; } }
}