mirror of
https://github.com/tabler/tabler.git
synced 2025-12-21 17:34:25 +04:00
layout cleanup, removed unused files
This commit is contained in:
102
_config.yml
102
_config.yml
@@ -21,81 +21,9 @@ tabler-plugins:
|
|||||||
- tabler-flags
|
- tabler-flags
|
||||||
- tabler-payments
|
- tabler-payments
|
||||||
- tabler-buttons
|
- tabler-buttons
|
||||||
- tabler-dark
|
|
||||||
- tabler-rtl
|
|
||||||
|
|
||||||
exclude:
|
exclude:
|
||||||
- .jekyll-cache
|
- .jekyll-cache
|
||||||
- 400.html
|
|
||||||
- 401.html
|
|
||||||
- 403.html
|
|
||||||
- 404.html
|
|
||||||
- 500.html
|
|
||||||
- 503.html
|
|
||||||
- all.html
|
|
||||||
- blank.html
|
|
||||||
- blog.html
|
|
||||||
- buttons.html
|
|
||||||
- calendar.html
|
|
||||||
- cards.html
|
|
||||||
- carousel.html
|
|
||||||
- changelog.html
|
|
||||||
- charts.html
|
|
||||||
- charts-heatmap.html
|
|
||||||
- components.html
|
|
||||||
- crypto-currencies.html
|
|
||||||
- datatables.html
|
|
||||||
- docs.html
|
|
||||||
- dropdowns.html
|
|
||||||
- email.html
|
|
||||||
- empty.html
|
|
||||||
- flags.html
|
|
||||||
- forgot-password.html
|
|
||||||
- form-elements.html
|
|
||||||
- gallery.html
|
|
||||||
- homepage.html
|
|
||||||
- icons.html
|
|
||||||
- index.html
|
|
||||||
- invoice.html
|
|
||||||
- layout-dark.html
|
|
||||||
- layout-dark-navigation.html
|
|
||||||
- layout-dark-topnav.html
|
|
||||||
- layout-sidebar.html
|
|
||||||
- layout-sidebar-dark.html
|
|
||||||
- layout-sidebar-narrow.html
|
|
||||||
- layout-sidebar-only.html
|
|
||||||
- layout-sidebar-right.html
|
|
||||||
- layouts.html
|
|
||||||
- license.html
|
|
||||||
- lists.html
|
|
||||||
- lookup.html
|
|
||||||
- maintenance.html
|
|
||||||
- maps.html
|
|
||||||
- markdown.md
|
|
||||||
- music.html
|
|
||||||
- pagination.html
|
|
||||||
- pricing.html
|
|
||||||
- profile.html
|
|
||||||
- ribbons.html
|
|
||||||
- rtl.html
|
|
||||||
- search-results.html
|
|
||||||
- sign-in.html
|
|
||||||
- sign-up.html
|
|
||||||
- sitemap.xml
|
|
||||||
- snippets.html
|
|
||||||
- social.html
|
|
||||||
- store.html
|
|
||||||
- tabs.html
|
|
||||||
- terms-of-service.html
|
|
||||||
- tmp.html
|
|
||||||
- tmp2.html
|
|
||||||
- tmp3.html
|
|
||||||
- tmp4.html
|
|
||||||
- tmp-dark.html
|
|
||||||
- tmp-forms.html
|
|
||||||
- typography.html
|
|
||||||
- users.html
|
|
||||||
- welcome.html
|
|
||||||
|
|
||||||
keep_files:
|
keep_files:
|
||||||
- css/ui-kit.css
|
- css/ui-kit.css
|
||||||
@@ -116,13 +44,13 @@ toc:
|
|||||||
max_level: 2
|
max_level: 2
|
||||||
list_class: list-unstyled
|
list_class: list-unstyled
|
||||||
|
|
||||||
#collections:
|
collections:
|
||||||
# docs:
|
docs:
|
||||||
# output: false
|
output: false
|
||||||
# changelog:
|
changelog:
|
||||||
# output: false
|
output: false
|
||||||
# components:
|
components:
|
||||||
# output: false
|
output: false
|
||||||
|
|
||||||
defaults:
|
defaults:
|
||||||
- scope:
|
- scope:
|
||||||
@@ -135,14 +63,14 @@ defaults:
|
|||||||
type: "pages"
|
type: "pages"
|
||||||
values:
|
values:
|
||||||
layout: default
|
layout: default
|
||||||
# - scope:
|
- scope:
|
||||||
# type: "docs"
|
type: "docs"
|
||||||
# values:
|
values:
|
||||||
# layout: docs
|
layout: docs
|
||||||
# - scope:
|
- scope:
|
||||||
# type: "components"
|
type: "components"
|
||||||
# values:
|
values:
|
||||||
# layout: component
|
layout: component
|
||||||
|
|
||||||
|
|
||||||
colors:
|
colors:
|
||||||
|
|||||||
@@ -4,11 +4,8 @@
|
|||||||
@import "fonts/webfonts";
|
@import "fonts/webfonts";
|
||||||
|
|
||||||
@import "layout/core";
|
@import "layout/core";
|
||||||
@import "layout/layout";
|
|
||||||
@import "layout/navbar";
|
@import "layout/navbar";
|
||||||
@import "layout/sidenav";
|
|
||||||
@import "layout/page";
|
@import "layout/page";
|
||||||
@import "layout/mainnav";
|
|
||||||
|
|
||||||
@import "ui/alerts";
|
@import "ui/alerts";
|
||||||
@import "ui/avatars";
|
@import "ui/avatars";
|
||||||
@@ -56,8 +53,5 @@
|
|||||||
@import "utils/opacity";
|
@import "utils/opacity";
|
||||||
@import "utils/shadow";
|
@import "utils/shadow";
|
||||||
|
|
||||||
//@import "rtl";
|
|
||||||
|
|
||||||
@import "dark";
|
@import "dark";
|
||||||
|
|
||||||
@import "debug";
|
@import "debug";
|
||||||
@@ -1,385 +0,0 @@
|
|||||||
////sidenav
|
|
||||||
//
|
|
||||||
//
|
|
||||||
//@mixin sidebar-narrow {
|
|
||||||
// width: $sidenav-width-narrow;
|
|
||||||
//
|
|
||||||
// .sidebar-brand {
|
|
||||||
// width: 100%;
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .sidebar-brand-logo {
|
|
||||||
// &-sm {
|
|
||||||
// display: inline-block;
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// &-lg {
|
|
||||||
// display: none;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .sidebar-content {
|
|
||||||
// padding: 0;
|
|
||||||
// overflow: visible;
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .sidebar-nav {
|
|
||||||
// margin: 0;
|
|
||||||
//
|
|
||||||
// > .sidebar-nav-item {
|
|
||||||
// position: relative;
|
|
||||||
// white-space: nowrap;
|
|
||||||
//
|
|
||||||
// &:hover {
|
|
||||||
// background: $primary;
|
|
||||||
// width: $sidenav-width;
|
|
||||||
//
|
|
||||||
// > .sidebar-nav-link {
|
|
||||||
// color: #ffffff;
|
|
||||||
//
|
|
||||||
// > span {
|
|
||||||
// display: block;
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .icon {
|
|
||||||
// margin-right: add(1rem, $sidenav-padding);
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .sidebar-subnav {
|
|
||||||
// display: block;
|
|
||||||
//
|
|
||||||
// .sidebar-nav-link {
|
|
||||||
// padding-left: $sidenav-padding;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// > .sidebar-nav-link {
|
|
||||||
// min-height: $sidenav-folded-item-height;
|
|
||||||
// padding: 0 1rem !important;
|
|
||||||
// position: relative;
|
|
||||||
//
|
|
||||||
// .icon {
|
|
||||||
// margin: 0;
|
|
||||||
// width: 2rem;
|
|
||||||
// height: 1.125rem;
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// > span {
|
|
||||||
// display: none;
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .badge {
|
|
||||||
// display: block;
|
|
||||||
// position: absolute;
|
|
||||||
// left: 2.5rem;
|
|
||||||
// top: 1rem;
|
|
||||||
//
|
|
||||||
// text-indent: -99999px;
|
|
||||||
// width: $badge-empty-size;
|
|
||||||
// height: $badge-empty-size;
|
|
||||||
// padding: 0;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .sidebar-subnav {
|
|
||||||
// display: none;
|
|
||||||
// position: absolute;
|
|
||||||
// top: $sidenav-folded-item-height;
|
|
||||||
// left: $sidenav-width-narrow;
|
|
||||||
// right: 0;
|
|
||||||
// padding: .5rem 0;
|
|
||||||
// background: $dark;
|
|
||||||
// box-shadow: -6px 0px 16px -10px rgba(0, 0, 0, 0.2), $box-shadow;
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .sidebar-nav-arrow {
|
|
||||||
// display: none !important;
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .sidebar-nav-title {
|
|
||||||
// display: none;
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// + .content {
|
|
||||||
// margin-left: $sidenav-width-narrow;
|
|
||||||
//
|
|
||||||
// .navbar.fixed-top {
|
|
||||||
// left: $sidenav-width-narrow;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// &.sidebar-right {
|
|
||||||
// + .content {
|
|
||||||
// margin-left: 0;
|
|
||||||
// margin-right: $sidenav-width-narrow;
|
|
||||||
//
|
|
||||||
// .navbar.fixed-top {
|
|
||||||
// left: 0;
|
|
||||||
// right: $sidenav-width-narrow;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .hide-sidebar-narrow {
|
|
||||||
// display: none !important
|
|
||||||
// }
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
//@mixin sidebar-visible {
|
|
||||||
// display: flex;
|
|
||||||
//
|
|
||||||
// + .content .navbar.fixed-top {
|
|
||||||
// left: $sidenav-width;
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .hide-sidebar-visible,
|
|
||||||
// + .content .hide-sidebar-visible {
|
|
||||||
// display: none !important;
|
|
||||||
// }
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
///**
|
|
||||||
//Wrapper
|
|
||||||
// */
|
|
||||||
//.page {
|
|
||||||
// height: 100%;
|
|
||||||
// overflow: hidden;
|
|
||||||
// width: 100%;
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
///**
|
|
||||||
//Content
|
|
||||||
// */
|
|
||||||
//.content {
|
|
||||||
// overflow: hidden;
|
|
||||||
// min-height: 100vh;
|
|
||||||
// display: flex;
|
|
||||||
// flex-direction: column;
|
|
||||||
//
|
|
||||||
// .sidebar + & {
|
|
||||||
// margin-left: $sidenav-width;
|
|
||||||
//
|
|
||||||
// @if $sidenav-breakpoint-folded {
|
|
||||||
// @include media-breakpoint-down($sidenav-breakpoint-folded) {
|
|
||||||
// margin-left: $sidenav-width-narrow;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// @include media-breakpoint-down($sidenav-breakpoint-show) {
|
|
||||||
// margin-left: 0;
|
|
||||||
// padding-left: 0;
|
|
||||||
// padding-right: 0;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
//.content-page {
|
|
||||||
// flex: 1;
|
|
||||||
// display: flex;
|
|
||||||
//
|
|
||||||
// //@include media-breakpoint-up($cards-grid-breakpoint) {
|
|
||||||
// // padding-left: $cards-grid-gap / 2;
|
|
||||||
// // padding-right: $cards-grid-gap / 2;
|
|
||||||
// //}
|
|
||||||
//
|
|
||||||
// @media print {
|
|
||||||
// padding-top: 0 !important;
|
|
||||||
// }
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
///**
|
|
||||||
//Sidebar
|
|
||||||
// */
|
|
||||||
//.sidebar {
|
|
||||||
// width: $sidenav-width;
|
|
||||||
// position: fixed;
|
|
||||||
// z-index: $zindex-fixed;
|
|
||||||
// padding: 0;
|
|
||||||
// background: $sidenav-bg;
|
|
||||||
// box-shadow: inset -1px 0 $sidenav-border-color;
|
|
||||||
// top: 0;
|
|
||||||
// bottom: 0;
|
|
||||||
// display: none;
|
|
||||||
// flex-direction: column;
|
|
||||||
//
|
|
||||||
// @include media-breakpoint-up($sidenav-breakpoint-show) {
|
|
||||||
// @include sidebar-visible;
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// @if $sidenav-breakpoint-folded {
|
|
||||||
// @include media-breakpoint-between($sidenav-breakpoint-show, $sidenav-breakpoint-folded) {
|
|
||||||
// @include sidebar-narrow;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
//.sidebar-brand {
|
|
||||||
// display: block;
|
|
||||||
// text-align: center;
|
|
||||||
//
|
|
||||||
// line-height: $navbar-height;
|
|
||||||
// width: $sidenav-width;
|
|
||||||
// position: absolute;
|
|
||||||
// top: 0;
|
|
||||||
// left: 0;
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
//.sidebar-brand-logo {
|
|
||||||
// height: 2rem;
|
|
||||||
//
|
|
||||||
// &-sm {
|
|
||||||
// display: none;
|
|
||||||
// }
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
//.sidebar-content {
|
|
||||||
// padding: $sidenav-padding;
|
|
||||||
// flex: 1;
|
|
||||||
// display: flex;
|
|
||||||
// flex-direction: column;
|
|
||||||
// overflow-y: scroll;
|
|
||||||
// @include scrollbar;
|
|
||||||
//
|
|
||||||
// .sidebar-brand + & {
|
|
||||||
// margin-top: $navbar-height;
|
|
||||||
// }
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
///**
|
|
||||||
//Sidebar menu
|
|
||||||
// */
|
|
||||||
//.sidebar-nav {
|
|
||||||
// margin: (-$sidenav-padding) (-$sidenav-padding) $sidenav-padding;
|
|
||||||
// padding: 0;
|
|
||||||
// list-style: none;
|
|
||||||
// user-select: none;
|
|
||||||
// color: $text-muted;
|
|
||||||
//
|
|
||||||
// ul {
|
|
||||||
// margin: 0;
|
|
||||||
// padding: 0;
|
|
||||||
// list-style: none;
|
|
||||||
// }
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
//.sidebar-nav-link {
|
|
||||||
// padding: .5rem $sidenav-padding;
|
|
||||||
// transition: .3s color, .3s background-color;
|
|
||||||
// color: inherit;
|
|
||||||
// display: flex;
|
|
||||||
// align-items: center;
|
|
||||||
//
|
|
||||||
// .sidebar-nav-item .sidebar-nav-item & {
|
|
||||||
// padding-left: add(1.5rem, $sidenav-padding);
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .sidebar-nav-item .sidebar-nav-item .sidebar-nav-item & {
|
|
||||||
// padding-left: add(3rem, $sidenav-padding);
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// &:hover {
|
|
||||||
// background-color: rgba(#fff, .02);
|
|
||||||
// text-decoration: none;
|
|
||||||
// color: $body-color !important;
|
|
||||||
// cursor: pointer !important;
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// &.active {
|
|
||||||
// opacity: 1;
|
|
||||||
// color: $body-color !important;
|
|
||||||
// box-shadow: inset 3px 0 $primary;
|
|
||||||
// background-color: rgba(#fff, .01);
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .icon {
|
|
||||||
// width: 1rem;
|
|
||||||
// margin-right: .5rem;
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .badge {
|
|
||||||
// margin-left: auto;
|
|
||||||
// }
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
//.sidebar-nav-arrow {
|
|
||||||
// display: block;
|
|
||||||
//
|
|
||||||
// margin-left: auto;
|
|
||||||
// @include caret(right);
|
|
||||||
//
|
|
||||||
// &:after {
|
|
||||||
// transition: .3s transform;
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .sidebar-nav-link[aria-expanded="true"] &:after {
|
|
||||||
// transform: rotate(-45deg);
|
|
||||||
// }
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
//.sidebar-subnav {
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
//.sidebar-nav-title {
|
|
||||||
// @include subheader(false);
|
|
||||||
// color: inherit;
|
|
||||||
// opacity: .8;
|
|
||||||
// padding: $sidenav-padding $sidenav-padding .5rem;
|
|
||||||
//
|
|
||||||
// &:not(:first-child) {
|
|
||||||
// margin-top: .5rem;
|
|
||||||
// }
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
///**
|
|
||||||
//Sidebar dark
|
|
||||||
// */
|
|
||||||
//.sidebar-dark {
|
|
||||||
// background: $sidenav-dark-bg;
|
|
||||||
// color: $text-muted;
|
|
||||||
// box-shadow: none;
|
|
||||||
//
|
|
||||||
// .sidebar-brand {
|
|
||||||
// filter: brightness(0) invert(1);
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .sidebar-nav-link {
|
|
||||||
// &:hover,
|
|
||||||
// &.active {
|
|
||||||
// color: $white !important;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// .sidebar-content {
|
|
||||||
// @include scrollbar(true);
|
|
||||||
// }
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
///**
|
|
||||||
//Right sidebar
|
|
||||||
// */
|
|
||||||
//.sidebar-right {
|
|
||||||
// left: auto;
|
|
||||||
// right: 0;
|
|
||||||
// box-shadow: inset 1px 0 $sidenav-border-color;
|
|
||||||
//
|
|
||||||
// + .content {
|
|
||||||
// margin-left: 0;
|
|
||||||
// margin-right: $sidenav-width;
|
|
||||||
//
|
|
||||||
// .navbar.fixed-top {
|
|
||||||
// left: 0;
|
|
||||||
// right: $sidenav-width;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
//}
|
|
||||||
//
|
|
||||||
///**
|
|
||||||
//Folded sidebar
|
|
||||||
// */
|
|
||||||
//.sidebar-narrow {
|
|
||||||
// @include sidebar-narrow;
|
|
||||||
//}
|
|
||||||
@@ -1,425 +0,0 @@
|
|||||||
@mixin navbar-horizontal {
|
|
||||||
.d-none-navbar-horizontal,
|
|
||||||
~ * .d-none-navbar-vertical-narrow {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dropdown-menu {
|
|
||||||
margin-top: -4px;
|
|
||||||
margin-right: -7px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@mixin navbar-vertical-narrow {
|
|
||||||
width: $sidenav-width-narrow;
|
|
||||||
overflow: visible;
|
|
||||||
|
|
||||||
.d-none-navbar-vertical-narrow,
|
|
||||||
~ * .d-none-navbar-vertical-narrow {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-nav {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-link {
|
|
||||||
height: 3rem; //todo: to variable
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-link-title,
|
|
||||||
.navbar-heading {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-link-icon {
|
|
||||||
margin: 0 auto;
|
|
||||||
font-size: 1.125rem;
|
|
||||||
width: 1.125rem;
|
|
||||||
height: 1.125rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-brand-logo-large {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-brand-logo-small {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
~ .navbar,
|
|
||||||
~ .content {
|
|
||||||
margin-left: $sidenav-width-narrow;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dropdown-toggle:after {
|
|
||||||
content: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dropdown-menu {
|
|
||||||
left: 100%;
|
|
||||||
top: 0;
|
|
||||||
margin: 0 0 0 -4px;
|
|
||||||
|
|
||||||
&:before,
|
|
||||||
&:after {
|
|
||||||
content: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.dropdown-menu-right {
|
|
||||||
top: auto;
|
|
||||||
bottom: 0;
|
|
||||||
right: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.navbar-right {
|
|
||||||
~ .navbar,
|
|
||||||
~ .content {
|
|
||||||
margin-left: 0;
|
|
||||||
margin-right: $sidenav-width-narrow;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dropdown-menu {
|
|
||||||
margin: 0 -4px 0 0;
|
|
||||||
left: auto;
|
|
||||||
right: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@mixin navbar-vertical {
|
|
||||||
position: fixed;
|
|
||||||
left: 0;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
width: $sidenav-width;
|
|
||||||
z-index: $zindex-fixed;
|
|
||||||
min-height: auto;
|
|
||||||
align-items: start;
|
|
||||||
overflow: auto;
|
|
||||||
|
|
||||||
> [class*="container"] {
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: stretch;
|
|
||||||
padding-left: 0;
|
|
||||||
padding-right: 0;
|
|
||||||
min-height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
~ .navbar,
|
|
||||||
~ .content {
|
|
||||||
margin-left: $sidenav-width;
|
|
||||||
}
|
|
||||||
|
|
||||||
.d-none-navbar-vertical,
|
|
||||||
~ * .d-none-navbar-vertical {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-brand {
|
|
||||||
display: flex;
|
|
||||||
width: 100%;
|
|
||||||
margin: 0;
|
|
||||||
text-align: center;
|
|
||||||
height: $navbar-height;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-heading {
|
|
||||||
@include subheader();
|
|
||||||
display: block;
|
|
||||||
margin-bottom: .5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-collapse {
|
|
||||||
flex-direction: column;
|
|
||||||
text-align: left;
|
|
||||||
align-items: normal;
|
|
||||||
|
|
||||||
padding: $sidenav-padding $sidenav-padding;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-nav {
|
|
||||||
flex-direction: column;
|
|
||||||
margin-left: -($sidenav-padding);
|
|
||||||
margin-right: -($sidenav-padding);
|
|
||||||
|
|
||||||
.nav-link {
|
|
||||||
min-height: 0;
|
|
||||||
padding-left: $sidenav-padding;
|
|
||||||
padding-right: $sidenav-padding;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-item {
|
|
||||||
&.active {
|
|
||||||
font-weight: 600;
|
|
||||||
|
|
||||||
&:before {
|
|
||||||
left: 0;
|
|
||||||
right: auto;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
height: auto;
|
|
||||||
width: 2px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-side {
|
|
||||||
margin-left: 0;
|
|
||||||
margin-top: auto;
|
|
||||||
padding-left: 0;
|
|
||||||
padding-top: $sidenav-padding;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
margin-left: 0;
|
|
||||||
margin-top: 1rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.navbar-right {
|
|
||||||
left: auto;
|
|
||||||
right: 0;
|
|
||||||
|
|
||||||
~ .navbar,
|
|
||||||
~ .content {
|
|
||||||
margin-left: 0;
|
|
||||||
margin-right: $sidenav-width;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:not(.navbar-vertical-narrow) {
|
|
||||||
.d-none-navbar-vertical-wide,
|
|
||||||
~ * .d-none-navbar-vertical-wide {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.dropdown-menu {
|
|
||||||
position: static;
|
|
||||||
background: inherit;
|
|
||||||
border: 0;
|
|
||||||
box-shadow: none;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
color: inherit;
|
|
||||||
columns: 1;
|
|
||||||
|
|
||||||
&:before,
|
|
||||||
&:after {
|
|
||||||
content: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.dropdown-item {
|
|
||||||
padding-left: add($sidenav-padding, 1.5rem);
|
|
||||||
opacity: $text-muted-opacity;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background: transparent;
|
|
||||||
color: inherit;
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.dropdown-toggle:after {
|
|
||||||
margin-left: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.navbar-vertical-narrow {
|
|
||||||
@include navbar-vertical-narrow;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.page {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.content {
|
|
||||||
padding-top: 1.25rem;
|
|
||||||
padding-bottom: 1.25rem;
|
|
||||||
|
|
||||||
@include media-breakpoint-up(xl) {
|
|
||||||
padding-left: .5rem;
|
|
||||||
padding-right: .5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media print {
|
|
||||||
margin: 0 !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar {
|
|
||||||
padding-top: 0;
|
|
||||||
padding-bottom: 0;
|
|
||||||
|
|
||||||
@media print {
|
|
||||||
display: none;
|
|
||||||
margin: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-link {
|
|
||||||
min-height: $navbar-height;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-link-icon {
|
|
||||||
font-size: 1rem;
|
|
||||||
width: 1rem;
|
|
||||||
height: 1rem;
|
|
||||||
display: block;
|
|
||||||
margin-right: .5rem;
|
|
||||||
line-height: .99;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-expand {
|
|
||||||
@each $breakpoint, $breakpoint-max-width in $grid-breakpoints {
|
|
||||||
&-#{$breakpoint} {
|
|
||||||
@include media-breakpoint-up($breakpoint) {
|
|
||||||
min-height: $navbar-height;
|
|
||||||
|
|
||||||
.navbar-nav {
|
|
||||||
margin-left: (-$navbar-nav-link-padding-x);
|
|
||||||
|
|
||||||
.nav-item {
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
&.active {
|
|
||||||
&:before {
|
|
||||||
content: '';
|
|
||||||
position: absolute;
|
|
||||||
bottom: 0;
|
|
||||||
left: $navbar-nav-link-padding-x;
|
|
||||||
right: $navbar-nav-link-padding-x;
|
|
||||||
height: 1px;
|
|
||||||
background: $sidenav-active-accent-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-side {
|
|
||||||
margin-left: auto;
|
|
||||||
padding-left: 1.5rem;
|
|
||||||
|
|
||||||
> * {
|
|
||||||
margin-left: 1rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-heading {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
Navbar brand
|
|
||||||
*/
|
|
||||||
.navbar-brand {
|
|
||||||
padding: 0; //todo: move to varaibles
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-brand-logo {
|
|
||||||
height: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-brand-logo-small {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
Navbar colors
|
|
||||||
*/
|
|
||||||
.navbar {
|
|
||||||
box-shadow: 0 0 0 1px $border-color;
|
|
||||||
|
|
||||||
.navbar-nav {
|
|
||||||
.nav-link {
|
|
||||||
color: inherit;
|
|
||||||
opacity: $text-muted-opacity;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: inherit;
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.disabled {
|
|
||||||
color: inherit;
|
|
||||||
opacity: $text-muted-opacity / 3;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.show > .nav-link,
|
|
||||||
.active > .nav-link,
|
|
||||||
.nav-link.show,
|
|
||||||
.nav-link.active {
|
|
||||||
color: inherit;
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-light {
|
|
||||||
background: $white;
|
|
||||||
@include scrollbar;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-dark {
|
|
||||||
background: $sidenav-dark-bg;
|
|
||||||
color: $sidenav-dark-color;
|
|
||||||
box-shadow: 0 0 0 1px $dark-darken;
|
|
||||||
@include scrollbar(true);
|
|
||||||
|
|
||||||
.text-muted {
|
|
||||||
color: inherit !important;
|
|
||||||
opacity: $text-muted-opacity;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-brand-autodark {
|
|
||||||
@include autodark-image;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-control {
|
|
||||||
border-color: transparent;
|
|
||||||
background: $dark-lighten;
|
|
||||||
color: $white;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
Navbar vertical
|
|
||||||
*/
|
|
||||||
@if $enable-navbar-vertical {
|
|
||||||
.navbar:not(.navbar-vertical) {
|
|
||||||
@include navbar-horizontal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.navbar-vertical {
|
|
||||||
@each $breakpoint, $breakpoint-max-width in $grid-breakpoints {
|
|
||||||
&.navbar-expand-#{$breakpoint} {
|
|
||||||
@include media-breakpoint-up($breakpoint) {
|
|
||||||
@include navbar-vertical;
|
|
||||||
}
|
|
||||||
|
|
||||||
@include media-breakpoint-down-than($breakpoint) {
|
|
||||||
@include navbar-horizontal;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
Navbar secondary
|
|
||||||
*/
|
|
||||||
.navbar-secondary {
|
|
||||||
order: -1;
|
|
||||||
}
|
|
||||||
@@ -1,180 +1,417 @@
|
|||||||
///*
|
/*
|
||||||
//Navbar
|
Horizontal navbar
|
||||||
// */
|
*/
|
||||||
//.navbar {
|
@mixin navbar-horizontal {
|
||||||
//
|
.d-none-navbar-horizontal,
|
||||||
// &, .navbar-dark {
|
~ * .d-none-navbar-vertical-narrow {
|
||||||
// min-height: $navbar-height;
|
display: none;
|
||||||
//
|
}
|
||||||
// &.fixed-top {
|
|
||||||
// + .content-page {
|
.dropdown-menu {
|
||||||
// padding-top: $navbar-height;
|
margin-top: -4px;
|
||||||
// }
|
margin-right: -7px;
|
||||||
//
|
}
|
||||||
// + .navbar:not(.fixed-top) {
|
}
|
||||||
// margin-top: $navbar-height;
|
|
||||||
// }
|
/*
|
||||||
//
|
Vertical narrow navbar
|
||||||
// + .navbar.fixed-top {
|
*/
|
||||||
// top: $navbar-height;
|
@mixin navbar-vertical-narrow {
|
||||||
//
|
width: $sidenav-width-narrow;
|
||||||
// + .content-page {
|
overflow: visible;
|
||||||
// padding-top: $navbar-height * 2;
|
|
||||||
// }
|
.d-none-navbar-vertical-narrow,
|
||||||
// }
|
~ * .d-none-navbar-vertical-narrow {
|
||||||
// }
|
display: none;
|
||||||
// }
|
}
|
||||||
//
|
|
||||||
// @include media-breakpoint-up($cards-grid-breakpoint) {
|
.navbar-nav {
|
||||||
// padding-left: $cards-grid-gap / 2;
|
margin-top: 0;
|
||||||
// padding-right: $cards-grid-gap / 2;
|
}
|
||||||
// }
|
|
||||||
//}
|
.nav-link {
|
||||||
//
|
height: 3rem; //todo: to variable
|
||||||
//.navbar-collapse-absolute {
|
}
|
||||||
// @each $breakpoint, $width in $grid-breakpoints {
|
|
||||||
// @at-root .navbar-expand-#{$breakpoint} & {
|
.nav-link-title,
|
||||||
// position: absolute;
|
.navbar-heading {
|
||||||
// background: inherit;
|
display: none;
|
||||||
// z-index: $zindex-sticky;
|
}
|
||||||
// left: 0;
|
|
||||||
// right: 0;
|
.nav-link-icon {
|
||||||
//
|
margin: 0 auto;
|
||||||
// @include media-breakpoint-up($breakpoint) {
|
font-size: 1.125rem;
|
||||||
// position: static;
|
width: 1.125rem;
|
||||||
// }
|
height: 1.125rem;
|
||||||
// }
|
}
|
||||||
// }
|
|
||||||
//}
|
.navbar-brand-logo-large {
|
||||||
//
|
display: none;
|
||||||
///**
|
}
|
||||||
//navbar toggler
|
|
||||||
// */
|
.navbar-brand-logo-small {
|
||||||
//.navbar-toggler {
|
display: inline-block;
|
||||||
// border: 0;
|
}
|
||||||
// font-size: $navbar-toggler-font-size;
|
|
||||||
// width: add($navbar-toggler-size, $navbar-toggler-padding-x * 2);
|
~ .navbar,
|
||||||
// height: add($navbar-toggler-size, $navbar-toggler-padding-y * 2);
|
~ .content {
|
||||||
// margin: $navbar-toggler-margin;
|
margin-left: $sidenav-width-narrow;
|
||||||
// position: relative;
|
}
|
||||||
//}
|
|
||||||
//
|
.dropdown-toggle:after {
|
||||||
//
|
content: none;
|
||||||
//.navbar-toggler-icon {
|
}
|
||||||
// $time: $navbar-toggler-transform-time / 2;
|
|
||||||
//
|
.dropdown-menu {
|
||||||
// background-image: none !important;
|
left: 100%;
|
||||||
// position: absolute;
|
top: 0;
|
||||||
// width: $navbar-toggler-size;
|
margin: 0 0 0 -4px;
|
||||||
// height: $navbar-toggler-item-height;
|
|
||||||
// border-radius: 3px;
|
&:before,
|
||||||
//
|
&:after {
|
||||||
// left: 50%;
|
content: none;
|
||||||
// top: 50%;
|
}
|
||||||
// margin-left: -($navbar-toggler-size / 2);
|
|
||||||
// margin-top: -($navbar-toggler-item-height / 2);
|
&.dropdown-menu-right {
|
||||||
//
|
top: auto;
|
||||||
// background: currentColor;
|
bottom: 0;
|
||||||
// transform-origin: center;
|
right: auto;
|
||||||
// transition: transform $time, top $time $time, bottom $time $time;
|
}
|
||||||
//
|
}
|
||||||
// &:before,
|
|
||||||
// &:after {
|
&.navbar-right {
|
||||||
// content: '';
|
~ .navbar,
|
||||||
// background: inherit;
|
~ .content {
|
||||||
// position: absolute;
|
margin-left: 0;
|
||||||
// height: inherit;
|
margin-right: $sidenav-width-narrow;
|
||||||
// width: inherit;
|
}
|
||||||
// left: 0;
|
|
||||||
// border-radius: inherit;
|
.dropdown-menu {
|
||||||
// transition: inherit;
|
margin: 0 -4px 0 0;
|
||||||
// }
|
left: auto;
|
||||||
//
|
right: 100%;
|
||||||
// &:before {
|
}
|
||||||
// top: $navbar-toggler-item-spacing;
|
}
|
||||||
// }
|
}
|
||||||
//
|
|
||||||
// &:after {
|
/*
|
||||||
// bottom: $navbar-toggler-item-spacing;
|
Vertical navbar
|
||||||
// }
|
*/
|
||||||
//
|
@mixin navbar-vertical {
|
||||||
// .navbar-toggler[aria-expanded="true"] & {
|
position: fixed;
|
||||||
// transform: rotate(45deg);
|
left: 0;
|
||||||
// transition: top $time, bottom $time, transform $time $time, opacity $time;
|
top: 0;
|
||||||
//
|
bottom: 0;
|
||||||
// &:before {
|
width: $sidenav-width;
|
||||||
// top: 0;
|
z-index: $zindex-fixed;
|
||||||
// transform: rotate(-90deg);
|
min-height: auto;
|
||||||
// }
|
align-items: start;
|
||||||
//
|
overflow: auto;
|
||||||
// &:after {
|
|
||||||
// bottom: 0;
|
> [class*="container"] {
|
||||||
// opacity: 0;
|
flex-direction: column;
|
||||||
// }
|
align-items: stretch;
|
||||||
// }
|
padding-left: 0;
|
||||||
//}
|
padding-right: 0;
|
||||||
//
|
min-height: 100%;
|
||||||
///**
|
}
|
||||||
//navbar with border
|
|
||||||
//*/
|
~ .navbar,
|
||||||
//.navbar-border {
|
~ .content {
|
||||||
// box-shadow: inset 0 -1px 0 0px $navbar-border-color;
|
margin-left: $sidenav-width;
|
||||||
//}
|
}
|
||||||
//
|
|
||||||
///**
|
.d-none-navbar-vertical,
|
||||||
//Navbar logo
|
~ * .d-none-navbar-vertical {
|
||||||
// */
|
display: none;
|
||||||
//.navbar-brand-logo {
|
}
|
||||||
// height: 2rem;
|
|
||||||
//}
|
.navbar-brand {
|
||||||
//
|
display: flex;
|
||||||
//.navbar-nav {
|
width: 100%;
|
||||||
// margin-right: -($navbar-nav-link-padding-x);
|
margin: 0;
|
||||||
// margin-left: -($navbar-nav-link-padding-x);
|
text-align: center;
|
||||||
//
|
height: $navbar-height;
|
||||||
// .nav-link {
|
align-items: center;
|
||||||
// padding-left: $navbar-nav-link-padding-x;
|
justify-content: center;
|
||||||
// padding-right: $navbar-nav-link-padding-x;
|
}
|
||||||
// }
|
|
||||||
//
|
.navbar-heading {
|
||||||
// @each $breakpoint, $width in $grid-breakpoints {
|
@include subheader();
|
||||||
// @at-root .navbar-expand-#{$breakpoint} & {
|
display: block;
|
||||||
// @include media-breakpoint-up($breakpoint) {
|
margin-bottom: .5rem;
|
||||||
// .nav-item:hover,
|
}
|
||||||
// .dropright:hover {
|
|
||||||
// > .dropdown-menu {
|
.navbar-collapse {
|
||||||
// display: block;
|
flex-direction: column;
|
||||||
// }
|
text-align: left;
|
||||||
// }
|
align-items: normal;
|
||||||
// }
|
|
||||||
//
|
padding: $sidenav-padding $sidenav-padding;
|
||||||
// @include media-breakpoint-down($breakpoint) {
|
}
|
||||||
// .dropdown-menu {
|
|
||||||
// box-shadow: none;
|
.navbar-nav {
|
||||||
// border: 0;
|
flex-direction: column;
|
||||||
// padding: 0;
|
margin-left: -($sidenav-padding);
|
||||||
// }
|
margin-right: -($sidenav-padding);
|
||||||
//
|
|
||||||
// .dropdown-item {
|
.nav-link {
|
||||||
// padding-left: add($navbar-nav-link-padding-x, 19px);
|
min-height: 0;
|
||||||
// padding-right: 0;
|
padding-left: $sidenav-padding;
|
||||||
// }
|
padding-right: $sidenav-padding;
|
||||||
// }
|
}
|
||||||
// }
|
|
||||||
// }
|
.nav-item {
|
||||||
//
|
&.active {
|
||||||
// .dropdown-menu {
|
font-weight: 600;
|
||||||
// .dropdown,
|
|
||||||
// .dropright {
|
&:before {
|
||||||
// .dropdown-toggle:after {
|
left: 0;
|
||||||
// margin-left: auto;
|
right: auto;
|
||||||
// }
|
top: 0;
|
||||||
// }
|
bottom: 0;
|
||||||
// }
|
height: auto;
|
||||||
//}
|
width: 2px;
|
||||||
//
|
}
|
||||||
//.navbar-brand {
|
}
|
||||||
// padding: 0;
|
}
|
||||||
// line-height: 1;
|
}
|
||||||
//}
|
|
||||||
//
|
.navbar-side {
|
||||||
|
margin-left: 0;
|
||||||
|
margin-top: auto;
|
||||||
|
padding-left: 0;
|
||||||
|
padding-top: $sidenav-padding;
|
||||||
|
|
||||||
|
> * {
|
||||||
|
margin-left: 0;
|
||||||
|
margin-top: 1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.navbar-right {
|
||||||
|
left: auto;
|
||||||
|
right: 0;
|
||||||
|
|
||||||
|
~ .navbar,
|
||||||
|
~ .content {
|
||||||
|
margin-left: 0;
|
||||||
|
margin-right: $sidenav-width;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:not(.navbar-vertical-narrow) {
|
||||||
|
.d-none-navbar-vertical-wide,
|
||||||
|
~ * .d-none-navbar-vertical-wide {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-menu {
|
||||||
|
position: static;
|
||||||
|
background: inherit;
|
||||||
|
border: 0;
|
||||||
|
box-shadow: none;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
color: inherit;
|
||||||
|
columns: 1;
|
||||||
|
|
||||||
|
&:before,
|
||||||
|
&:after {
|
||||||
|
content: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-item {
|
||||||
|
padding-left: add($sidenav-padding, 1.5rem);
|
||||||
|
opacity: $text-muted-opacity;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: transparent;
|
||||||
|
color: inherit;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.dropdown-toggle:after {
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.navbar-vertical-narrow {
|
||||||
|
@include navbar-vertical-narrow;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
All navbars
|
||||||
|
*/
|
||||||
|
.navbar {
|
||||||
|
padding-top: 0;
|
||||||
|
padding-bottom: 0;
|
||||||
|
|
||||||
|
@media print {
|
||||||
|
display: none;
|
||||||
|
margin: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link {
|
||||||
|
min-height: $navbar-height;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-link-icon {
|
||||||
|
font-size: 1rem;
|
||||||
|
width: 1rem;
|
||||||
|
height: 1rem;
|
||||||
|
display: block;
|
||||||
|
margin-right: .5rem;
|
||||||
|
line-height: .99;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-expand {
|
||||||
|
@each $breakpoint, $breakpoint-max-width in $grid-breakpoints {
|
||||||
|
&-#{$breakpoint} {
|
||||||
|
@include media-breakpoint-up($breakpoint) {
|
||||||
|
min-height: $navbar-height;
|
||||||
|
|
||||||
|
.navbar-nav {
|
||||||
|
margin-left: (-$navbar-nav-link-padding-x);
|
||||||
|
|
||||||
|
.nav-item {
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
&:before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: $navbar-nav-link-padding-x;
|
||||||
|
right: $navbar-nav-link-padding-x;
|
||||||
|
height: 1px;
|
||||||
|
background: $sidenav-active-accent-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-side {
|
||||||
|
margin-left: auto;
|
||||||
|
padding-left: 1.5rem;
|
||||||
|
|
||||||
|
> * {
|
||||||
|
margin-left: 1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-heading {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
Navbar brand
|
||||||
|
*/
|
||||||
|
.navbar-brand {
|
||||||
|
padding: 0; //todo: move to varaibles
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-brand-logo {
|
||||||
|
height: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-brand-logo-small {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
Navbar colors
|
||||||
|
*/
|
||||||
|
.navbar {
|
||||||
|
box-shadow: 0 0 0 1px $border-color;
|
||||||
|
|
||||||
|
.navbar-nav {
|
||||||
|
.nav-link {
|
||||||
|
color: inherit;
|
||||||
|
opacity: $text-muted-opacity;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: inherit;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.disabled {
|
||||||
|
color: inherit;
|
||||||
|
opacity: $text-muted-opacity / 3;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.show > .nav-link,
|
||||||
|
.active > .nav-link,
|
||||||
|
.nav-link.show,
|
||||||
|
.nav-link.active {
|
||||||
|
color: inherit;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-light {
|
||||||
|
background: $white;
|
||||||
|
@include scrollbar;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-dark {
|
||||||
|
background: $sidenav-dark-bg;
|
||||||
|
color: $sidenav-dark-color;
|
||||||
|
box-shadow: 0 0 0 1px $dark-darken;
|
||||||
|
@include scrollbar(true);
|
||||||
|
|
||||||
|
.text-muted {
|
||||||
|
color: inherit !important;
|
||||||
|
opacity: $text-muted-opacity;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-brand-autodark {
|
||||||
|
@include autodark-image;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-control {
|
||||||
|
border-color: transparent;
|
||||||
|
background: $dark-lighten;
|
||||||
|
color: $white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
Navbar vertical
|
||||||
|
*/
|
||||||
|
@if $enable-navbar-vertical {
|
||||||
|
.navbar:not(.navbar-vertical) {
|
||||||
|
@include navbar-horizontal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-vertical {
|
||||||
|
@each $breakpoint, $breakpoint-max-width in $grid-breakpoints {
|
||||||
|
&.navbar-expand-#{$breakpoint} {
|
||||||
|
@include media-breakpoint-up($breakpoint) {
|
||||||
|
@include navbar-vertical;
|
||||||
|
}
|
||||||
|
|
||||||
|
@include media-breakpoint-down-than($breakpoint) {
|
||||||
|
@include navbar-horizontal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
Navbar secondary
|
||||||
|
*/
|
||||||
|
.navbar-secondary {
|
||||||
|
order: -1;
|
||||||
|
}
|
||||||
@@ -1,3 +1,23 @@
|
|||||||
|
.page {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
padding-top: 1.25rem;
|
||||||
|
padding-bottom: 1.25rem;
|
||||||
|
|
||||||
|
@include media-breakpoint-up(xl) {
|
||||||
|
padding-left: .5rem;
|
||||||
|
padding-right: .5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media print {
|
||||||
|
margin: 0 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.page-header {
|
.page-header {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|||||||
@@ -1,2 +0,0 @@
|
|||||||
@import "config";
|
|
||||||
@import "rtl";
|
|
||||||
Reference in New Issue
Block a user