chg: [layout:navbar] Moved links and actions breadcrumb items out of the main top navbar
mokaddem
parent
a869faa72b
commit
9172e1b405
|
|
@ -269,18 +269,21 @@ class NavigationComponent extends Component
|
|||
],
|
||||
"{$controller}:view" => [
|
||||
'label' => __('View'),
|
||||
'icon' => 'eye',
|
||||
'inherit' => 'depth-1',
|
||||
'url' => "/{$controller}/view/{{id}}",
|
||||
'url_vars' => ['id' => 'id'],
|
||||
],
|
||||
"{$controller}:edit" => [
|
||||
'label' => __('Edit'),
|
||||
'icon' => 'edit',
|
||||
'inherit' => 'depth-1',
|
||||
'url' => "/{$controller}/edit/{{id}}",
|
||||
'url_vars' => ['id' => 'id'],
|
||||
],
|
||||
"{$controller}:delete" => [
|
||||
'label' => __('Delete'),
|
||||
'icon' => 'trash',
|
||||
'inherit' => 'depth-1',
|
||||
'url' => "/{$controller}/delete/{{id}}",
|
||||
'url_vars' => ['id' => 'id'],
|
||||
|
|
|
|||
|
|
@ -29,15 +29,12 @@
|
|||
'title' => h($entry['label']),
|
||||
'templateVars' => [
|
||||
'linkClass' => $i == 0 ? 'fw-light' : '',
|
||||
'icon' => !empty($entry['icon']) ? $this->FontAwesome->getClass(h($entry['icon'])) : ''
|
||||
'icon' => ($i == 0 && !empty($entry['icon'])) ? $this->FontAwesome->getClass(h($entry['icon'])) : ''
|
||||
]
|
||||
]);
|
||||
}
|
||||
|
||||
$lastCrumb = $breadcrumb[count($breadcrumb)-1];
|
||||
if (!empty($lastCrumb['links']) || !empty($lastCrumb['actions'])) {
|
||||
$this->Breadcrumbs->add([[]]); // add last separetor
|
||||
}
|
||||
|
||||
if (!empty($lastCrumb['links'])) {
|
||||
foreach ($lastCrumb['links'] as $i => $linkEntry) {
|
||||
|
|
@ -46,7 +43,7 @@
|
|||
$linkEntry['url'] = $this->DataFromPath->buildStringFromDataPath($linkEntry['url'], $entity, $linkEntry['url_vars']);
|
||||
}
|
||||
$breadcrumbLinks .= sprintf('<a class="btn btn-%s btn-sm text-nowrap" role="button" href="%s">%s</a>',
|
||||
$active ? 'secondary' : 'dark',
|
||||
$active ? 'secondary' : 'outline-secondary',
|
||||
Router::url($linkEntry['url']),
|
||||
h($linkEntry['label'])
|
||||
);
|
||||
|
|
@ -57,7 +54,11 @@
|
|||
if (!empty($actionEntry['url_vars'])) {
|
||||
$actionEntry['url'] = $this->DataFromPath->buildStringFromDataPath($actionEntry['url'], $entity, $actionEntry['url_vars']);
|
||||
}
|
||||
$breadcrumbAction .= sprintf('<a class="dropdown-item" href="%s">%s</a>', Router::url($actionEntry['url']), h($actionEntry['label']));
|
||||
$breadcrumbAction .= sprintf('<a class="dropdown-item" href="%s"><i class="me-1 %s"></i>%s</a>',
|
||||
Router::url($actionEntry['url']),
|
||||
!empty($entry['icon']) ? $this->FontAwesome->getClass(h($actionEntry['icon'])) : '',
|
||||
h($actionEntry['label'])
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -70,15 +71,26 @@
|
|||
['separator' => '']
|
||||
);
|
||||
?>
|
||||
|
||||
<?php if (!empty($breadcrumbLinks) && !empty($breadcrumbAction)): ?>
|
||||
<div class="breadcrumb-link-container position-absolute end-0 d-flex">
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (!empty($breadcrumbLinks)): ?>
|
||||
<div class="header-breadcrumb-children d-none d-md-flex">
|
||||
<div class="header-breadcrumb-children d-none d-md-flex btn-group">
|
||||
<?= $breadcrumbLinks ?>
|
||||
<a class="btn btn-primary btn-sm dropdown-toggle" href="#" role="button" id="dropdownMenuBreadcrumbAction" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<?= __('Actions') ?>
|
||||
</a>
|
||||
<div class="dropdown-menu dropdown-menu-end" aria-labelledby="dropdownMenuBreadcrumbAction">
|
||||
<?= $breadcrumbAction ?>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (!empty($breadcrumbAction)): ?>
|
||||
<?php if (!empty($breadcrumbAction) && false): ?>
|
||||
<div class="header-breadcrumb-actions dropdown d-flex align-items-center">
|
||||
<a class="btn btn-primary dropdown-toggle" href="#" role="button" id="dropdownMenuBreadcrumbAction" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<a class="btn btn-primary btn-sm dropdown-toggle" href="#" role="button" id="dropdownMenuBreadcrumbAction" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<?= __('Actions') ?>
|
||||
</a>
|
||||
<div class="dropdown-menu" aria-labelledby="dropdownMenuBreadcrumbAction">
|
||||
|
|
@ -86,3 +98,7 @@
|
|||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if (!empty($breadcrumbLinks) && !empty($breadcrumbAction)): ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
|
@ -35,7 +35,6 @@ $cakeDescription = 'Cerebrate';
|
|||
<?= $this->Html->css('font-awesome') ?>
|
||||
<?= $this->Html->css('layout.css') ?>
|
||||
<?= $this->Html->script('jquery-3.5.1.min.js') ?>
|
||||
<?= $this->Html->script('popper.min.js') ?>
|
||||
<?= $this->Html->script('bootstrap.bundle.js') ?>
|
||||
<?= $this->Html->script('main.js') ?>
|
||||
<?= $this->Html->script('utils.js') ?>
|
||||
|
|
|
|||
|
|
@ -434,18 +434,24 @@ ul.sidebar-elements > li.category > span.category-divider > hr {
|
|||
|
||||
.header-breadcrumb-children {
|
||||
border-radius: 0.25rem;
|
||||
padding: 0 0.5rem;
|
||||
padding: 0 0.25rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.header-breadcrumb-children > a:not(:last-child) {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
|
||||
.header-breadcrumb-actions > a {
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
|
||||
.breadcrumb-link-container {
|
||||
top: var(--navbar-height);
|
||||
padding: 2px;
|
||||
border-radius: 0 0 0 5px;
|
||||
}
|
||||
.header-breadcrumb-children .dropdown-menu .dropdown-item > i {
|
||||
min-width: 25px;
|
||||
}
|
||||
|
||||
.composed-app-icon-container {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,78 @@
|
|||
/* Body */
|
||||
.panel {
|
||||
background-color: #363636;
|
||||
border: 1px solid #454545;
|
||||
box-shadow: none; }
|
||||
|
||||
/* Top navbar */
|
||||
.top-navbar {
|
||||
background-color: #375a7f; }
|
||||
|
||||
.center-navbar nav.header-breadcrumb {
|
||||
color: #fff; }
|
||||
|
||||
header.top-navbar .header-menu > a:hover,
|
||||
header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
||||
color: #d6d6d6 !important; }
|
||||
|
||||
.top-navbar .center-navbar nav.header-breadcrumb li.header-breadcrumb-item a {
|
||||
color: #fff; }
|
||||
|
||||
.top-navbar .right-navbar .header-menu a.nav-link {
|
||||
color: #fff; }
|
||||
|
||||
.top-navbar .left-navbar .navbar-brand img {
|
||||
filter: invert(1); }
|
||||
|
||||
.top-navbar .left-navbar .navbar-brand:hover img {
|
||||
filter: invert(1) drop-shadow(0px 0px 3px #fff); }
|
||||
|
||||
.top-navbar .composed-app-icon-container > .app-icon {
|
||||
background-color: #fff; }
|
||||
|
||||
.breadcrumb-link-container {
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 2px rgba(0, 0, 0, 0.5), inset 0 3px 5px rgba(0, 0, 0, 0.6); }
|
||||
|
||||
/* Sidebar */
|
||||
.sidebar {
|
||||
transition: width .08s linear;
|
||||
box-shadow: none;
|
||||
background-color: #444; }
|
||||
|
||||
.sidebar ~ main.content:after {
|
||||
background: #000; }
|
||||
|
||||
.sidebar .sidebar-wrapper {
|
||||
border-right: 1px solid none; }
|
||||
|
||||
.sidebar .sidebar-wrapper {
|
||||
border-right: 1px solid rgba(0, 0, 0, 0.125); }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link {
|
||||
color: #fff; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active {
|
||||
background-color: #595f64;
|
||||
color: #fff; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: #595f64;
|
||||
color: #fff; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link:hover {
|
||||
background-color: #60676c;
|
||||
color: #fff; }
|
||||
|
||||
.sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child,
|
||||
.sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: unset; }
|
||||
|
||||
.sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child:hover,
|
||||
.sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child:hover {
|
||||
background-color: #60676c; }
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
background-color: var(--cerebrate-color); }
|
||||
|
||||
.lock-sidebar > a.btn {
|
||||
background-color: unset; }
|
||||
|
|
@ -0,0 +1,78 @@
|
|||
/* Body */
|
||||
.panel {
|
||||
background-color: #fff;
|
||||
border: none;
|
||||
box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); }
|
||||
|
||||
/* Top navbar */
|
||||
.top-navbar {
|
||||
background-color: #343a40; }
|
||||
|
||||
.center-navbar nav.header-breadcrumb {
|
||||
color: #fff; }
|
||||
|
||||
header.top-navbar .header-menu > a:hover,
|
||||
header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
||||
color: #d6d6d6 !important; }
|
||||
|
||||
.top-navbar .center-navbar nav.header-breadcrumb li.header-breadcrumb-item a {
|
||||
color: #fff; }
|
||||
|
||||
.top-navbar .right-navbar .header-menu a.nav-link {
|
||||
color: #fff; }
|
||||
|
||||
.top-navbar .left-navbar .navbar-brand img {
|
||||
filter: invert(1); }
|
||||
|
||||
.top-navbar .left-navbar .navbar-brand:hover img {
|
||||
filter: invert(1) drop-shadow(0px 0px 3px #fff); }
|
||||
|
||||
.top-navbar .composed-app-icon-container > .app-icon {
|
||||
background-color: #fff; }
|
||||
|
||||
.breadcrumb-link-container {
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 6px 0 rgba(0, 0, 0, 0.12); }
|
||||
|
||||
/* Sidebar */
|
||||
.sidebar {
|
||||
transition: width .08s linear;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 6px 0 rgba(0, 0, 0, 0.12);
|
||||
background-color: #f8f9fa; }
|
||||
|
||||
.sidebar ~ main.content:after {
|
||||
background: #000; }
|
||||
|
||||
.sidebar .sidebar-wrapper {
|
||||
border-right: 1px solid #ddd; }
|
||||
|
||||
.sidebar .sidebar-wrapper {
|
||||
border-right: 1px solid rgba(0, 0, 0, 0.125); }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link {
|
||||
color: #000; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active {
|
||||
background-color: #dbdbdb;
|
||||
color: #000; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: #dbdbdb;
|
||||
color: #000; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link:hover {
|
||||
background-color: #ebebeb;
|
||||
color: #000; }
|
||||
|
||||
.sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child,
|
||||
.sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: unset; }
|
||||
|
||||
.sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child:hover,
|
||||
.sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child:hover {
|
||||
background-color: #ebebeb; }
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
background-color: var(--cerebrate-color); }
|
||||
|
||||
.lock-sidebar > a.btn {
|
||||
background-color: #f8f9fa; }
|
||||
|
|
@ -0,0 +1,78 @@
|
|||
/* Body */
|
||||
.panel {
|
||||
background-color: #fff;
|
||||
border: none;
|
||||
box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); }
|
||||
|
||||
/* Top navbar */
|
||||
.top-navbar {
|
||||
background-color: #2c3e50; }
|
||||
|
||||
.center-navbar nav.header-breadcrumb {
|
||||
color: #fff; }
|
||||
|
||||
header.top-navbar .header-menu > a:hover,
|
||||
header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
||||
color: #d6d6d6 !important; }
|
||||
|
||||
.top-navbar .center-navbar nav.header-breadcrumb li.header-breadcrumb-item a {
|
||||
color: #fff; }
|
||||
|
||||
.top-navbar .right-navbar .header-menu a.nav-link {
|
||||
color: #fff; }
|
||||
|
||||
.top-navbar .left-navbar .navbar-brand img {
|
||||
filter: invert(1); }
|
||||
|
||||
.top-navbar .left-navbar .navbar-brand:hover img {
|
||||
filter: invert(1) drop-shadow(0px 0px 3px #fff); }
|
||||
|
||||
.top-navbar .composed-app-icon-container > .app-icon {
|
||||
background-color: #fff; }
|
||||
|
||||
.breadcrumb-link-container {
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 2px rgba(0, 0, 0, 0.5), inset 0 3px 5px rgba(0, 0, 0, 0.6); }
|
||||
|
||||
/* Sidebar */
|
||||
.sidebar {
|
||||
transition: width .08s linear;
|
||||
box-shadow: none;
|
||||
background-color: #ecf0f1; }
|
||||
|
||||
.sidebar ~ main.content:after {
|
||||
background: #000; }
|
||||
|
||||
.sidebar .sidebar-wrapper {
|
||||
border-right: 1px solid none; }
|
||||
|
||||
.sidebar .sidebar-wrapper {
|
||||
border-right: 1px solid rgba(0, 0, 0, 0.125); }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link {
|
||||
color: #000; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active {
|
||||
background-color: #dbdbdb;
|
||||
color: #18bc9c; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: #dbdbdb;
|
||||
color: #18bc9c; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link:hover {
|
||||
background-color: #ebebeb;
|
||||
color: #18bc9c; }
|
||||
|
||||
.sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child,
|
||||
.sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: unset; }
|
||||
|
||||
.sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child:hover,
|
||||
.sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child:hover {
|
||||
background-color: #ebebeb; }
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
background-color: #18bc9c; }
|
||||
|
||||
.lock-sidebar > a.btn {
|
||||
background-color: unset; }
|
||||
|
|
@ -0,0 +1,78 @@
|
|||
/* Body */
|
||||
.panel {
|
||||
background-color: #fff;
|
||||
border: none;
|
||||
box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); }
|
||||
|
||||
/* Top navbar */
|
||||
.top-navbar {
|
||||
background-color: #2c3e50; }
|
||||
|
||||
.center-navbar nav.header-breadcrumb {
|
||||
color: #fff; }
|
||||
|
||||
header.top-navbar .header-menu > a:hover,
|
||||
header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
||||
color: #d6d6d6 !important; }
|
||||
|
||||
.top-navbar .center-navbar nav.header-breadcrumb li.header-breadcrumb-item a {
|
||||
color: #fff; }
|
||||
|
||||
.top-navbar .right-navbar .header-menu a.nav-link {
|
||||
color: #fff; }
|
||||
|
||||
.top-navbar .left-navbar .navbar-brand img {
|
||||
filter: invert(1); }
|
||||
|
||||
.top-navbar .left-navbar .navbar-brand:hover img {
|
||||
filter: invert(1) drop-shadow(0px 0px 3px #fff); }
|
||||
|
||||
.top-navbar .composed-app-icon-container > .app-icon {
|
||||
background-color: #fff; }
|
||||
|
||||
.breadcrumb-link-container {
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 2px rgba(0, 0, 0, 0.5), inset 0 3px 5px rgba(0, 0, 0, 0.6); }
|
||||
|
||||
/* Sidebar */
|
||||
.sidebar {
|
||||
transition: width .08s linear;
|
||||
box-shadow: none;
|
||||
background-color: #ecf0f1; }
|
||||
|
||||
.sidebar ~ main.content:after {
|
||||
background: #000; }
|
||||
|
||||
.sidebar .sidebar-wrapper {
|
||||
border-right: 1px solid none; }
|
||||
|
||||
.sidebar .sidebar-wrapper {
|
||||
border-right: 1px solid rgba(0, 0, 0, 0.125); }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link {
|
||||
color: #343a40; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active {
|
||||
background-color: #dbdbdb;
|
||||
color: #18bc9c; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: #dbdbdb;
|
||||
color: #18bc9c; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link:hover {
|
||||
background-color: #ebebeb;
|
||||
color: #18bc9c; }
|
||||
|
||||
.sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child,
|
||||
.sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: unset; }
|
||||
|
||||
.sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child:hover,
|
||||
.sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child:hover {
|
||||
background-color: #ebebeb; }
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
background-color: #18bc9c; }
|
||||
|
||||
.lock-sidebar > a.btn {
|
||||
background-color: unset; }
|
||||
|
|
@ -0,0 +1,522 @@
|
|||
/* Body */
|
||||
.panel {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.25); }
|
||||
|
||||
/* Top navbar */
|
||||
.top-navbar {
|
||||
background-color: #e83283; }
|
||||
|
||||
.center-navbar nav.header-breadcrumb {
|
||||
color: #fff; }
|
||||
|
||||
header.top-navbar .header-menu > a:hover,
|
||||
header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
||||
color: #d6d6d6 !important; }
|
||||
|
||||
.top-navbar .center-navbar nav.header-breadcrumb li.header-breadcrumb-item a {
|
||||
color: #fff; }
|
||||
|
||||
.top-navbar .right-navbar .header-menu a.nav-link {
|
||||
color: #fff; }
|
||||
|
||||
.top-navbar .left-navbar .navbar-brand img {
|
||||
filter: invert(1); }
|
||||
|
||||
.top-navbar .left-navbar .navbar-brand:hover img {
|
||||
filter: invert(1) drop-shadow(0px 0px 3px #fff); }
|
||||
|
||||
.top-navbar .composed-app-icon-container > .app-icon {
|
||||
background-color: #fff; }
|
||||
|
||||
.breadcrumb-link-container {
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 2px rgba(0, 0, 0, 0.5), inset 0 3px 5px rgba(0, 0, 0, 0.6); }
|
||||
|
||||
/* Sidebar */
|
||||
.sidebar {
|
||||
transition: width .08s linear;
|
||||
box-shadow: none;
|
||||
background-color: rgba(255, 255, 255, 0.4); }
|
||||
|
||||
.sidebar ~ main.content:after {
|
||||
background: #000; }
|
||||
|
||||
.sidebar .sidebar-wrapper {
|
||||
border-right: 1px solid none; }
|
||||
|
||||
.sidebar .sidebar-wrapper {
|
||||
border-right: 1px solid rgba(0, 0, 0, 0.125); }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link {
|
||||
color: #fff; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active {
|
||||
background-color: #fff;
|
||||
color: #343a40; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: #fff;
|
||||
color: #343a40; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link:hover {
|
||||
background-color: #fff;
|
||||
color: #343a40; }
|
||||
|
||||
.sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child,
|
||||
.sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: unset; }
|
||||
|
||||
.sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child:hover,
|
||||
.sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child:hover {
|
||||
background-color: #fff; }
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
background-color: #e83283; }
|
||||
|
||||
.lock-sidebar > a.btn {
|
||||
background-color: rgba(255, 255, 255, 0.4); }
|
||||
|
||||
.btn {
|
||||
display: inline-block;
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
user-select: none;
|
||||
background-color: transparent;
|
||||
border: 1px solid transparent;
|
||||
padding: 0.75rem 1.5rem;
|
||||
font-size: 1rem;
|
||||
line-height: 1.5;
|
||||
border-radius: 0.5rem;
|
||||
transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.btn {
|
||||
transition: none; } }
|
||||
.btn:hover {
|
||||
color: #fff;
|
||||
text-decoration: none; }
|
||||
.btn:focus, .btn.focus {
|
||||
outline: 0;
|
||||
box-shadow: 0 0 0 0.2rem rgba(232, 50, 131, 0.25); }
|
||||
.btn.disabled, .btn:disabled {
|
||||
opacity: 0.65; }
|
||||
.btn:not(:disabled):not(.disabled) {
|
||||
cursor: pointer; }
|
||||
|
||||
a.btn.disabled,
|
||||
fieldset:disabled a.btn {
|
||||
pointer-events: none; }
|
||||
|
||||
.btn-primary {
|
||||
color: #fff;
|
||||
background-color: #e83283;
|
||||
border-color: #e83283; }
|
||||
.btn-primary:hover {
|
||||
color: #fff;
|
||||
background-color: #db196f;
|
||||
border-color: #d01769; }
|
||||
.btn-primary:focus, .btn-primary.focus {
|
||||
color: #fff;
|
||||
background-color: #db196f;
|
||||
border-color: #d01769;
|
||||
box-shadow: 0 0 0 0.2rem rgba(235, 81, 150, 0.5); }
|
||||
.btn-primary.disabled, .btn-primary:disabled {
|
||||
color: #fff;
|
||||
background-color: #e83283;
|
||||
border-color: #e83283; }
|
||||
.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-primary.dropdown-toggle {
|
||||
color: #fff;
|
||||
background-color: #d01769;
|
||||
border-color: #c41664; }
|
||||
.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-primary.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(235, 81, 150, 0.5); }
|
||||
|
||||
.btn-secondary {
|
||||
color: #212529;
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
border-color: rgba(255, 255, 255, 0.4); }
|
||||
.btn-secondary:hover {
|
||||
color: #212529;
|
||||
background-color: rgba(236, 236, 236, 0.4);
|
||||
border-color: rgba(230, 230, 230, 0.4); }
|
||||
.btn-secondary:focus, .btn-secondary.focus {
|
||||
color: #212529;
|
||||
background-color: rgba(236, 236, 236, 0.4);
|
||||
border-color: rgba(230, 230, 230, 0.4);
|
||||
box-shadow: 0 0 0 0.2rem rgba(163, 165, 166, 0.5); }
|
||||
.btn-secondary.disabled, .btn-secondary:disabled {
|
||||
color: #212529;
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
border-color: rgba(255, 255, 255, 0.4); }
|
||||
.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-secondary.dropdown-toggle {
|
||||
color: #212529;
|
||||
background-color: rgba(230, 230, 230, 0.4);
|
||||
border-color: rgba(223, 223, 223, 0.4); }
|
||||
.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-secondary.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(163, 165, 166, 0.5); }
|
||||
|
||||
.btn-success {
|
||||
color: #212529;
|
||||
background-color: #41d7a7;
|
||||
border-color: #41d7a7; }
|
||||
.btn-success:hover {
|
||||
color: #fff;
|
||||
background-color: #2ac895;
|
||||
border-color: #28bd8d; }
|
||||
.btn-success:focus, .btn-success.focus {
|
||||
color: #fff;
|
||||
background-color: #2ac895;
|
||||
border-color: #28bd8d;
|
||||
box-shadow: 0 0 0 0.2rem rgba(60, 188, 148, 0.5); }
|
||||
.btn-success.disabled, .btn-success:disabled {
|
||||
color: #212529;
|
||||
background-color: #41d7a7;
|
||||
border-color: #41d7a7; }
|
||||
.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-success.dropdown-toggle {
|
||||
color: #fff;
|
||||
background-color: #28bd8d;
|
||||
border-color: #26b386; }
|
||||
.btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-success.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(60, 188, 148, 0.5); }
|
||||
|
||||
.btn-info {
|
||||
color: #212529;
|
||||
background-color: #39cbfb;
|
||||
border-color: #39cbfb; }
|
||||
.btn-info:hover {
|
||||
color: #fff;
|
||||
background-color: #14c1fa;
|
||||
border-color: #07befa; }
|
||||
.btn-info:focus, .btn-info.focus {
|
||||
color: #fff;
|
||||
background-color: #14c1fa;
|
||||
border-color: #07befa;
|
||||
box-shadow: 0 0 0 0.2rem rgba(53, 178, 220, 0.5); }
|
||||
.btn-info.disabled, .btn-info:disabled {
|
||||
color: #212529;
|
||||
background-color: #39cbfb;
|
||||
border-color: #39cbfb; }
|
||||
.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-info.dropdown-toggle {
|
||||
color: #fff;
|
||||
background-color: #07befa;
|
||||
border-color: #05b5ef; }
|
||||
.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-info.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(53, 178, 220, 0.5); }
|
||||
|
||||
.btn-warning {
|
||||
color: #212529;
|
||||
background-color: #ffc107;
|
||||
border-color: #ffc107; }
|
||||
.btn-warning:hover {
|
||||
color: #212529;
|
||||
background-color: #e0a800;
|
||||
border-color: #d39e00; }
|
||||
.btn-warning:focus, .btn-warning.focus {
|
||||
color: #212529;
|
||||
background-color: #e0a800;
|
||||
border-color: #d39e00;
|
||||
box-shadow: 0 0 0 0.2rem rgba(222, 170, 12, 0.5); }
|
||||
.btn-warning.disabled, .btn-warning:disabled {
|
||||
color: #212529;
|
||||
background-color: #ffc107;
|
||||
border-color: #ffc107; }
|
||||
.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-warning.dropdown-toggle {
|
||||
color: #212529;
|
||||
background-color: #d39e00;
|
||||
border-color: #c69500; }
|
||||
.btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-warning.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(222, 170, 12, 0.5); }
|
||||
|
||||
.btn-danger {
|
||||
color: #212529;
|
||||
background-color: #fd7e14;
|
||||
border-color: #fd7e14; }
|
||||
.btn-danger:hover {
|
||||
color: #fff;
|
||||
background-color: #e96b02;
|
||||
border-color: #dc6502; }
|
||||
.btn-danger:focus, .btn-danger.focus {
|
||||
color: #fff;
|
||||
background-color: #e96b02;
|
||||
border-color: #dc6502;
|
||||
box-shadow: 0 0 0 0.2rem rgba(220, 113, 23, 0.5); }
|
||||
.btn-danger.disabled, .btn-danger:disabled {
|
||||
color: #212529;
|
||||
background-color: #fd7e14;
|
||||
border-color: #fd7e14; }
|
||||
.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-danger.dropdown-toggle {
|
||||
color: #fff;
|
||||
background-color: #dc6502;
|
||||
border-color: #cf5f02; }
|
||||
.btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-danger.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(220, 113, 23, 0.5); }
|
||||
|
||||
.btn-light {
|
||||
color: #212529;
|
||||
background-color: #e9e9e8;
|
||||
border-color: #e9e9e8; }
|
||||
.btn-light:hover {
|
||||
color: #212529;
|
||||
background-color: #d6d6d4;
|
||||
border-color: #d0d0ce; }
|
||||
.btn-light:focus, .btn-light.focus {
|
||||
color: #212529;
|
||||
background-color: #d6d6d4;
|
||||
border-color: #d0d0ce;
|
||||
box-shadow: 0 0 0 0.2rem rgba(203, 204, 203, 0.5); }
|
||||
.btn-light.disabled, .btn-light:disabled {
|
||||
color: #212529;
|
||||
background-color: #e9e9e8;
|
||||
border-color: #e9e9e8; }
|
||||
.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-light.dropdown-toggle {
|
||||
color: #212529;
|
||||
background-color: #d0d0ce;
|
||||
border-color: #cacac7; }
|
||||
.btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-light.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(203, 204, 203, 0.5); }
|
||||
|
||||
.btn-dark {
|
||||
color: #fff;
|
||||
background-color: #212529;
|
||||
border-color: #212529; }
|
||||
.btn-dark:hover {
|
||||
color: #fff;
|
||||
background-color: #101214;
|
||||
border-color: #0a0c0d; }
|
||||
.btn-dark:focus, .btn-dark.focus {
|
||||
color: #fff;
|
||||
background-color: #101214;
|
||||
border-color: #0a0c0d;
|
||||
box-shadow: 0 0 0 0.2rem rgba(66, 70, 73, 0.5); }
|
||||
.btn-dark.disabled, .btn-dark:disabled {
|
||||
color: #fff;
|
||||
background-color: #212529;
|
||||
border-color: #212529; }
|
||||
.btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-dark.dropdown-toggle {
|
||||
color: #fff;
|
||||
background-color: #0a0c0d;
|
||||
border-color: #050506; }
|
||||
.btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-dark.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(66, 70, 73, 0.5); }
|
||||
|
||||
.btn-outline-primary {
|
||||
color: #e83283;
|
||||
border-color: #e83283; }
|
||||
.btn-outline-primary:hover {
|
||||
color: #fff;
|
||||
background-color: #e83283;
|
||||
border-color: #e83283; }
|
||||
.btn-outline-primary:focus, .btn-outline-primary.focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(232, 50, 131, 0.5); }
|
||||
.btn-outline-primary.disabled, .btn-outline-primary:disabled {
|
||||
color: #e83283;
|
||||
background-color: transparent; }
|
||||
.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-outline-primary.dropdown-toggle {
|
||||
color: #fff;
|
||||
background-color: #e83283;
|
||||
border-color: #e83283; }
|
||||
.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-outline-primary.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(232, 50, 131, 0.5); }
|
||||
|
||||
.btn-outline-secondary {
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
border-color: rgba(255, 255, 255, 0.4); }
|
||||
.btn-outline-secondary:hover {
|
||||
color: #212529;
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
border-color: rgba(255, 255, 255, 0.4); }
|
||||
.btn-outline-secondary:focus, .btn-outline-secondary.focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5); }
|
||||
.btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
|
||||
color: rgba(255, 255, 255, 0.4);
|
||||
background-color: transparent; }
|
||||
.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-outline-secondary.dropdown-toggle {
|
||||
color: #212529;
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
border-color: rgba(255, 255, 255, 0.4); }
|
||||
.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-outline-secondary.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5); }
|
||||
|
||||
.btn-outline-success {
|
||||
color: #41d7a7;
|
||||
border-color: #41d7a7; }
|
||||
.btn-outline-success:hover {
|
||||
color: #212529;
|
||||
background-color: #41d7a7;
|
||||
border-color: #41d7a7; }
|
||||
.btn-outline-success:focus, .btn-outline-success.focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(65, 215, 167, 0.5); }
|
||||
.btn-outline-success.disabled, .btn-outline-success:disabled {
|
||||
color: #41d7a7;
|
||||
background-color: transparent; }
|
||||
.btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-outline-success.dropdown-toggle {
|
||||
color: #212529;
|
||||
background-color: #41d7a7;
|
||||
border-color: #41d7a7; }
|
||||
.btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-outline-success.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(65, 215, 167, 0.5); }
|
||||
|
||||
.btn-outline-info {
|
||||
color: #39cbfb;
|
||||
border-color: #39cbfb; }
|
||||
.btn-outline-info:hover {
|
||||
color: #212529;
|
||||
background-color: #39cbfb;
|
||||
border-color: #39cbfb; }
|
||||
.btn-outline-info:focus, .btn-outline-info.focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(57, 203, 251, 0.5); }
|
||||
.btn-outline-info.disabled, .btn-outline-info:disabled {
|
||||
color: #39cbfb;
|
||||
background-color: transparent; }
|
||||
.btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-outline-info.dropdown-toggle {
|
||||
color: #212529;
|
||||
background-color: #39cbfb;
|
||||
border-color: #39cbfb; }
|
||||
.btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-outline-info.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(57, 203, 251, 0.5); }
|
||||
|
||||
.btn-outline-warning {
|
||||
color: #ffc107;
|
||||
border-color: #ffc107; }
|
||||
.btn-outline-warning:hover {
|
||||
color: #212529;
|
||||
background-color: #ffc107;
|
||||
border-color: #ffc107; }
|
||||
.btn-outline-warning:focus, .btn-outline-warning.focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); }
|
||||
.btn-outline-warning.disabled, .btn-outline-warning:disabled {
|
||||
color: #ffc107;
|
||||
background-color: transparent; }
|
||||
.btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-outline-warning.dropdown-toggle {
|
||||
color: #212529;
|
||||
background-color: #ffc107;
|
||||
border-color: #ffc107; }
|
||||
.btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-outline-warning.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); }
|
||||
|
||||
.btn-outline-danger {
|
||||
color: #fd7e14;
|
||||
border-color: #fd7e14; }
|
||||
.btn-outline-danger:hover {
|
||||
color: #212529;
|
||||
background-color: #fd7e14;
|
||||
border-color: #fd7e14; }
|
||||
.btn-outline-danger:focus, .btn-outline-danger.focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(253, 126, 20, 0.5); }
|
||||
.btn-outline-danger.disabled, .btn-outline-danger:disabled {
|
||||
color: #fd7e14;
|
||||
background-color: transparent; }
|
||||
.btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-outline-danger.dropdown-toggle {
|
||||
color: #212529;
|
||||
background-color: #fd7e14;
|
||||
border-color: #fd7e14; }
|
||||
.btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-outline-danger.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(253, 126, 20, 0.5); }
|
||||
|
||||
.btn-outline-light {
|
||||
color: #e9e9e8;
|
||||
border-color: #e9e9e8; }
|
||||
.btn-outline-light:hover {
|
||||
color: #212529;
|
||||
background-color: #e9e9e8;
|
||||
border-color: #e9e9e8; }
|
||||
.btn-outline-light:focus, .btn-outline-light.focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(233, 233, 232, 0.5); }
|
||||
.btn-outline-light.disabled, .btn-outline-light:disabled {
|
||||
color: #e9e9e8;
|
||||
background-color: transparent; }
|
||||
.btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-outline-light.dropdown-toggle {
|
||||
color: #212529;
|
||||
background-color: #e9e9e8;
|
||||
border-color: #e9e9e8; }
|
||||
.btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-outline-light.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(233, 233, 232, 0.5); }
|
||||
|
||||
.btn-outline-dark {
|
||||
color: #212529;
|
||||
border-color: #212529; }
|
||||
.btn-outline-dark:hover {
|
||||
color: #fff;
|
||||
background-color: #212529;
|
||||
border-color: #212529; }
|
||||
.btn-outline-dark:focus, .btn-outline-dark.focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(33, 37, 41, 0.5); }
|
||||
.btn-outline-dark.disabled, .btn-outline-dark:disabled {
|
||||
color: #212529;
|
||||
background-color: transparent; }
|
||||
.btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active,
|
||||
.show > .btn-outline-dark.dropdown-toggle {
|
||||
color: #fff;
|
||||
background-color: #212529;
|
||||
border-color: #212529; }
|
||||
.btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus,
|
||||
.show > .btn-outline-dark.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.2rem rgba(33, 37, 41, 0.5); }
|
||||
|
||||
.btn-link {
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
text-decoration: none; }
|
||||
.btn-link:hover {
|
||||
color: #d9d9d9;
|
||||
text-decoration: underline; }
|
||||
.btn-link:focus, .btn-link.focus {
|
||||
text-decoration: underline; }
|
||||
.btn-link:disabled, .btn-link.disabled {
|
||||
color: #6c757d;
|
||||
pointer-events: none; }
|
||||
|
||||
.btn-lg {
|
||||
padding: 0.5rem 1rem;
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.5;
|
||||
border-radius: 0.7rem; }
|
||||
|
||||
.btn-sm {
|
||||
padding: 0.25rem 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
line-height: 1.5;
|
||||
border-radius: 0.6rem; }
|
||||
|
||||
.btn-block {
|
||||
display: block;
|
||||
width: 100%; }
|
||||
.btn-block + .btn-block {
|
||||
margin-top: 0.5rem; }
|
||||
|
||||
input[type="submit"].btn-block,
|
||||
input[type="reset"].btn-block,
|
||||
input[type="button"].btn-block {
|
||||
width: 100%; }
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,78 @@
|
|||
/* Body */
|
||||
.panel {
|
||||
background-color: #363636;
|
||||
border: 1px solid #454545;
|
||||
box-shadow: none; }
|
||||
|
||||
/* Top navbar */
|
||||
.top-navbar {
|
||||
background-color: #6f42c1; }
|
||||
|
||||
.center-navbar nav.header-breadcrumb {
|
||||
color: #fff; }
|
||||
|
||||
header.top-navbar .header-menu > a:hover,
|
||||
header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
||||
color: #d6d6d6 !important; }
|
||||
|
||||
.top-navbar .center-navbar nav.header-breadcrumb li.header-breadcrumb-item a {
|
||||
color: #fff; }
|
||||
|
||||
.top-navbar .right-navbar .header-menu a.nav-link {
|
||||
color: #fff; }
|
||||
|
||||
.top-navbar .left-navbar .navbar-brand img {
|
||||
filter: invert(1); }
|
||||
|
||||
.top-navbar .left-navbar .navbar-brand:hover img {
|
||||
filter: invert(1) drop-shadow(0px 0px 3px #fff); }
|
||||
|
||||
.top-navbar .composed-app-icon-container > .app-icon {
|
||||
background-color: #fff; }
|
||||
|
||||
.breadcrumb-link-container {
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 2px rgba(0, 0, 0, 0.5), inset 0 3px 5px rgba(0, 0, 0, 0.6); }
|
||||
|
||||
/* Sidebar */
|
||||
.sidebar {
|
||||
transition: width .08s linear;
|
||||
box-shadow: none;
|
||||
background-color: #170229; }
|
||||
|
||||
.sidebar ~ main.content:after {
|
||||
background: #000; }
|
||||
|
||||
.sidebar .sidebar-wrapper {
|
||||
border-right: 1px solid none; }
|
||||
|
||||
.sidebar .sidebar-wrapper {
|
||||
border-right: 1px solid rgba(0, 0, 0, 0.125); }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link {
|
||||
color: #fff; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active {
|
||||
background-color: #343a40;
|
||||
color: #3cf281; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: #343a40;
|
||||
color: #3cf281; }
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link:hover {
|
||||
background-color: #495057;
|
||||
color: #3cf281; }
|
||||
|
||||
.sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child,
|
||||
.sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: unset; }
|
||||
|
||||
.sidebar.expanded ul.sidebar-elements li > a.sidebar-link.have-active-child:hover,
|
||||
.sidebar:hover ul.sidebar-elements li > a.sidebar-link.have-active-child:hover {
|
||||
background-color: #495057; }
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
background-color: #6f42c1; }
|
||||
|
||||
.lock-sidebar > a.btn {
|
||||
background-color: unset; }
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -30,7 +30,7 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
.top-navbar .composed-app-icon-container > .app-icon {
|
||||
background-color: #fff; }
|
||||
|
||||
.header-breadcrumb-children {
|
||||
.breadcrumb-link-container {
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 2px rgba(0, 0, 0, 0.5), inset 0 3px 5px rgba(0, 0, 0, 0.6); }
|
||||
|
||||
/* Sidebar */
|
||||
|
|
|
|||
|
|
@ -30,8 +30,8 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
.top-navbar .composed-app-icon-container > .app-icon {
|
||||
background-color: #fff; }
|
||||
|
||||
.header-breadcrumb-children {
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 2px rgba(0, 0, 0, 0.5), inset 0 3px 5px rgba(0, 0, 0, 0.6); }
|
||||
.breadcrumb-link-container {
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 6px 0 rgba(0, 0, 0, 0.12); }
|
||||
|
||||
/* Sidebar */
|
||||
.sidebar {
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
.top-navbar .composed-app-icon-container > .app-icon {
|
||||
background-color: #fff; }
|
||||
|
||||
.header-breadcrumb-children {
|
||||
.breadcrumb-link-container {
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 2px rgba(0, 0, 0, 0.5), inset 0 3px 5px rgba(0, 0, 0, 0.6); }
|
||||
|
||||
/* Sidebar */
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
.top-navbar .composed-app-icon-container > .app-icon {
|
||||
background-color: #fff; }
|
||||
|
||||
.header-breadcrumb-children {
|
||||
.breadcrumb-link-container {
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 2px rgba(0, 0, 0, 0.5), inset 0 3px 5px rgba(0, 0, 0, 0.6); }
|
||||
|
||||
/* Sidebar */
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
.top-navbar .composed-app-icon-container > .app-icon {
|
||||
background-color: #fff; }
|
||||
|
||||
.header-breadcrumb-children {
|
||||
.breadcrumb-link-container {
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 2px rgba(0, 0, 0, 0.5), inset 0 3px 5px rgba(0, 0, 0, 0.6); }
|
||||
|
||||
/* Sidebar */
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
.top-navbar .composed-app-icon-container > .app-icon {
|
||||
background-color: #fff; }
|
||||
|
||||
.header-breadcrumb-children {
|
||||
.breadcrumb-link-container {
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 2px rgba(0, 0, 0, 0.5), inset 0 3px 5px rgba(0, 0, 0, 0.6); }
|
||||
|
||||
/* Sidebar */
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
.top-navbar .composed-app-icon-container > .app-icon {
|
||||
background-color: #fff; }
|
||||
|
||||
.header-breadcrumb-children {
|
||||
.breadcrumb-link-container {
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07), inset 0 -1px 2px rgba(0, 0, 0, 0.5), inset 0 3px 5px rgba(0, 0, 0, 0.6); }
|
||||
|
||||
/* Sidebar */
|
||||
|
|
|
|||
|
|
@ -5,8 +5,8 @@
|
|||
"main": "index.js",
|
||||
"scripts": {
|
||||
"test": "echo \"Error: no test specified\" && exit 1",
|
||||
"autobuild": "node-sass --watch scss -o ../css",
|
||||
"build": "node-sass scss -o ../css"
|
||||
"autobuild": "node-sass --watch scss -o ../css/themes",
|
||||
"build": "node-sass scss -o ../css/themes"
|
||||
},
|
||||
"author": "",
|
||||
"license": "ISC",
|
||||
|
|
|
|||
|
|
@ -10,9 +10,10 @@ $panelBorder: none !default;
|
|||
|
||||
$topNavbarColor: $dark !default;
|
||||
$navbarActiveColor: #d6d6d6 !default;
|
||||
$headerBreadcrumbLinksBoxshadow: 0 1px 0 rgba(255, 255, 255, 0.07),
|
||||
inset 0 -1px 2px rgba(0, 0, 0, 0.5),
|
||||
inset 0 3px 5px rgba(0, 0, 0, 0.6) !default;
|
||||
// $headerBreadcrumbLinksBoxshadow: 0 1px 0 rgba(255, 255, 255, 0.07),
|
||||
// inset 0 -1px 2px rgba(0, 0, 0, 0.5),
|
||||
// inset 0 3px 5px rgba(0, 0, 0, 0.6) !default;
|
||||
$headerBreadcrumbLinksBoxshadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 6px 0 rgba(0, 0, 0, 0.12) !default;
|
||||
|
||||
$sidebarBgColor: $light !default;
|
||||
$sidebarTextColor: $black !default;
|
||||
|
|
@ -65,7 +66,7 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
background-color:$white;
|
||||
}
|
||||
|
||||
.header-breadcrumb-children {
|
||||
.breadcrumb-link-container {
|
||||
box-shadow: $headerBreadcrumbLinksBoxshadow;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue