From e2c6e85097db3ff887d3b4d11ad5ce1f4338ead5 Mon Sep 17 00:00:00 2001 From: Elias Projahn Date: Sun, 23 Mar 2025 08:44:46 +0100 Subject: [PATCH] Use simple colors for program designs --- data/de.johrpan.Musicus.gschema.xml.in | 6 +-- data/res/style.css | 48 ++++++++++-------- data/ui/editor/program.blp | 68 +++++++++++++++++++++----- src/program.rs | 50 ++++++++++++------- src/program_tile.rs | 8 ++- 5 files changed, 123 insertions(+), 57 deletions(-) diff --git a/data/de.johrpan.Musicus.gschema.xml.in b/data/de.johrpan.Musicus.gschema.xml.in index 9848380..29c2805 100644 --- a/data/de.johrpan.Musicus.gschema.xml.in +++ b/data/de.johrpan.Musicus.gschema.xml.in @@ -39,17 +39,17 @@ - '{"title":"Just play some music","description":"Randomly select some music. Customize programs using the button in the top right.","design":"Program1","prefer_recently_added":0.0,"prefer_least_recently_played":0.1,"avoid_repeated_composers":60,"avoid_repeated_instruments":60,"play_full_recordings":true}' + '{"title":"Just play some music","description":"Randomly select some music. Customize programs using the button in the top right.","design":"Slate","prefer_recently_added":0.0,"prefer_least_recently_played":0.1,"avoid_repeated_composers":60,"avoid_repeated_instruments":60,"play_full_recordings":true}' Default settings for program 1 - '{"title":"What\'s new?","description":"Recordings that you recently added to your music library.","design":"Program2","prefer_recently_added":1.0,"prefer_least_recently_played":0.0,"avoid_repeated_composers":60,"avoid_repeated_instruments":60,"play_full_recordings":true}' + '{"title":"What\'s new?","description":"Recordings that you recently added to your music library.","design":"Orange","prefer_recently_added":1.0,"prefer_least_recently_played":0.0,"avoid_repeated_composers":60,"avoid_repeated_instruments":60,"play_full_recordings":true}' Default settings for program 2 - '{"title":"A long time ago","description":"Works that you haven\'t listened to for a long time.","design":"Program3","prefer_recently_added":0.0,"prefer_least_recently_played":1.0,"avoid_repeated_composers":60,"avoid_repeated_instruments":60,"play_full_recordings":true}' + '{"title":"A long time ago","description":"Works that you haven\'t listened to for a long time.","design":"Purple","prefer_recently_added":0.0,"prefer_least_recently_played":1.0,"avoid_repeated_composers":60,"avoid_repeated_instruments":60,"play_full_recordings":true}' Default settings for program 3 diff --git a/data/res/style.css b/data/res/style.css index fb4e8b9..316dcd4 100644 --- a/data/res/style.css +++ b/data/res/style.css @@ -59,15 +59,6 @@ .program-tile { padding: 12px; min-width: 200px; - transition: transform 100ms; -} - -.program-tile:hover { - transform: scale(1.01); -} - -.program-tile:active { - transform: scale(0.99); } .program-tile .title { @@ -85,34 +76,49 @@ box-shadow: 0 0 0 3px var(--accent-bg-color); } -.program-1 { +.blue { color: white; - background: linear-gradient(-225deg, #ac32e4 0%, #7918f2 48%, #4801ff 100%); + background-color: var(--accent-blue); } -.program-2 { +.teal { color: white; - background: linear-gradient(145deg, #f12711, #f5af19); + background-color: var(--accent-teal); } -.program-3 { +.green { color: white; - background: linear-gradient(-80deg, #ad5389, #3c1053); + background-color: var(--accent-green); } -.program-4 { +.yellow { color: white; - background: linear-gradient(140deg, #136797, #0b486b); + background-color: var(--accent-yellow); } -.program-5 { +.orange { color: white; - background: linear-gradient(100deg, #6a9113, #141517); + background-color: var(--accent-orange); } -.program-6 { +.red { color: white; - background: linear-gradient(120deg, #870000, #190a05); + background-color: var(--accent-red); +} + +.pink { + color: white; + background-color: var(--accent-pink); +} + +.purple { + color: white; + background-color: var(--accent-purple); +} + +.slate { + color: white; + background-color: var(--accent-slate); } .selector>contents { diff --git a/data/ui/editor/program.blp b/data/ui/editor/program.blp index c27491e..c8077ff 100644 --- a/data/ui/editor/program.blp +++ b/data/ui/editor/program.blp @@ -69,66 +69,110 @@ template $MusicusProgramEditor: Adw.NavigationPage { Gtk.ToggleButton { action-name: "program.set-design"; - action-target: "'program-1'"; + action-target: "'default'"; styles [ "program-design-button", - "program-1", + "default", "circular", ] } Gtk.ToggleButton { action-name: "program.set-design"; - action-target: "'program-2'"; + action-target: "'blue'"; styles [ "program-design-button", - "program-2", + "blue", "circular", ] } Gtk.ToggleButton { action-name: "program.set-design"; - action-target: "'program-3'"; + action-target: "'teal'"; styles [ "program-design-button", - "program-3", + "teal", "circular", ] } Gtk.ToggleButton { action-name: "program.set-design"; - action-target: "'program-4'"; + action-target: "'green'"; styles [ "program-design-button", - "program-4", + "green", "circular", ] } Gtk.ToggleButton { action-name: "program.set-design"; - action-target: "'program-5'"; + action-target: "'yellow'"; styles [ "program-design-button", - "program-5", + "yellow", "circular", ] } Gtk.ToggleButton { action-name: "program.set-design"; - action-target: "'program-6'"; + action-target: "'orange'"; styles [ "program-design-button", - "program-6", + "orange", + "circular", + ] + } + + Gtk.ToggleButton { + action-name: "program.set-design"; + action-target: "'red'"; + + styles [ + "program-design-button", + "red", + "circular", + ] + } + + Gtk.ToggleButton { + action-name: "program.set-design"; + action-target: "'pink'"; + + styles [ + "program-design-button", + "pink", + "circular", + ] + } + + Gtk.ToggleButton { + action-name: "program.set-design"; + action-target: "'purple'"; + + styles [ + "program-design-button", + "purple", + "circular", + ] + } + + Gtk.ToggleButton { + action-name: "program.set-design"; + action-target: "'slate'"; + + styles [ + "program-design-button", + "slate", "circular", ] } diff --git a/src/program.rs b/src/program.rs index 8c31bcb..803dbe5 100644 --- a/src/program.rs +++ b/src/program.rs @@ -168,12 +168,16 @@ impl Default for Program { #[derive(glib::Enum, Serialize, Deserialize, Eq, PartialEq, Clone, Copy, Debug)] #[enum_type(name = "MusicusProgramDesign")] pub enum ProgramDesign { - Program1, - Program2, - Program3, - Program4, - Program5, - Program6, + Default, + Blue, + Teal, + Green, + Yellow, + Orange, + Red, + Pink, + Purple, + Slate, } impl ProgramDesign { @@ -184,19 +188,23 @@ impl ProgramDesign { impl Default for ProgramDesign { fn default() -> Self { - Self::Program1 + Self::Default } } impl ToString for ProgramDesign { fn to_string(&self) -> String { String::from(match self { - ProgramDesign::Program1 => "program-1", - ProgramDesign::Program2 => "program-2", - ProgramDesign::Program3 => "program-3", - ProgramDesign::Program4 => "program-4", - ProgramDesign::Program5 => "program-5", - ProgramDesign::Program6 => "program-6", + ProgramDesign::Default => "default", + ProgramDesign::Blue => "blue", + ProgramDesign::Teal => "teal", + ProgramDesign::Green => "green", + ProgramDesign::Yellow => "yellow", + ProgramDesign::Orange => "orange", + ProgramDesign::Red => "red", + ProgramDesign::Pink => "pink", + ProgramDesign::Purple => "purple", + ProgramDesign::Slate => "slate", }) } } @@ -206,12 +214,16 @@ impl FromStr for ProgramDesign { fn from_str(s: &str) -> std::result::Result { match s { - "program-1" => Ok(ProgramDesign::Program1), - "program-2" => Ok(ProgramDesign::Program2), - "program-3" => Ok(ProgramDesign::Program3), - "program-4" => Ok(ProgramDesign::Program4), - "program-5" => Ok(ProgramDesign::Program5), - "program-6" => Ok(ProgramDesign::Program6), + "default" => Ok(ProgramDesign::Default), + "blue" => Ok(ProgramDesign::Blue), + "teal" => Ok(ProgramDesign::Teal), + "green" => Ok(ProgramDesign::Green), + "yellow" => Ok(ProgramDesign::Yellow), + "orange" => Ok(ProgramDesign::Orange), + "red" => Ok(ProgramDesign::Red), + "pink" => Ok(ProgramDesign::Pink), + "purple" => Ok(ProgramDesign::Purple), + "slate" => Ok(ProgramDesign::Slate), _ => Err(()), } } diff --git a/src/program_tile.rs b/src/program_tile.rs index 0e4d356..78f5718 100644 --- a/src/program_tile.rs +++ b/src/program_tile.rs @@ -74,8 +74,12 @@ mod imp { } fn set_program(&self, program: &Program) { - self.obj() - .set_css_classes(&["program-tile", &program.design().css_class()]); + self.obj().set_css_classes(&[ + "program-tile", + "card", + "activatable", + &program.design().css_class(), + ]); if let Some(title) = program.title() { self.title_label.set_label(&title);