mirror of https://github.com/MISP/MISP
chg: [layout:sidebar] More improvements
Sami Mokaddem
parent
c21786e879
commit
02add76c64
|
|
@ -32,9 +32,9 @@ class Sidemenu {
|
|||
'icon' => $this->iconTable['Dashboard'],
|
||||
'url' => '/dashboards',
|
||||
],
|
||||
'More' => [
|
||||
'label' => __('More'),
|
||||
'icon' => 'ellipsis-h',
|
||||
'ListExport' => [
|
||||
'label' => __('List & Export'),
|
||||
'icon' => 'list-alt',
|
||||
'children' => [
|
||||
'Attributes' => [
|
||||
'label' => __('List Attributes'),
|
||||
|
|
@ -47,7 +47,7 @@ class Sidemenu {
|
|||
'url' => '/shadow_attributes/index/all:0',
|
||||
],
|
||||
'Delegation' => [
|
||||
'label' => __('View Delegation'),
|
||||
'label' => __('View Delegations'),
|
||||
'icon' => $this->iconTable['Events'],
|
||||
'url' => 'event_delegations/index/context:pending',
|
||||
],
|
||||
|
|
@ -87,9 +87,9 @@ class Sidemenu {
|
|||
'icon' => $this->iconTable['Galaxies'],
|
||||
'url' => '/galaxies/index',
|
||||
],
|
||||
'More' => [
|
||||
'label' => __('More'),
|
||||
'icon' => 'ellipsis-h',
|
||||
'Templates' => [
|
||||
'label' => __('Templates'),
|
||||
'icon' => 'ruler',
|
||||
'children' => [
|
||||
'ObjectTemplates' => [
|
||||
'label' => __('Object Templates'),
|
||||
|
|
@ -168,9 +168,9 @@ class Sidemenu {
|
|||
'icon' => $this->iconTable['Feeds'],
|
||||
'url' => '/feeds/index',
|
||||
],
|
||||
'More' => [
|
||||
'label' => __('More'),
|
||||
'icon' => 'ellipsis-h',
|
||||
'Communities' => [
|
||||
'label' => __('Communities'),
|
||||
'icon' => 'handshake',
|
||||
'children' => [
|
||||
'Communities' => [
|
||||
'label' => __('Communities'),
|
||||
|
|
@ -245,7 +245,7 @@ class Sidemenu {
|
|||
],
|
||||
'RestClient' => [
|
||||
'label' => __('REST Client'),
|
||||
'icon' => 'envelope-square',
|
||||
'icon' => $this->iconTable['RestClient'],
|
||||
'url' => '/api/rest',
|
||||
],
|
||||
'Statistics' => [
|
||||
|
|
|
|||
|
|
@ -53,22 +53,25 @@ class NavigationComponent extends Component
|
|||
['icon' => 'exclamation-triangle', 'class' => 'fa-inverse', 'style' => 'top: 0.2em;'],
|
||||
]],
|
||||
'Workflows' => 'sitemap',
|
||||
'CorrelationsExclusions' => 'ban',
|
||||
'CorrelationsExclusions' => ['stacked' => [
|
||||
['icon' => 'ban'],
|
||||
['icon' => 'project-diagram', 'class' => '', 'style' => ''],
|
||||
]],
|
||||
'DecayingModels' => 'hourglass',
|
||||
'ImportRegexp' => 'file-import',
|
||||
'SignatureAllowedlists' => 'fingerprint',
|
||||
'NoticeLists' => 'list-alt',
|
||||
'Correlations' => 'project-diagram',
|
||||
'Servers' => 'server',
|
||||
'Communities' => 'address-book',
|
||||
'Communities' => 'user-friends',
|
||||
'Cerebrate' => ['html' => '<img class="image-sidebar-icon" style="" src="/img/cerebrate-icon-purple.png"></img>'],
|
||||
'TaxiiServers' => ['html' => '<img class="image-sidebar-icon" style="" src="/img/taxii-icon.png"></img>'],
|
||||
'ServerSettings' => 'cogs',
|
||||
'Jobs' => 'robot',
|
||||
'BlockRules' => 'ban',
|
||||
'Logs' => 'history',
|
||||
'AccessLogs' => 'history',
|
||||
'ApplicationLogs' => 'history',
|
||||
'AccessLogs' => 'door-open',
|
||||
'ApplicationLogs' => 'list-ul',
|
||||
'OrganisationsRules' => ['stacked' => [
|
||||
['icon' => 'ban'],
|
||||
['icon' => 'building']
|
||||
|
|
@ -85,6 +88,10 @@ class NavigationComponent extends Component
|
|||
'API' => 'code',
|
||||
'UserSettings' => 'user-cog',
|
||||
'Inbox' => 'inbox',
|
||||
'RestClient' => ['stacked' => [
|
||||
['icon' => 'cloud'],
|
||||
['icon' => 'cog', 'class' => 'fa-inverse']
|
||||
]],
|
||||
];
|
||||
|
||||
public function initialize(array $config): void
|
||||
|
|
|
|||
|
|
@ -5,38 +5,8 @@ use Cake\Routing\Router;
|
|||
|
||||
<div class="action-bar d-flex flex-nowrap flex-row mt-2 mb-1 rounded">
|
||||
<?php
|
||||
if (!empty($links)) {
|
||||
echo '<div>';
|
||||
foreach ($links as $i => $linkEntry) {
|
||||
if (empty($linkEntry['route_path'])) {
|
||||
$active = false;
|
||||
} else {
|
||||
$active = $linkEntry['route_path'] == $route_path;
|
||||
}
|
||||
if (!empty($linkEntry['url_vars'])) {
|
||||
$linkEntry['url'] = $this->DataFromPath->buildStringFromDataPath($linkEntry['url'], $entity, $linkEntry['url_vars']);
|
||||
}
|
||||
if (!empty($linkEntry['selfLink'])) {
|
||||
$url = Router::url(null);
|
||||
} else {
|
||||
$url = Router::url($linkEntry['url']);
|
||||
}
|
||||
echo $this->Bootstrap->button([
|
||||
'text' => h($linkEntry['label']),
|
||||
'variant' => 'link',
|
||||
'outline' => $active,
|
||||
'size' => 'sm',
|
||||
'class' => ['text-nowrap'],
|
||||
'attrs' => [
|
||||
'href' => $url,
|
||||
],
|
||||
]);
|
||||
}
|
||||
echo '</div>';
|
||||
}
|
||||
|
||||
if (!empty($actions)) {
|
||||
echo '<div class="ms-auto">';
|
||||
echo '<div>';
|
||||
$badgeNumber = 0;
|
||||
foreach ($actions as $i => $actionEntry) {
|
||||
if (!empty($actionEntry['url_vars'])) {
|
||||
|
|
@ -64,5 +34,36 @@ use Cake\Routing\Router;
|
|||
}
|
||||
echo '</div>';
|
||||
}
|
||||
|
||||
if (!empty($links)) {
|
||||
echo '<div class="ms-auto">';
|
||||
foreach ($links as $i => $linkEntry) {
|
||||
if (empty($linkEntry['route_path'])) {
|
||||
$active = false;
|
||||
} else {
|
||||
$active = $linkEntry['route_path'] == $route_path;
|
||||
}
|
||||
if (!empty($linkEntry['url_vars'])) {
|
||||
$linkEntry['url'] = $this->DataFromPath->buildStringFromDataPath($linkEntry['url'], $entity, $linkEntry['url_vars']);
|
||||
}
|
||||
if (!empty($linkEntry['selfLink'])) {
|
||||
$url = Router::url(null);
|
||||
} else {
|
||||
$url = Router::url($linkEntry['url']);
|
||||
}
|
||||
echo $this->Bootstrap->button([
|
||||
'nodeType' => 'a',
|
||||
'text' => h($linkEntry['label']),
|
||||
'variant' => 'link',
|
||||
'outline' => $active,
|
||||
'size' => 'sm',
|
||||
'class' => ['text-nowrap'],
|
||||
'attrs' => [
|
||||
'href' => $url,
|
||||
],
|
||||
]);
|
||||
}
|
||||
echo '</div>';
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<div class="sidebar-wrapper d-flex flex-column">
|
||||
<div class="sidebar-scroll">
|
||||
<div class="sidebar-content">
|
||||
<ul class="sidebar-elements">
|
||||
<ul id="sidebar-elements" class="sidebar-elements">
|
||||
<?php foreach ($menu as $category => $categorized) : ?>
|
||||
<?php if ($category == '__bookmarks') : ?>
|
||||
<?php if ($bookmarkIncluded) : ?>
|
||||
|
|
|
|||
|
|
@ -226,6 +226,7 @@ main.content {
|
|||
.sidebar-wrapper {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.sidebar-scroll {
|
||||
|
|
@ -308,10 +309,11 @@ ul.sidebar-elements li > a.sidebar-link {
|
|||
position: relative;
|
||||
display: block;
|
||||
padding: 0 calc((var(--sidebar-width-collapsed) - 25px) / 2);
|
||||
line-height: 35px;
|
||||
line-height: 2em;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-decoration: none;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
|
|
@ -342,17 +344,28 @@ ul.sidebar-elements > li > a.sidebar-link > * {
|
|||
vertical-align: middle;
|
||||
}
|
||||
|
||||
a.sidebar-link > i.sidebar-icon .stacked-sidebar-icon {
|
||||
width: 2em;
|
||||
max-width: 2.5em;
|
||||
}
|
||||
|
||||
ul.sidebar-elements li.parent .sub-menu > li > a.sidebar-link > i.sidebar-icon {
|
||||
margin-right: 8px;
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
ul.sidebar-elements > li > a.sidebar-link > i.sidebar-icon {
|
||||
margin-right: 10px;
|
||||
font-size: 19px;
|
||||
font-size: 1.2em;
|
||||
min-width: 25px;
|
||||
line-height: 19px;
|
||||
}
|
||||
|
||||
ul.sidebar-elements > li > a.sidebar-link > i.sidebar-icon .stacked-sidebar-icon {
|
||||
min-width: 25px;
|
||||
max-width: 2.5em;
|
||||
}
|
||||
|
||||
.sidebar.expanded ul.sidebar-elements > li > a.sidebar-link > span.text,
|
||||
.sidebar:hover ul.sidebar-elements > li > a.sidebar-link > span.text {
|
||||
visibility: visible;
|
||||
|
|
@ -363,7 +376,7 @@ ul.sidebar-elements > li > a.sidebar-link > span.text {
|
|||
visibility: hidden;
|
||||
opacity: 0;
|
||||
transition: opacity 0.2s linear;
|
||||
line-height: 40px;
|
||||
line-height: 2em;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
|
|
@ -402,32 +415,32 @@ ul.sidebar-elements li.parent > a.sidebar-link:not(.collapsed)::before {
|
|||
display: none;
|
||||
}
|
||||
|
||||
ul.sidebar-elements > li ul {
|
||||
padding: 10px 0;
|
||||
ul.sidebar-elements > li ul.sub-menu {
|
||||
padding: 0.5em 0;
|
||||
list-style: none;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
ul.sidebar-elements > li ul li > a.sidebar-link {
|
||||
font-size: 0.95rem;
|
||||
font-size: 0.95em;
|
||||
padding-left: 35px;
|
||||
padding-right: 17px;
|
||||
}
|
||||
|
||||
ul.sidebar-elements > li ul li > ul > li > a.sidebar-link {
|
||||
font-size: 0.85rem;
|
||||
font-size: 0.85em;
|
||||
padding-left: 50px;
|
||||
padding-right: 14px;
|
||||
}
|
||||
|
||||
ul.sidebar-elements > li ul li > ul > li > ul > li > a.sidebar-link {
|
||||
font-size: 0.8rem;
|
||||
font-size: 0.8em;
|
||||
padding-left: 65px;
|
||||
padding-right: 11px;
|
||||
}
|
||||
|
||||
ul.sidebar-elements > li ul li > ul > li > ul > li > ul > li > a.sidebar-link {
|
||||
font-size: 0.78rem;
|
||||
font-size: 0.78em;
|
||||
padding-left: 80px;
|
||||
padding-right: 8px;
|
||||
}
|
||||
|
|
@ -436,9 +449,8 @@ ul.sidebar-elements > li ul li > ul > li > ul > li > ul > li > a.sidebar-link {
|
|||
ul.sidebar-elements > li.category {
|
||||
white-space: nowrap;
|
||||
display: flex;
|
||||
padding: 15px calc((var(--sidebar-width-collapsed) - 25px) / 2) 0;
|
||||
padding: 0.25em calc((var(--sidebar-width-collapsed) - 25px) / 2) 0;
|
||||
line-height: 30px;
|
||||
|
||||
}
|
||||
|
||||
.sidebar.expanded ul.sidebar-elements > li.category > span.category-label,
|
||||
|
|
|
|||
|
|
@ -34,7 +34,7 @@
|
|||
.text-white {color:white;}
|
||||
|
||||
.fa-stack-small {
|
||||
font-size: 0.7em;
|
||||
font-size: 0.6em;
|
||||
}
|
||||
|
||||
.lh-1 {
|
||||
|
|
|
|||
|
|
@ -668,13 +668,13 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active {
|
||||
background-color: #595f64;
|
||||
color: #fff;
|
||||
background-color: #595f64;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: #595f64;
|
||||
color: #fff;
|
||||
background-color: #595f64;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child::after {
|
||||
|
|
@ -682,23 +682,24 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link:hover {
|
||||
background-color: #60676c;
|
||||
color: #fff;
|
||||
color: #60676c;
|
||||
background-color: #ebebeb;
|
||||
}
|
||||
|
||||
.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;
|
||||
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;
|
||||
color: #60676c;
|
||||
background-color: #ebebeb;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active:hover {
|
||||
background-color: #50565a;
|
||||
color: #fff;
|
||||
color: #008462;
|
||||
background-color: #dee2e6;
|
||||
}
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
|
|
@ -710,10 +711,14 @@ ul.sidebar-elements li > a.sidebar-link.active::after {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu {
|
||||
background-color: #3e4346;
|
||||
background-color: #acafb2;
|
||||
box-shadow: inset #11111a1a 0px 0px 0px 1px;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu li > a.sidebar-link {
|
||||
color: #3e4346;
|
||||
}
|
||||
|
||||
/* Action bar */
|
||||
.action-bar {
|
||||
box-shadow: 0 0.15rem 0.3rem #00000026;
|
||||
|
|
|
|||
|
|
@ -664,17 +664,17 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link {
|
||||
color: #000;
|
||||
color: #343a40;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active {
|
||||
background-color: #dedede;
|
||||
color: #000;
|
||||
color: #0d6efd;
|
||||
background-color: #e9ecef;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: #dedede;
|
||||
color: #000;
|
||||
color: #0d6efd;
|
||||
background-color: #e9ecef;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child::after {
|
||||
|
|
@ -682,23 +682,24 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link:hover {
|
||||
background-color: lightgray;
|
||||
color: #000;
|
||||
color: #0c63e4;
|
||||
background-color: #e9ecef;
|
||||
}
|
||||
|
||||
.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;
|
||||
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: lightgray;
|
||||
color: #0c63e4;
|
||||
background-color: #e9ecef;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active:hover {
|
||||
background-color: #c8c8c8;
|
||||
color: #000;
|
||||
color: #094db1;
|
||||
background-color: #dee2e6;
|
||||
}
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
|
|
@ -710,10 +711,14 @@ ul.sidebar-elements li > a.sidebar-link.active::after {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu {
|
||||
background-color: #efefef;
|
||||
background-color: #f4f6f7;
|
||||
box-shadow: inset #11111a1a 0px 0px 0px 1px;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu li > a.sidebar-link {
|
||||
color: #495057;
|
||||
}
|
||||
|
||||
/* Action bar */
|
||||
.action-bar {
|
||||
box-shadow: 0 0.15rem 0.3rem #00000026;
|
||||
|
|
|
|||
|
|
@ -664,17 +664,17 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link {
|
||||
color: #000;
|
||||
color: #343a40;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active {
|
||||
background-color: #dedede;
|
||||
color: #18bc9c;
|
||||
background-color: #ecf0f1;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: #dedede;
|
||||
color: #18bc9c;
|
||||
background-color: #ecf0f1;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child::after {
|
||||
|
|
@ -682,23 +682,24 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link:hover {
|
||||
background-color: lightgray;
|
||||
color: #18bc9c;
|
||||
color: #16a98c;
|
||||
background-color: #ecf0f1;
|
||||
}
|
||||
|
||||
.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;
|
||||
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: lightgray;
|
||||
color: #16a98c;
|
||||
background-color: #ecf0f1;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active:hover {
|
||||
background-color: #c8c8c8;
|
||||
color: #18bc9c;
|
||||
color: #11846d;
|
||||
background-color: #dee2e6;
|
||||
}
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
|
|
@ -710,10 +711,14 @@ ul.sidebar-elements li > a.sidebar-link.active::after {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu {
|
||||
background-color: #efefef;
|
||||
background-color: #f6f8f8;
|
||||
box-shadow: inset #11111a1a 0px 0px 0px 1px;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu li > a.sidebar-link {
|
||||
color: #7b8a8b;
|
||||
}
|
||||
|
||||
/* Action bar */
|
||||
.action-bar {
|
||||
box-shadow: 0 0.15rem 0.3rem #00000026;
|
||||
|
|
|
|||
|
|
@ -668,13 +668,13 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active {
|
||||
background-color: #dedede;
|
||||
color: #18bc9c;
|
||||
background-color: #ecf0f1;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: #dedede;
|
||||
color: #18bc9c;
|
||||
background-color: #ecf0f1;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child::after {
|
||||
|
|
@ -682,23 +682,24 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link:hover {
|
||||
background-color: lightgray;
|
||||
color: #18bc9c;
|
||||
color: #16a98c;
|
||||
background-color: #ecf0f1;
|
||||
}
|
||||
|
||||
.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;
|
||||
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: lightgray;
|
||||
color: #16a98c;
|
||||
background-color: #ecf0f1;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active:hover {
|
||||
background-color: #c8c8c8;
|
||||
color: #18bc9c;
|
||||
color: #11846d;
|
||||
background-color: #dee2e6;
|
||||
}
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
|
|
@ -710,10 +711,14 @@ ul.sidebar-elements li > a.sidebar-link.active::after {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu {
|
||||
background-color: #efefef;
|
||||
background-color: #f6f8f8;
|
||||
box-shadow: inset #11111a1a 0px 0px 0px 1px;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu li > a.sidebar-link {
|
||||
color: #7b8a8b;
|
||||
}
|
||||
|
||||
/* Action bar */
|
||||
.action-bar {
|
||||
box-shadow: 0 0.15rem 0.3rem #00000026;
|
||||
|
|
|
|||
|
|
@ -668,13 +668,13 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active {
|
||||
background-color: #fff;
|
||||
color: #343a40;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: #fff;
|
||||
color: #343a40;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child::after {
|
||||
|
|
@ -682,23 +682,24 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link:hover {
|
||||
background-color: rgba(255, 255, 255, 0.46);
|
||||
color: #343a40;
|
||||
color: rgba(255, 255, 255, 0.46);
|
||||
background-color: #e9e9e8;
|
||||
}
|
||||
|
||||
.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;
|
||||
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: rgba(255, 255, 255, 0.46);
|
||||
color: rgba(255, 255, 255, 0.46);
|
||||
background-color: #e9e9e8;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active:hover {
|
||||
background-color: rgba(255, 255, 255, 0.58);
|
||||
color: #343a40;
|
||||
color: rgba(255, 255, 255, 0.58);
|
||||
background-color: #dee2e6;
|
||||
}
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
|
|
@ -710,10 +711,14 @@ ul.sidebar-elements li > a.sidebar-link.active::after {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu {
|
||||
background-color: rgba(211, 211, 211, 0.43);
|
||||
background-color: white;
|
||||
box-shadow: inset #11111a1a 0px 0px 0px 1px;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu li > a.sidebar-link {
|
||||
color: rgba(211, 211, 211, 0.43);
|
||||
}
|
||||
|
||||
/* Action bar */
|
||||
.action-bar {
|
||||
box-shadow: 0 0.15rem 0.3rem #00000026;
|
||||
|
|
|
|||
|
|
@ -668,13 +668,13 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active {
|
||||
background-color: #595f64;
|
||||
color: #fff;
|
||||
background-color: #595f64;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: #595f64;
|
||||
color: #fff;
|
||||
background-color: #595f64;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child::after {
|
||||
|
|
@ -682,23 +682,24 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link:hover {
|
||||
background-color: #60676c;
|
||||
color: #fff;
|
||||
color: #60676c;
|
||||
background-color: #e9ecef;
|
||||
}
|
||||
|
||||
.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;
|
||||
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;
|
||||
color: #60676c;
|
||||
background-color: #e9ecef;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active:hover {
|
||||
background-color: #50565a;
|
||||
color: #fff;
|
||||
color: #b3b3b3;
|
||||
background-color: #dee2e6;
|
||||
}
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
|
|
@ -714,6 +715,10 @@ ul.sidebar-elements li > a.sidebar-link.active::after {
|
|||
box-shadow: inset #11111a1a 0px 0px 0px 1px;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu li > a.sidebar-link {
|
||||
color: #52575c;
|
||||
}
|
||||
|
||||
/* Action bar */
|
||||
.action-bar {
|
||||
box-shadow: 0 0.15rem 0.3rem #00000026;
|
||||
|
|
|
|||
|
|
@ -668,13 +668,13 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active {
|
||||
background-color: #343a40;
|
||||
color: #3cf281;
|
||||
background-color: #343a40;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: #343a40;
|
||||
color: #3cf281;
|
||||
background-color: #343a40;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child::after {
|
||||
|
|
@ -682,23 +682,24 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link:hover {
|
||||
background-color: #495057;
|
||||
color: #3cf281;
|
||||
color: #495057;
|
||||
background-color: #e9ecef;
|
||||
}
|
||||
|
||||
.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;
|
||||
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;
|
||||
color: #495057;
|
||||
background-color: #e9ecef;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active:hover {
|
||||
background-color: #5d6166;
|
||||
color: #3cf281;
|
||||
color: #5d6166;
|
||||
background-color: #dee2e6;
|
||||
}
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
|
|
@ -710,10 +711,14 @@ ul.sidebar-elements li > a.sidebar-link.active::after {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu {
|
||||
background-color: #230f34;
|
||||
background-color: #9a9da0;
|
||||
box-shadow: inset #11111a1a 0px 0px 0px 1px;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu li > a.sidebar-link {
|
||||
color: #230f34;
|
||||
}
|
||||
|
||||
/* Action bar */
|
||||
.action-bar {
|
||||
box-shadow: 0 0.15rem 0.3rem #00000026;
|
||||
|
|
|
|||
|
|
@ -35,13 +35,17 @@ $headerBreadcrumbLinksBoxshadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 6px 0 rg
|
|||
$headerBreadcrumbLinksBGColor: $light !default;
|
||||
|
||||
$sidebarBgColor: $light !default;
|
||||
$sidebarTextColor: $black !default;
|
||||
$sidebarActiveColor: $black !default;
|
||||
$sidebarTextColor: $gray-800 !default;
|
||||
$sidebarActiveColor: $link-color !default;
|
||||
$sidebarHoverColor: shift-color($link-color, 10%) !default;
|
||||
$sidebarHoverActiveColor: shift-color($link-color, 30%) !default;
|
||||
|
||||
$sidebarActiveBgColor: #dedede !default;
|
||||
$sidebarSubmenuColor: tint-color($sidebarActiveBgColor, 50%) !default;
|
||||
$sidebarHoverColor: shade-color($sidebarActiveBgColor, 5%) !default;
|
||||
$sidebarHoverActiveColor: shade-color($sidebarActiveBgColor, 10%) !default;
|
||||
$sidebarActiveBgColor: $gray-200 !default;
|
||||
$sidebarHoverBgColor: $gray-200 !default;
|
||||
$sidebarHoverActiveBgColor: $gray-300 !default;
|
||||
|
||||
$sidebarSubmenuColor: $gray-700 !default;
|
||||
$sidebarSubmenuBgColor: tint-color($sidebarActiveBgColor, 50%) !default;
|
||||
$sidebarBorder: #ddd !default;
|
||||
$sidebarShadows: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 6px 0 rgba(0, 0, 0, 0.12) !default;
|
||||
$sidebarLockButton: $light !default;
|
||||
|
|
@ -172,36 +176,46 @@ header.top-navbar .header-breadcrumb .header-breadcrumb-item > a:hover {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active {
|
||||
// background-color: $sidebarActiveBgColor;
|
||||
// color: $sidebarActiveColor
|
||||
color: $sidebarActiveColor;
|
||||
background-color: $sidebarActiveBgColor;
|
||||
color: $sidebarActiveColor
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child {
|
||||
background-color: $sidebarActiveBgColor;
|
||||
// background-color: $sidebarActiveBgColor;
|
||||
// color: $sidebarActiveColor;
|
||||
color: $sidebarActiveColor;
|
||||
background-color: $sidebarActiveBgColor;
|
||||
}
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.have-active-child::after {
|
||||
background-color: $activeSidebarLinkColor;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link:hover {
|
||||
background-color: $sidebarHoverColor;
|
||||
color: $sidebarActiveColor;
|
||||
// background-color: $sidebarHoverColor;
|
||||
// color: $sidebarActiveColor;
|
||||
color: $sidebarHoverColor;
|
||||
background-color: $sidebarHoverBgColor;
|
||||
}
|
||||
|
||||
.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;
|
||||
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: $sidebarHoverColor;
|
||||
// background-color: $sidebarHoverColor;
|
||||
color: $sidebarHoverColor;
|
||||
background-color: $sidebarHoverBgColor;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li > a.sidebar-link.active:hover {
|
||||
background-color: $sidebarHoverActiveColor;
|
||||
color: $sidebarActiveColor;
|
||||
// background-color: $sidebarHoverActiveColor;
|
||||
// color: $sidebarActiveColor;
|
||||
color: $sidebarHoverActiveColor;
|
||||
background-color: $sidebarHoverActiveBgColor;
|
||||
}
|
||||
|
||||
ul.sidebar-elements li > a.sidebar-link.active::after {
|
||||
|
|
@ -213,10 +227,14 @@ ul.sidebar-elements li > a.sidebar-link.active::after {
|
|||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu {
|
||||
background-color: $sidebarSubmenuColor;
|
||||
background-color: $sidebarSubmenuBgColor;
|
||||
box-shadow: inset #11111a1a 0px 0px 0px 1px;
|
||||
}
|
||||
|
||||
.sidebar ul.sidebar-elements li ul.sub-menu li > a.sidebar-link {
|
||||
color: $sidebarSubmenuColor;
|
||||
}
|
||||
|
||||
/* Action bar */
|
||||
.action-bar {
|
||||
box-shadow: 0 0.15rem 0.3rem #00000026;
|
||||
|
|
|
|||
Loading…
Reference in New Issue