Improve scrollbar styles for code blocks and enhance search plugin input specificity

This commit is contained in:
interlope committed 2026-05-29 18:33:08 +02:00
1 parent b5761c8cb9
commit 142dcbdf0a
1 file changed
+19 -17
+19 -17
View File
@@ -393,23 +393,27 @@ pre code {
border: none; border: none;
} }
/* Always-visible scrollbar on code blocks */ /* Always-visible scrollbar on code blocks.
-webkit-appearance: none disables macOS overlay/auto-hide behaviour;
a non-transparent track ensures the slot is always painted. */
pre { pre {
scrollbar-width: thin; /* Firefox */ scrollbar-width: thin;
scrollbar-color: var(--border-color) transparent; scrollbar-color: var(--text-muted) var(--bg-subtle);
} }
pre::-webkit-scrollbar { pre::-webkit-scrollbar {
height: 6px; -webkit-appearance: none;
height: 8px;
} }
pre::-webkit-scrollbar-track { pre::-webkit-scrollbar-track {
background: transparent; background: var(--bg-subtle);
border-radius: 0 0 var(--radius-sm) var(--radius-sm);
} }
pre::-webkit-scrollbar-thumb { pre::-webkit-scrollbar-thumb {
background: var(--border-color); background: var(--text-muted);
border-radius: 3px; border-radius: 4px;
} }
pre::-webkit-scrollbar-thumb:hover { pre::-webkit-scrollbar-thumb:hover {
background: var(--text-muted); background: var(--text-secondary);
} }
/* ======================================== /* ========================================
@@ -1007,7 +1011,8 @@ img.nav-svg-icon {
color: var(--accent-contrast); color: var(--accent-contrast);
} }
/* Search plugin */ /* Search plugin — target input directly in case the plugin omits form-control */
.plugin.plugin-search input,
.plugin.plugin-search .form-control { .plugin.plugin-search .form-control {
border: 1px solid var(--border-color) !important; border: 1px solid var(--border-color) !important;
border-radius: var(--radius-sm) !important; border-radius: var(--radius-sm) !important;
@@ -1015,24 +1020,21 @@ img.nav-svg-icon {
background: var(--bg-surface) !important; background: var(--bg-surface) !important;
background-color: var(--bg-surface) !important; background-color: var(--bg-surface) !important;
color: var(--text-primary) !important; color: var(--text-primary) !important;
width: 100%;
} }
/* Higher-specificity fallback to beat plugin-bundled CSS */ .plugin.plugin-search input::placeholder,
.sidebar-container .plugin.plugin-search .form-control {
background: var(--bg-surface) !important;
background-color: var(--bg-surface) !important;
color: var(--text-primary) !important;
border-color: var(--border-color) !important;
}
.plugin.plugin-search .form-control::placeholder { .plugin.plugin-search .form-control::placeholder {
color: var(--text-muted) !important; color: var(--text-muted) !important;
} }
.plugin.plugin-search input:focus,
.plugin.plugin-search .form-control:focus { .plugin.plugin-search .form-control:focus {
border-color: var(--accent) !important; border-color: var(--accent) !important;
box-shadow: 0 0 0 3px rgba(127, 127, 127, 0.18) !important; box-shadow: 0 0 0 3px rgba(127, 127, 127, 0.18) !important;
outline: none !important; outline: none !important;
background: var(--bg-surface) !important;
background-color: var(--bg-surface) !important;
} }
.plugin.plugin-search button, .plugin.plugin-search button,