Explore: type pill dark/light theme split; freeze active pill on hover in dark theme
This commit is contained in:
@@ -439,9 +439,12 @@
|
||||
.pill.small { padding: 0.15rem 0.45rem; font-size: 0.67rem; }
|
||||
|
||||
.type-pill { border-color: color-mix(in srgb, var(--type-color) 45%, transparent); color: color-mix(in srgb, var(--type-color) 65%, var(--text-5)); background: rgba(128,128,128,0.70); }
|
||||
:global([data-theme="light"]) .type-pill:not(.active) { background: transparent; }
|
||||
.type-pill.active { background: var(--type-color); border-color: var(--type-color); color: var(--pill-text-on); }
|
||||
.type-pill:hover { border-color: var(--type-color); color: var(--type-color); }
|
||||
.type-pill.active:hover { background: var(--type-color); border-color: var(--type-color); color: var(--pill-text-on); }
|
||||
:global([data-theme="light"]) .type-pill:not(.active) { background: transparent; }
|
||||
:global([data-theme="light"]) .type-pill.active { background: color-mix(in srgb, var(--type-color) 18%, transparent); color: var(--type-color); }
|
||||
:global([data-theme="light"]) .type-pill.active:hover { background: color-mix(in srgb, var(--type-color) 18%, transparent); border-color: var(--type-color); color: var(--type-color); }
|
||||
.type-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--type-color); flex-shrink: 0; }
|
||||
|
||||
.year-pills { margin-bottom: 0.4rem; }
|
||||
|
||||
Reference in New Issue
Block a user