bos-settings: use the shared bread-theme stylesheet

Replace the hardcoded Nord palette (which ignored pywal and the rest of the
ecosystem entirely) with bread_theme::gtk::apply_shared() — bos-settings now
loads the same generated stylesheet as breadbar/breadbox/breadpad and keeps
only its own layout rules (.view-content padding). It recolours live with the
desktop. Bump gtk4 0.9 -> 0.11 / glib -> 0.22 to match the ecosystem.

Note: bread-theme dep pins tag v0.2.6 (cut at release); Cargo.lock to be
regenerated then.
This commit is contained in:
Breadway 2026-06-16 16:47:52 +08:00
parent f4043130ad
commit 7d422d78f3
2 changed files with 29 additions and 83 deletions

View file

@ -4,8 +4,11 @@ version = "0.2.0"
edition = "2021"
[dependencies]
gtk4 = { version = "0.9", features = ["v4_12"] }
glib = "0.20"
gtk4 = { version = "0.11", features = ["v4_12"] }
glib = "0.22"
# Shared ecosystem theming — bos-settings loads the same generated stylesheet as
# breadbar/breadbox/breadpad so the whole desktop looks consistent.
bread-theme = { git = "https://github.com/Breadway/bread-ecosystem", tag = "v0.2.6", features = ["gtk"] }
serde = { version = "1", features = ["derive"] }
serde_json = "1"
toml = "0.8"

View file

@ -1,87 +1,30 @@
//! Theming for bos-settings.
//!
//! bos-settings deliberately owns almost no styling: it loads the ecosystem's
//! shared stylesheet (the same one breadbar/breadbox/breadpad use, generated by
//! `bread-theme` from the pywal palette) and adds only the few layout rules
//! specific to this app's sidebar + content shell. This keeps it visually
//! identical to the rest of the bread desktop and live-recolouring for free.
use gtk4::CssProvider;
use std::cell::RefCell;
const CSS: &str = r#"
window {
background-color: #2e3440;
color: #eceff4;
// App-specific layout only — everything visual (colours, buttons, entries,
// switches, sidebar/row styling, cards, scrollbars) comes from the shared sheet.
const APP_CSS: &str = "\
.view-content { padding: 24px; }\n\
.view-content > label.title { margin-bottom: 16px; }\n\
";
thread_local! {
static APP_PROVIDER: RefCell<Option<CssProvider>> = const { RefCell::new(None) };
}
.sidebar {
background-color: #3b4252;
border-right: 1px solid #434c5e;
}
pub fn load(_display: &gtk4::gdk::Display) {
// Shared ecosystem stylesheet (loads the generated file or a rendered
// fallback, and live-reloads when the palette changes).
bread_theme::gtk::apply_shared();
.sidebar row {
padding: 8px 12px;
color: #d8dee9;
}
.sidebar row:selected {
background-color: #5e81ac;
color: #eceff4;
}
.sidebar .section-header {
padding: 12px 12px 4px 12px;
font-size: 0.75em;
font-weight: bold;
color: #616e88;
text-transform: uppercase;
letter-spacing: 1px;
}
.view-content {
padding: 24px;
}
.view-content label.title {
font-size: 1.4em;
font-weight: bold;
color: #eceff4;
margin-bottom: 16px;
}
button {
background-color: #5e81ac;
color: #eceff4;
border: none;
border-radius: 4px;
padding: 6px 16px;
}
button:hover {
background-color: #81a1c1;
}
button.destructive-action {
background-color: #bf616a;
}
button.destructive-action:hover {
background-color: #d08770;
}
entry {
background-color: #434c5e;
color: #eceff4;
border: 1px solid #4c566a;
border-radius: 4px;
}
textview {
background-color: #272c36;
color: #a3be8c;
font-family: monospace;
padding: 8px;
}
"#;
pub fn load(display: &gtk4::gdk::Display) {
let provider = CssProvider::new();
provider.load_from_string(CSS);
gtk4::style_context_add_provider_for_display(
display,
&provider,
gtk4::STYLE_PROVIDER_PRIORITY_APPLICATION,
);
// bos-settings layout, layered on top at APPLICATION priority.
APP_PROVIDER.with(|cell| bread_theme::gtk::apply_css(APP_CSS, cell));
}