johrpan/musicus
1
0
Fork 0
mirror of https://github.com/johrpan/musicus.git synced 2025-10-26 03:47:23 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Use simple colors for program designs

Browse source
This commit is contained in:
Elias Projahn 2025-03-23 08:44:46 +01:00
parent a70b7b5453
commit e2c6e85097
5 changed files with 123 additions and 57 deletions
Download patch file Download diff file Expand all files Collapse all files

6
data/de.johrpan.Musicus.gschema.xml.in
View file

@ -39,17 +39,17 @@
</key>
<key name="program1" type="s">
<!-- Translators: Configuration for the default programs in JSON. Please only translate the values of "title" and "description". -->
<default l10n="messages">'{"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}'</default>
<default l10n="messages">'{"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>
<summary>Default settings for program 1</summary>
</key>
<key name="program2" type="s">
<!-- Translators: Configuration for the default programs in JSON. Please only translate the values of "title" and "description". -->
<default l10n="messages">'{"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}'</default>
<default l10n="messages">'{"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>
<summary>Default settings for program 2</summary>
</key>
<key name="program3" type="s">
<!-- Translators: Configuration for the default programs in JSON. Please only translate the values of "title" and "description". -->
<default l10n="messages">'{"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}'</default>
<default l10n="messages">'{"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>
<summary>Default settings for program 3</summary>
</key>
</schema>

48
data/res/style.css
View file

@ -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 {

68
data/ui/editor/program.blp
View file

@ -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",
]
}