3.0.2.3
Improved day tab selection and icons Tweaked at a glance panel
This commit is contained in:
+5
-23
@@ -103,33 +103,15 @@
|
||||
border-left: none;
|
||||
}
|
||||
|
||||
/* The selected-tab background is a different gradient (radial vs linear), and
|
||||
CSS can't tween between gradients — so we paint the active gradient as an
|
||||
overlay pseudo-element behind the tab content and fade its opacity on hover.
|
||||
z-index:-1 keeps it above the tab's own background but below the labels. */
|
||||
.utci-day-tab::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: var(--w-bg-active);
|
||||
opacity: 0;
|
||||
transition: opacity 0.2s ease;
|
||||
pointer-events: none;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
/* On hover, a non-active tab fades in the selected gradient + filter so it
|
||||
previews the selected shade (!important to beat the inline filter). */
|
||||
.utci-day-tab:hover:not(.active)::before {
|
||||
opacity: 1;
|
||||
}
|
||||
.utci-day-tab:hover:not(.active) {
|
||||
filter: saturate(1.1) brightness(1.04) !important;
|
||||
.utci-day-tab:hover:not(.active):not(.locked) {
|
||||
filter: brightness(1.14) !important;
|
||||
}
|
||||
|
||||
.utci-day-tab.active {
|
||||
color: #c8922a;
|
||||
border-bottom-color: #c8922a;
|
||||
outline: 3px solid #c8922a;
|
||||
outline-offset: -2px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/* The "Mon 12 May" date underneath each tab name */
|
||||
|
||||
Reference in New Issue
Block a user