tyler.durden
/
icingaweb2
mirror of https://github.com/Icinga/icingaweb2.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Integrate light theme's `@menu-bg-color` using a media query

This commit is contained in:
Johannes Meyer 2021-06-23 11:15:35 +02:00
parent 96687e37c6
commit 05acbd0a3f
6 changed files with 15 additions and 11 deletions

6
public/css/icinga/base.less
View File

@ -60,6 +60,8 @@
// Menu colors // Menu colors
@menu-bg-color: #06062B; @menu-bg-color: #06062B;
@menu-hover-bg-color: fade(@menu-bg-color, 50%);
@menu-search-hover-bg-color: darken(@menu-bg-color, 20%);
@menu-active-bg-color: #181742; @menu-active-bg-color: #181742;
@menu-color: #DBDBDB; @menu-color: #DBDBDB;
@menu-active-color: @text-color; @menu-active-color: @text-color;
@ -104,6 +106,10 @@
--text-color-on-icinga-blue: #F5F9FA; --text-color-on-icinga-blue: #F5F9FA;
--menu-flyout-bg-color: #F5F9FA; --menu-flyout-bg-color: #F5F9FA;
--tab-hover-bg-color: fade(#F5F9FA, 50%); --tab-hover-bg-color: fade(#F5F9FA, 50%);
--menu-bg-color: #DEECF1;
--menu-hover-bg-color: fade(#DEECF1, 50%);
--menu-search-hover-bg-color: darken(#DEECF1, 20%);
} }
} }

6
public/css/icinga/layout.less
View File

@ -32,7 +32,7 @@
} }
#header-logo-container { #header-logo-container {
background: @menu-bg-color; .var(background, menu-bg-color);
height: 6em; height: 6em;
padding: 1.25em; padding: 1.25em;
width: 16em; width: 16em;
@ -141,7 +141,7 @@
// Mobile menu // Mobile menu
#layout.minimal-layout #sidebar { #layout.minimal-layout #sidebar {
background-color: @menu-bg-color; .var(background-color, menu-bg-color);
} }
#mobile-menu-toggle { #mobile-menu-toggle {
@ -332,7 +332,7 @@
} }
#search:focus { #search:focus {
background-color: @menu-bg-color; .var(background-color, menu-bg-color);
border-radius: 0 .25em .25em 0; border-radius: 0 .25em .25em 0;
box-shadow: 0 0 .25em 0 rgba(0, 0, 0, .2); box-shadow: 0 0 .25em 0 rgba(0, 0, 0, .2);
color: @menu-color; color: @menu-color;

2
public/css/icinga/login.less
View File

@ -4,7 +4,7 @@
#login { #login {
height: 100%; height: 100%;
background-color: @menu-bg-color; .var(background-color, menu-bg-color);
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center center; background-position: center center;
text-align: center; text-align: center;

8
public/css/icinga/menu.less
View File

@ -10,7 +10,7 @@
@icon-width: 1.7em; // 1.5em width + 0.2em right margin @icon-width: 1.7em; // 1.5em width + 0.2em right margin
#menu { #menu {
background-color: @menu-bg-color; .var(background-color, menu-bg-color);
width: 100%; width: 100%;
flex: 1; flex: 1;
overflow: auto; overflow: auto;
@ -92,7 +92,7 @@
&:not(.selected) > a:hover, &:not(.selected) > a:hover,
&:not(.selected) > a:focus { &:not(.selected) > a:focus {
background-color: fade(@menu-bg-color, 50%) .var(background-color, menu-hover-bg-color);
} }
// Balance icon weight for non active menu items // Balance icon weight for non active menu items
@ -222,7 +222,7 @@
&:hover, &:hover,
&:focus { &:focus {
background-color: darken(@menu-bg-color, 20); .var(background-color, menu-search-hover-bg-color);
} }
} }
@ -402,7 +402,7 @@
&:focus, &:focus,
&:hover { &:hover {
background-color: darken(@menu-bg-color, 20); .var(background-color, menu-search-hover-bg-color);
outline: none; outline: none;
} }
} }

2
public/css/icinga/tabs.less
View File

@ -3,7 +3,7 @@
// Styles for tab navigation of containers // Styles for tab navigation of containers
.tabs { .tabs {
background-color: @menu-bg-color; .var(background-color, menu-bg-color);
letter-spacing: -0.417em; letter-spacing: -0.417em;
} }

2
public/css/themes/icinga-light-theme.less
View File

@ -7,8 +7,6 @@
@text-color: #535353; @text-color: #535353;
@menu-bg-color: #DEECF1;
@menu-color: #676767; @menu-color: #676767;
@menu-active-bg-color: #EDF7FC; @menu-active-bg-color: #EDF7FC;