Skip to content

Commit e43c4b7

Browse files
rschuchmannfproske
rschuchmann
authored and
fproske
committed
[UI]The default navigation bar color in light mode has been switched to white (with subtle gradient).
1 parent 356bc50 commit e43c4b7

18 files changed

+119
-98
lines changed

‎doc/release.html‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -150,6 +150,10 @@ <h3>Minor new features and improvements</h3>
150150
other minor spacing and design improvements, creates a
151151
much cleaner workspace.
152152
</li>
153+
<li>
154+
The default navigation bar color in light mode has been
155+
switched to white.
156+
</li>
153157
<li>
154158
The default primary color in dark mode has been
155159
switched to blue.

‎src/less/3_adminlte/less/boxes.less‎

Lines changed: 29 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -136,38 +136,35 @@
136136
.box-solid-variant(@red);
137137
}
138138
&.box-warning {
139-
.responsiveDark(
140-
{
141-
border: 1px solid @yellow;
142-
> .box-header {
143-
@header-fg: @if-4bc80e64;
144-
145-
color: @header-fg;
146-
background: @yellow;
147-
background-color: @yellow;
148-
149-
a,
150-
.btn {
151-
color: @header-fg;
152-
}
153-
}
154-
},
155-
{
156-
border: 1px solid @yellow-dark-gamsinter;
157-
> .box-header {
158-
@header-fg-dark: @if-a8c57869;
159-
160-
color: @header-fg-dark;
161-
background: @yellow-dark-gamsinter;
162-
background-color: @yellow-dark-gamsinter;
163-
164-
a,
165-
.btn {
166-
color: @header-fg-dark;
167-
}
168-
}
169-
}
170-
);
139+
.responsiveDark({
140+
border: 1px solid @yellow;
141+
> .box-header {
142+
@header-fg: @if-4bc80e64;
143+
144+
color: @header-fg;
145+
background: @yellow;
146+
background-color: @yellow;
147+
148+
a,
149+
.btn {
150+
color: @header-fg;
151+
}
152+
}
153+
}; {
154+
border: 1px solid @yellow-dark-gamsinter;
155+
> .box-header {
156+
@header-fg-dark: @if-a8c57869;
157+
158+
color: @header-fg-dark;
159+
background: @yellow-dark-gamsinter;
160+
background-color: @yellow-dark-gamsinter;
161+
162+
a,
163+
.btn {
164+
color: @header-fg-dark;
165+
}
166+
}
167+
});
171168
}
172169
&.box-success {
173170
.box-solid-variant(@green);

‎src/less/3_adminlte/less/mixins.less‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -136,9 +136,11 @@
136136
.left-side {
137137
.responsiveDark({
138138
background-color: @sidebar-dark-bg;
139+
background-image: @miro-sidebar-color-gradient;
139140
},
140141
{
141142
background-color: @sidebar-dark-bg-dark;
143+
background-image: none;
142144
});
143145
}
144146
//User Panel (resides in the sidebar)

‎src/less/3_adminlte/less/skins/skin-black.less‎

Lines changed: 40 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -30,54 +30,51 @@
3030
border-right: 1px solid #eee;
3131
}
3232
.navbar {
33-
.responsiveDark(
34-
{
35-
background-color: @navbar-main;
36-
.nav > li > a {
37-
color: @navbar-icons;
38-
}
39-
.nav > li > a:hover,
40-
.nav > li > a:active,
41-
.nav > li > a:focus,
42-
.nav .open > a,
43-
.nav .open > a:hover,
44-
.nav .open > a:focus,
45-
.nav > .active > a {
46-
background: @navbar-main;
33+
.responsiveDark({
34+
background-color: @navbar-main;
35+
.nav > li > a {
36+
color: @navbar-icons;
37+
}
38+
.nav > li > a:hover,
39+
.nav > li > a:active,
40+
.nav > li > a:focus,
41+
.nav .open > a,
42+
.nav .open > a:hover,
43+
.nav .open > a:focus,
44+
.nav > .active > a {
45+
background: @navbar-main;
46+
color: @navbar-hover;
47+
}
48+
.sidebar-toggle {
49+
color: @navbar-icons;
50+
&:hover {
4751
color: @navbar-hover;
52+
background: @navbar-main;
4853
}
49-
.sidebar-toggle {
50-
color: @navbar-icons;
51-
&:hover {
52-
color: @navbar-hover;
53-
background: @navbar-main;
54-
}
55-
}
56-
},
57-
{
58-
background-color: @navbar-main-dark;
59-
.nav > li > a {
60-
color: @navbar-icons-dark;
61-
}
62-
.nav > li > a:hover,
63-
.nav > li > a:active,
64-
.nav > li > a:focus,
65-
.nav .open > a,
66-
.nav .open > a:hover,
67-
.nav .open > a:focus,
68-
.nav > .active > a {
69-
background: @navbar-main-dark;
54+
}
55+
}; {
56+
background-color: @navbar-main-dark;
57+
.nav > li > a {
58+
color: @navbar-icons-dark;
59+
}
60+
.nav > li > a:hover,
61+
.nav > li > a:active,
62+
.nav > li > a:focus,
63+
.nav .open > a,
64+
.nav .open > a:hover,
65+
.nav .open > a:focus,
66+
.nav > .active > a {
67+
background: @navbar-main-dark;
68+
color: @navbar-hover-dark;
69+
}
70+
.sidebar-toggle {
71+
color: @navbar-icons-dark;
72+
&:hover {
7073
color: @navbar-hover-dark;
71-
}
72-
.sidebar-toggle {
73-
color: @navbar-icons-dark;
74-
&:hover {
75-
color: @navbar-hover-dark;
76-
background: @navbar-main-dark;
77-
}
74+
background: @navbar-main-dark;
7875
}
7976
}
80-
);
77+
});
8178
> .sidebar-toggle {
8279
.responsiveDark({
8380
color: @navbar-icons;

‎src/less/8_miro/miro.less‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -495,6 +495,14 @@ animation: none !important;
495495
margin-right: 8px;
496496
}
497497
/* sidebar*/
498+
body > .wrapper > .main-sidebar {
499+
.responsiveDark({
500+
border-right: 1px solid #e4e4e6;
501+
},
502+
{
503+
border-right: 0;
504+
});
505+
}
498506
.bt-highlight-1{
499507
.responsiveDark({
500508
border: 1px solid @secondary-color;
@@ -634,6 +642,9 @@ animation: none !important;
634642
.sidebar-menu i {
635643
margin-right: 4px;
636644
}
645+
#btCompareScen {
646+
margin-top: 0;
647+
}
637648
.sidebar-menu .sidebar-separator {
638649
margin: 8px 8px 20px;
639650
border-color: @if-f5e54611;

‎src/less/skins/variables/global_variables.less‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -166,6 +166,7 @@
166166
@notification-bg-dark: var(--miro-notification-bg-dark);
167167
@miro-logo: var(--miro-logo);
168168
@miro-logo-dark: var(--miro-logo-dark);
169+
@miro-sidebar-color-gradient: var(--miro-sidebar-color-gradient);
169170

170171
//need to be fix hex values
171172
@text-color: #eeeeee;

‎src/tools/config/cg_colors.R‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -403,6 +403,9 @@ derivePalette <- function(b = baseColors) {
403403
if_a8c57869 <- if (abs(luma("#030303") - luma(b$miro_text_color_dark)) < 15) contrast("#030303") else b$miro_text_color_dark
404404
v[["miro_if_a8c57869"]] <- if_a8c57869
405405

406+
v[["body_bg_gradient"]] <- "none"
407+
v[["miro_sidebar_color_gradient"]] <- "none"
408+
406409
v
407410
}
408411
cssName <- function(id) {

‎src/tools/config/server.R‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -155,7 +155,7 @@ inputWidgetAliases <- vapply(seq_along(configJSON$inputWidgets)[match(inputWidge
155155
baseColors <- list(
156156
miro_primary_color = "#295f98",
157157
miro_secondary_color = "#f39619",
158-
miro_sidebar_color = "#1f2937",
158+
miro_sidebar_color = "#ffffff",
159159
miro_navbar_color = "#ffffff",
160160
miro_body_bg_color = "#ECF1F4",
161161
miro_alert_color = "#d11a2a",

‎src/www/colors_blackandwhite.css‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -168,4 +168,5 @@
168168
--miro-notification-bg-dark: #000000;
169169
--miro-logo: url('miro_logo_light.png');
170170
--miro-logo-dark: url('miro_logo_light_dark.png');
171+
--miro-sidebar-color-gradient: none;
171172
}

‎src/www/colors_darkblue.css‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -168,4 +168,5 @@
168168
--miro-notification-bg-dark: #000000;
169169
--miro-logo: url('miro_logo_light.png');
170170
--miro-logo-dark: url('miro_logo_light_dark.png');
171+
--miro-sidebar-color-gradient: none;
171172
}

0 commit comments

Comments
 (0)