better hover colors

This commit is contained in:
Víctor Losada Hernández
2026-09-06 18:13:11 +02:00
parent e0707e2bb1
commit 47b85966d2
2 changed files with 9 additions and 11 deletions
+5 -1
View File
@@ -7,7 +7,7 @@
@property --activeTriggerColor { @property --activeTriggerColor {
syntax: '<color>'; syntax: '<color>';
inherits: true; inherits: true;
initial-value: #DDD; initial-value: #999;
} }
:root{ :root{
@@ -30,4 +30,8 @@
} }
.menu-wrapper:has(:popover-open) > button { // if menu is open... .menu-wrapper:has(:popover-open) > button { // if menu is open...
background-color: var(--activeTriggerColor, hsl(from var(--menuColor) h s calc(l * .85))); // tint menu triggers based on menu color background-color: var(--activeTriggerColor, hsl(from var(--menuColor) h s calc(l * .85))); // tint menu triggers based on menu color
}
.darkMode .menu-wrapper:has(:popover-open) > button { // if menu is open...
--activeTriggerColor : #444; // tint menu triggers based on menu color
} }
@@ -3,10 +3,9 @@
@import (less) '@themes/fonts/5e/fonts.less'; @import (less) '@themes/fonts/5e/fonts.less';
.snippetBar { .snippetBar {
--activeTriggerColor: inherit;
--menuColor : #DDDDDD; --menuColor : #DDDDDD;
--textColor : black; --textColor : black;
--hoverMenuColor : #; --hoverMenuColor : #999;
@menuHeight : 25px; @menuHeight : 25px;
position : relative; position : relative;
@@ -47,7 +46,7 @@
&.editorTool:not(.active) { cursor : not-allowed; } &.editorTool:not(.active) { cursor : not-allowed; }
&:hover,&.selected { background-color : #999999; } &:hover,&.selected { background-color : var(--hoverMenuColor) }
&.text { &.text {
.tooltipLeft('Brew Editor'); .tooltipLeft('Brew Editor');
} }
@@ -104,11 +103,6 @@
background-color : #999999; background-color : #999999;
} }
} }
&.divider {
width : 5px;
background : linear-gradient(currentColor, currentColor) no-repeat center/1px 100%;
&:hover { background-color : inherit; }
}
} }
.themeSelector { .themeSelector {
position : absolute; position : absolute;
@@ -210,7 +204,7 @@
border-radius : 12px; border-radius : 12px;
} }
&:hover { &:hover {
background-color : #999999; background-color : var(--hoverMenuColor);
} }
&:disabled { &:disabled {
color: gray; color: gray;
@@ -237,7 +231,7 @@
} }
.editor.darkMode .snippetBar { .editor.darkMode .snippetBar {
--activeTriggerColor: #888;
--menuColor : #666; --menuColor : #666;
--textColor : #eee; --textColor : #eee;
--hoverMenuColor : #444;
} }