💄 Material dark original, improved variable inheritance

This commit is contained in:
Alicia Sykes 2021-10-30 23:55:52 +01:00
parent c7fc62534a
commit e39b14a16d
1 changed files with 26 additions and 24 deletions

View File

@ -239,21 +239,23 @@ html[data-theme='material-original'] {
html[data-theme='material-dark-original'] {
--primary: #08B0BB;
--settings-text-color: #08B0BB;
--background: #39434C;
--background-darker: #08B0BB;
--background-darker: var(--primary);
--material-dark: #131a1f;
--material-light: #41e2ed;
--settings-text-color: var(--primary);
--settings-background: #092b3a;
--item-group-background: #333C43;
--item-background: #414B55;
--item-background-hover: #414B55;
--settings-background: #131a1f;
--search-container-background: #131a1f;
--search-field-background: #39434c;
--heading-text-color: #131a1f;
--nav-link-text-color: #08B0BB;
--nav-link-background-color: #131a1f;
--nav-link-text-color-hover: #08B0BB;
--nav-link-background-color-hover: #131a1fc7;
--settings-background: var(--material-dark);
--search-container-background: var(--material-dark);
--search-field-background: var(--background);
--heading-text-color: var(--material-dark);
--nav-link-text-color: var(--primary);
--nav-link-background-color: var(--material-dark);
--nav-link-text-color-hover: var(--primary);
--nav-link-background-color-hover: var(--material-dark);
--nav-link-border-color-hover: transparent;
--curve-factor: 2px;
--curve-factor-navbar: 0;
@ -262,25 +264,25 @@ html[data-theme='material-dark-original'] {
--item-hover-shadow: 4px 4px 3px #00000082, 0 1px 10px #00000040;
--item-icon-transform: drop-shadow(1px 2px 1px var(--transparent-30)) saturate(0.65);
--item-icon-transform-hover: drop-shadow(1px 3px 2px var(--transparent-30)) saturate(2);
--welcome-popup-background: #131a1f;
--welcome-popup-background: var(--material-dark);
--welcome-popup-text-color: var(--primary);
--config-settings-background: #131a1f;
--config-settings-color: #41e2ed;
--interactive-editor-color: #41e2ed;
--interactive-editor-background: #131a1f;
--interactive-editor-background-darker: #092b3a;
--scroll-bar-color: #08B0BB;
--scroll-bar-background: #131a1f;
--status-check-tooltip-background: #131a1f;
--status-check-tooltip-color: #08B0BB;
--description-tooltip-background: #131a1f;
--description-tooltip-color: #08B0BB;
--config-settings-background: var(--material-dark);
--config-settings-color: var(--material-light);
--interactive-editor-color: var(--material-light);
--interactive-editor-background: var(--material-dark);
--interactive-editor-background-darker: var(--material-dark);
--scroll-bar-color: var(--primary);
--scroll-bar-background: var(--material-dark);
--status-check-tooltip-background: var(--material-dark);
--status-check-tooltip-color: var(--primary);
--description-tooltip-background: var(--material-dark);
--description-tooltip-color: var(--primary);
&::-webkit-scrollbar-thumb {
border-left: 1px solid #131a1f;
border-left: 1px solid var(--material-dark);
}
div.context-menu {
border: none;
background: #131a1f;
background: var(--material-dark);
ul li:hover {
background: #333c43;
}