public/grafana
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Themes: Add border to sidemenu, and reduce border in dark theme a tiny bit (#34737) (#34950)

Browse Source 
* Themes: Add border to sidemenu, and reduce border in dark theme a tiny bit

* Updated

(cherry picked from commit d6a9a9b975)

Co-authored-by: Torkel Ödegaard <torkel@grafana.org>
This commit is contained in:
Grot (@grafanabot)
2021-05-29 07:34:25 +02:00
committed by GitHub
co-authored by Torkel Ödegaard
parent e9b6b66a46
commit 55cbd415a2
3 changed files with 9 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/grafana-data/src/themes/createColors.ts
+1 -1
View File
@@ -88,7 +88,7 @@ class DarkColors implements ThemeColorsBase<Partial<ThemeRichColor>> {
whiteBase = '201, 209, 217'; whiteBase = '201, 209, 217';
border = { border = {
weak: `rgba(${this.whiteBase}, 0.08)`, weak: `rgba(${this.whiteBase}, 0.07)`,
medium: `rgba(${this.whiteBase}, 0.15)`, medium: `rgba(${this.whiteBase}, 0.15)`,
strong: `rgba(${this.whiteBase}, 0.25)`, strong: `rgba(${this.whiteBase}, 0.25)`,
}; };
public/sass/_variables.dark.generated.scss
+7 -7
View File
@@ -61,9 +61,9 @@ $layer0: #111217;
$layer1: #181b1f; $layer1: #181b1f;
$layer2: #22252b; $layer2: #22252b;
$divider: rgba(201, 209, 217, 0.08); $divider: rgba(201, 209, 217, 0.07);
$border0: rgba(201, 209, 217, 0.08); $border0: rgba(201, 209, 217, 0.07);
$border1: rgba(201, 209, 217, 0.15); $border1: rgba(201, 209, 217, 0.15);
// Accent colors // Accent colors
@@ -130,7 +130,7 @@ $hr-border-color: $dark-9;
// Panel // Panel
// ------------------------- // -------------------------
$panel-bg: #181b1f; $panel-bg: #181b1f;
$panel-border: 1px solid rgba(201, 209, 217, 0.08); $panel-border: 1px solid rgba(201, 209, 217, 0.07);
$panel-header-hover-bg: rgba(201, 209, 217, 0.08); $panel-header-hover-bg: rgba(201, 209, 217, 0.08);
$panel-box-shadow: none; $panel-box-shadow: none;
$panel-corner: $panel-bg; $panel-corner: $panel-bg;
@@ -231,9 +231,9 @@ $typeahead-selected-color: $yellow;
// Dropdowns // Dropdowns
// ------------------------- // -------------------------
$dropdownBackground: #181b1f; $dropdownBackground: #181b1f;
$dropdownBorder: rgba(201, 209, 217, 0.08); $dropdownBorder: rgba(201, 209, 217, 0.07);
$dropdownDividerTop: rgba(201, 209, 217, 0.08); $dropdownDividerTop: rgba(201, 209, 217, 0.07);
$dropdownDividerBottom: rgba(201, 209, 217, 0.08); $dropdownDividerBottom: rgba(201, 209, 217, 0.07);
$dropdownShadow: 0px 10px 20px rgb(20,20,20); $dropdownShadow: 0px 10px 20px rgb(20,20,20);
$dropdownLinkColor: $link-color; $dropdownLinkColor: $link-color;
@@ -295,7 +295,7 @@ $tooltipShadow: 0px 4px 8px rgba(24, 26, 27, 0.75);
$popover-bg: #181b1f; $popover-bg: #181b1f;
$popover-color: rgb(201, 209, 217); $popover-color: rgb(201, 209, 217);
$popover-border-color: rgba(201, 209, 217, 0.08); $popover-border-color: rgba(201, 209, 217, 0.07);
$popover-header-bg: #22252b; $popover-header-bg: #22252b;
$popover-shadow: 0px 10px 20px rgb(20,20,20); $popover-shadow: 0px 10px 20px rgb(20,20,20);
public/sass/components/_sidemenu.scss
+1
View File
@@ -7,6 +7,7 @@ $mobile-menu-breakpoint: md;
flex-direction: column; flex-direction: column;
width: $side-menu-width; width: $side-menu-width;
z-index: $zindex-sidemenu; z-index: $zindex-sidemenu;
border-right: $panel-border;
a:focus { a:focus {
text-decoration: none; text-decoration: none;