From 98f972e557047a626880692189fdae68269a732e Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Sun, 11 Feb 2024 23:11:28 +0200 Subject: menu-item improvements --- src/App.scss | 84 ++++-------------------------------------------------------- 1 file changed, 5 insertions(+), 79 deletions(-) (limited to 'src/App.scss') diff --git a/src/App.scss b/src/App.scss index a8eecaf5..1f9bab40 100644 --- a/src/App.scss +++ b/src/App.scss @@ -129,15 +129,6 @@ i[class*="icon-"], color: var(--icon); } -.button-unstyled:hover, -a:hover { - > i[class*="icon-"], - > .svg-inline--fa, - > .iconLetter { - color: var(--text); - } -} - nav { z-index: var(--ZI_navbar); background-color: $fallback--fg; @@ -192,8 +183,7 @@ nav { grid-column: 1 / span 3; grid-row: 1 / 1; pointer-events: none; - background-color: rgb(0 0 0 / 15%); - background-color: var(--underlay, rgb(0 0 0 / 15%)); + background-color: var(--underlay); z-index: -1000; } @@ -363,10 +353,7 @@ nav { .button-default { user-select: none; - color: $fallback--text; - color: var(--btnText, $fallback--text); - background-color: $fallback--fg; - background-color: var(--btn, $fallback--fg); + color: var(--text); border: none; border-radius: $fallback--btnRadius; border-radius: var(--btnRadius, $fallback--btnRadius); @@ -376,70 +363,12 @@ nav { font-family: sans-serif; font-family: var(--interfaceFont, sans-serif); - &.-sublime { - background: transparent; - } - - i[class*="icon-"], - .svg-inline--fa { - color: var(--icon); - } - &::-moz-focus-inner { border: none; } - &:active { - color: $fallback--text; - color: var(--btnPressedText, $fallback--text); - background-color: $fallback--fg; - background-color: var(--btnPressed, $fallback--fg); - - svg, - i { - color: $fallback--text; - color: var(--btnPressedText, $fallback--text); - } - } - &:disabled { cursor: not-allowed; - color: $fallback--text; - color: var(--btnDisabledText, $fallback--text); - background-color: $fallback--fg; - background-color: var(--btnDisabled, $fallback--fg); - - svg, - i { - color: $fallback--text; - color: var(--btnDisabledText, $fallback--text); - } - } - - &.toggled { - color: $fallback--text; - color: var(--btnToggledText, $fallback--text); - background-color: $fallback--fg; - background-color: var(--btnToggled, $fallback--fg); - box-shadow: - 0 0 4px 0 rgb(255 255 255 / 30%), - 0 1px 0 0 rgb(0 0 0 / 20%) inset, - 0 -1px 0 0 rgb(255 255 255 / 20%) inset; - box-shadow: var(--buttonPressedShadow); - - svg, - i { - color: $fallback--text; - color: var(--btnToggledText, $fallback--text); - } - } - - &.danger { - // TODO: add better color variable - color: $fallback--text; - color: var(--alertErrorPanelText, $fallback--text); - background-color: $fallback--alertError; - background-color: var(--alertError, $fallback--alertError); } } @@ -458,8 +387,7 @@ nav { color: inherit; &.-link { - color: $fallback--link; - color: var(--link, $fallback--link); + color: var(--link); } &.-fullwidth { @@ -510,7 +438,6 @@ textarea { &[disabled="disabled"], &.disabled { cursor: not-allowed; - opacity: 0.5; } &[type="range"] { @@ -610,9 +537,7 @@ textarea { } option { - color: $fallback--text; - color: var(--text, $fallback--text); - background-color: $fallback--bg; + color: var(--text); background-color: var(--bg, $fallback--bg); } @@ -746,6 +671,7 @@ option { .faint { --text: var(--textFaint); --textGreentext: var(--textGreentextFaint); + --textCyantext: var(--textCyantextFaint); --link: var(--linkFaint); color: var(--text); -- cgit v1.2.3-70-g09d2