Polish wallpaper theming across Shell, VSCodium, Zen, and GTK4
Comprehensive GNOME Shell theme: accent variable overrides, quick toggle states, chevrons, sliders, sub-menus, header buttons, overview/dash/search/app-grid styling. Fix GTK4 backdrop so Nautilus keeps palette colors when unfocused. Expand VSCodium color coverage (diff editor, widgets, notifications, scrollbars). Add more Zen browser CSS variables for broader UI theming. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
parent
0eb6c587dc
commit
ed526791f0
4 changed files with 297 additions and 15 deletions
|
|
@ -79,6 +79,19 @@
|
|||
headerbar .title {
|
||||
font-size: 0;
|
||||
}
|
||||
/* Keep wallpaper colors when window loses focus */
|
||||
window:backdrop {
|
||||
background-color: @window_bg_color;
|
||||
color: @window_fg_color;
|
||||
}
|
||||
window:backdrop headerbar {
|
||||
background-color: @headerbar_bg_color;
|
||||
color: @headerbar_fg_color;
|
||||
}
|
||||
window:backdrop .navigation-sidebar {
|
||||
background-color: @sidebar_bg_color;
|
||||
color: @sidebar_fg_color;
|
||||
}
|
||||
'';
|
||||
home.file.".config/gtk-3.0/gtk.css".force = true;
|
||||
home.file.".config/gtk-3.0/gtk.css".text = ''
|
||||
|
|
|
|||
|
|
@ -1,36 +1,239 @@
|
|||
/* Wallpaper-based GNOME Shell colors generated by matugen */
|
||||
|
||||
/* Override system accent color variables */
|
||||
stage {
|
||||
-st-accent-color: {{colors.primary_container.default.hex}} !important;
|
||||
-st-accent-fg-color: {{colors.on_primary_container.default.hex}} !important;
|
||||
}
|
||||
|
||||
#panel {
|
||||
background-color: {{colors.surface_container.default.hex}};
|
||||
color: {{colors.on_surface.default.hex}};
|
||||
background-color: {{colors.surface_container.default.hex}} !important;
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
#panel .panel-button {
|
||||
color: {{colors.on_surface.default.hex}};
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-settings {
|
||||
background-color: {{colors.surface_container.default.hex}};
|
||||
background-color: {{colors.surface_container.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-settings-grid .quick-toggle {
|
||||
background-color: {{colors.surface_container_high.default.hex}};
|
||||
color: {{colors.on_surface.default.hex}};
|
||||
background-color: {{colors.surface_container_high.default.hex}} !important;
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-settings-grid .quick-toggle:checked {
|
||||
background-color: {{colors.primary_container.default.hex}};
|
||||
color: {{colors.on_primary_container.default.hex}};
|
||||
/* Checked toggles — override accent color */
|
||||
.quick-toggle:checked {
|
||||
background-color: {{colors.primary_container.default.hex}} !important;
|
||||
color: {{colors.on_primary_container.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-settings .icon-button, .quick-settings .button {
|
||||
color: {{colors.on_surface.default.hex}};
|
||||
.quick-toggle:checked:hover {
|
||||
background-color: {{colors.primary_container.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-toggle:checked:active {
|
||||
background-color: {{colors.primary_container.default.hex}} !important;
|
||||
}
|
||||
|
||||
/* Quick toggle icons */
|
||||
.quick-toggle .quick-toggle-icon {
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-toggle:checked .quick-toggle-icon {
|
||||
color: {{colors.on_primary_container.default.hex}} !important;
|
||||
}
|
||||
|
||||
/* Chevron/arrow menu button (the > on Wired, Power Mode etc) */
|
||||
.quick-toggle-has-menu .quick-toggle-menu-button {
|
||||
background-color: {{colors.surface_container_high.default.hex}} !important;
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-toggle-has-menu .quick-toggle-menu-button:checked {
|
||||
background-color: {{colors.primary_container.default.hex}} !important;
|
||||
color: {{colors.on_primary_container.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-toggle-has-menu .quick-toggle-menu-button:checked:hover {
|
||||
background-color: {{colors.primary_container.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-toggle-has-menu .quick-toggle-separator {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
/* Icons and arrows inside quick toggles */
|
||||
.quick-toggle StIcon {
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-toggle:checked StIcon {
|
||||
color: {{colors.on_primary_container.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-toggle-menu-button StIcon {
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-toggle-menu-button:checked StIcon {
|
||||
color: {{colors.on_primary_container.default.hex}} !important;
|
||||
}
|
||||
|
||||
/* Icon buttons in quick settings header */
|
||||
.quick-settings .icon-button {
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-settings .icon-button StIcon {
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
/* Sliders (volume, brightness) */
|
||||
.slider {
|
||||
color: {{colors.primary.default.hex}} !important;
|
||||
-barlevel-active-background-color: {{colors.primary.default.hex}} !important;
|
||||
-barlevel-background-color: {{colors.surface_container_high.default.hex}} !important;
|
||||
}
|
||||
|
||||
/* Quick toggle sub-menus (e.g. Wired Connections dropdown) */
|
||||
.quick-toggle-menu {
|
||||
background-color: {{colors.surface_container_high.default.hex}} !important;
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-toggle-menu .header .title {
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
/* Active icon in sub-menu header (e.g. Wired Connections circle icon) */
|
||||
.quick-toggle-menu .header .icon.active {
|
||||
background-color: {{colors.primary_container.default.hex}} !important;
|
||||
color: {{colors.on_primary_container.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-toggle-menu .header .icon {
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-toggle-menu .popup-menu-item {
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.popup-menu-content {
|
||||
background-color: {{colors.surface_container.default.hex}};
|
||||
background-color: {{colors.surface_container.default.hex}} !important;
|
||||
}
|
||||
|
||||
.popup-sub-menu .popup-menu-item {
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.notification-banner {
|
||||
background-color: {{colors.surface_container_high.default.hex}};
|
||||
color: {{colors.on_surface.default.hex}};
|
||||
background-color: {{colors.surface_container_high.default.hex}} !important;
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
/* Round icon buttons in quick settings header (settings gear, lock, power etc) */
|
||||
.quick-settings .icon-button {
|
||||
background-color: {{colors.surface_container_high.default.hex}} !important;
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-settings .icon-button:hover {
|
||||
background-color: {{colors.surface_container_highest.default.hex}} !important;
|
||||
}
|
||||
|
||||
.quick-settings .icon-button:active {
|
||||
background-color: {{colors.surface_container_highest.default.hex}} !important;
|
||||
}
|
||||
|
||||
/* Overview background */
|
||||
#overview {
|
||||
background-color: rgba({{colors.surface.default.red}}, {{colors.surface.default.green}}, {{colors.surface.default.blue}}, 0.85) !important;
|
||||
}
|
||||
|
||||
/* Dash (app dock at bottom of overview) */
|
||||
#dash .dash-background {
|
||||
background-color: {{colors.surface_container.default.hex}} !important;
|
||||
}
|
||||
|
||||
#dash .show-apps .overview-icon {
|
||||
background-color: transparent !important;
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
/* Search bar in overview */
|
||||
.search-entry {
|
||||
background-color: {{colors.surface_container_high.default.hex}} !important;
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.search-entry:focus {
|
||||
background-color: {{colors.surface_container_high.default.hex}} !important;
|
||||
border-color: {{colors.primary.default.hex}} !important;
|
||||
}
|
||||
|
||||
/* Search results section */
|
||||
.search-section-content {
|
||||
background-color: {{colors.surface_container.default.hex}} !important;
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
/* App grid / app drawer */
|
||||
.app-folder {
|
||||
background-color: {{colors.surface_container_high.default.hex}} !important;
|
||||
}
|
||||
|
||||
.app-folder-dialog {
|
||||
background-color: {{colors.surface_container.default.hex}} !important;
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.app-folder-dialog .folder-name-entry {
|
||||
background-color: {{colors.surface_container_high.default.hex}} !important;
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
/* Popup menus */
|
||||
.popup-menu {
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
/* Page navigation arrows (next/prev page in app drawer) */
|
||||
.page-navigation-arrow {
|
||||
background-color: {{colors.surface_container_high.default.hex}} !important;
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
.page-navigation-arrow:hover {
|
||||
background-color: {{colors.surface_container_highest.default.hex}} !important;
|
||||
}
|
||||
|
||||
.app-folder-dialog .page-navigation-arrow {
|
||||
background-color: {{colors.surface_container_high.default.hex}} !important;
|
||||
color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
||||
/* Dash app icon highlights (hover/focus/active) */
|
||||
#dash .dash-item-container .overview-tile .overview-icon,
|
||||
#dash .dash-item-container .grid-search-result .overview-icon {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
#dash .dash-item-container .overview-tile:hover .overview-icon,
|
||||
#dash .dash-item-container .grid-search-result:hover .overview-icon {
|
||||
background-color: {{colors.surface_container_high.default.hex}} !important;
|
||||
}
|
||||
|
||||
#dash .dash-item-container .overview-tile:active .overview-icon,
|
||||
#dash .dash-item-container .grid-search-result:active .overview-icon {
|
||||
background-color: {{colors.surface_container_highest.default.hex}} !important;
|
||||
}
|
||||
|
||||
#dash .dash-item-container .overview-tile:focus .overview-icon,
|
||||
#dash .dash-item-container .grid-search-result:focus .overview-icon {
|
||||
background-color: {{colors.surface_container_high.default.hex}} !important;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,23 +5,81 @@
|
|||
"titleBar.inactiveBackground": "{{colors.surface_container_low.default.hex}}",
|
||||
"activityBar.background": "{{colors.surface_container.default.hex}}",
|
||||
"activityBar.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"activityBar.inactiveForeground": "{{colors.on_surface_variant.default.hex}}",
|
||||
"sideBar.background": "{{colors.surface_container_low.default.hex}}",
|
||||
"sideBar.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"sideBar.border": "{{colors.outline_variant.default.hex}}",
|
||||
"sideBarSectionHeader.background": "{{colors.surface_container.default.hex}}",
|
||||
"sideBarSectionHeader.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"editor.background": "{{colors.surface.default.hex}}",
|
||||
"editor.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"editorGroupHeader.tabsBackground": "{{colors.surface_container.default.hex}}",
|
||||
"statusBar.background": "{{colors.surface_container.default.hex}}",
|
||||
"statusBar.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"statusBar.debuggingBackground": "{{colors.primary.default.hex}}",
|
||||
"statusBar.debuggingForeground": "{{colors.on_primary.default.hex}}",
|
||||
"statusBar.noFolderBackground": "{{colors.surface_container.default.hex}}",
|
||||
"tab.activeBackground": "{{colors.surface.default.hex}}",
|
||||
"tab.inactiveBackground": "{{colors.surface_container.default.hex}}",
|
||||
"tab.activeForeground": "{{colors.on_surface.default.hex}}",
|
||||
"tab.inactiveForeground": "{{colors.on_surface_variant.default.hex}}",
|
||||
"tab.border": "{{colors.surface_container.default.hex}}",
|
||||
"focusBorder": "{{colors.primary.default.hex}}",
|
||||
"button.background": "{{colors.primary.default.hex}}",
|
||||
"button.foreground": "{{colors.on_primary.default.hex}}",
|
||||
"list.activeSelectionBackground": "{{colors.primary_container.default.hex}}",
|
||||
"list.activeSelectionForeground": "{{colors.on_primary_container.default.hex}}",
|
||||
"list.hoverBackground": "{{colors.surface_container_high.default.hex}}",
|
||||
"list.inactiveSelectionBackground": "{{colors.surface_container_high.default.hex}}",
|
||||
"input.background": "{{colors.surface_container_high.default.hex}}",
|
||||
"input.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"input.border": "{{colors.outline_variant.default.hex}}",
|
||||
"dropdown.background": "{{colors.surface_container_high.default.hex}}",
|
||||
"dropdown.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"dropdown.border": "{{colors.outline_variant.default.hex}}",
|
||||
"panel.background": "{{colors.surface_container_low.default.hex}}",
|
||||
"panel.border": "{{colors.outline_variant.default.hex}}",
|
||||
"panelTitle.activeForeground": "{{colors.on_surface.default.hex}}",
|
||||
"terminal.background": "{{colors.surface.default.hex}}",
|
||||
"terminal.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"panel.background": "{{colors.surface_container_low.default.hex}}"
|
||||
"breadcrumb.background": "{{colors.surface.default.hex}}",
|
||||
"breadcrumb.foreground": "{{colors.on_surface_variant.default.hex}}",
|
||||
"editorWidget.background": "{{colors.surface_container.default.hex}}",
|
||||
"editorWidget.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"peekViewEditor.background": "{{colors.surface_container_low.default.hex}}",
|
||||
"peekViewResult.background": "{{colors.surface_container.default.hex}}",
|
||||
"quickInput.background": "{{colors.surface_container.default.hex}}",
|
||||
"quickInput.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"diffEditor.insertedTextBackground": "{{colors.tertiary_container.default.hex}}33",
|
||||
"diffEditor.removedTextBackground": "{{colors.error_container.default.hex}}33",
|
||||
"diffEditor.insertedLineBackground": "{{colors.tertiary_container.default.hex}}22",
|
||||
"diffEditor.removedLineBackground": "{{colors.error_container.default.hex}}22",
|
||||
"merge.currentHeaderBackground": "{{colors.tertiary_container.default.hex}}55",
|
||||
"merge.incomingHeaderBackground": "{{colors.primary_container.default.hex}}55",
|
||||
"notifications.background": "{{colors.surface_container_high.default.hex}}",
|
||||
"notifications.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"notificationCenterHeader.background": "{{colors.surface_container.default.hex}}",
|
||||
"banner.background": "{{colors.surface_container_high.default.hex}}",
|
||||
"banner.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"commandCenter.background": "{{colors.surface_container.default.hex}}",
|
||||
"commandCenter.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"editorGutter.background": "{{colors.surface.default.hex}}",
|
||||
"editorLineNumber.foreground": "{{colors.on_surface_variant.default.hex}}",
|
||||
"scrollbarSlider.background": "{{colors.outline_variant.default.hex}}55",
|
||||
"scrollbarSlider.hoverBackground": "{{colors.outline_variant.default.hex}}88",
|
||||
"scrollbarSlider.activeBackground": "{{colors.outline_variant.default.hex}}aa",
|
||||
"editorPane.background": "{{colors.surface.default.hex}}",
|
||||
"editorHoverWidget.background": "{{colors.surface_container.default.hex}}",
|
||||
"editorHoverWidget.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"editorHoverWidget.border": "{{colors.outline_variant.default.hex}}",
|
||||
"editorSuggestWidget.background": "{{colors.surface_container.default.hex}}",
|
||||
"editorSuggestWidget.foreground": "{{colors.on_surface.default.hex}}",
|
||||
"editorSuggestWidget.border": "{{colors.outline_variant.default.hex}}",
|
||||
"editorSuggestWidget.selectedBackground": "{{colors.primary_container.default.hex}}",
|
||||
"debugToolBar.background": "{{colors.surface_container.default.hex}}",
|
||||
"walkThrough.embeddedEditorBackground": "{{colors.surface_container_low.default.hex}}",
|
||||
"settings.headerForeground": "{{colors.on_surface.default.hex}}",
|
||||
"welcomePage.background": "{{colors.surface.default.hex}}",
|
||||
"textBlockQuote.background": "{{colors.surface_container_low.default.hex}}"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -12,4 +12,12 @@
|
|||
--arrowpanel-background: {{colors.surface_container.default.hex}} !important;
|
||||
--arrowpanel-color: {{colors.on_surface.default.hex}} !important;
|
||||
--urlbar-box-bgcolor: {{colors.surface_container_low.default.hex}} !important;
|
||||
--zen-themed-toolbar-bg: {{colors.surface_container.default.hex}} !important;
|
||||
--zen-themed-toolbar-fg: {{colors.on_surface.default.hex}} !important;
|
||||
--zen-themed-toolbar-border: {{colors.outline_variant.default.hex}} !important;
|
||||
--sidebar-background-color: {{colors.surface_container_low.default.hex}} !important;
|
||||
--newtab-background-color: {{colors.surface.default.hex}} !important;
|
||||
--lwt-sidebar-background-color: {{colors.surface_container_low.default.hex}} !important;
|
||||
--lwt-sidebar-text-color: {{colors.on_surface.default.hex}} !important;
|
||||
--lwt-toolbar-body-color: {{colors.on_surface.default.hex}} !important;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue