dash sidebar + bottom buttons

dash-frontend/assets/gui/dashboard.xml

@@ -14,7 +14,10 @@
       height="~side_button_size"
       color="background_contrast(transparent)"
       border_color="background_contrast"
-      hover_border_color="on_background_contrast"
+      hover_color="tertiary"
+      hover_border_color="tertiary(rgb-mult-0.5)"
+      sticky_color="primary"
+      sticky_border_color="primary(rgb-mult-0.5)"
       tooltip="${tooltip}"
       tooltip_side="${tooltip_side}"
     >
@@ -22,6 +25,8 @@
     </Button>
   </template>
 
+  <macro name="button_style" sticky_color="primary" sticky_border_color="primary(rgb-mult-0.5)" hover_color="tertiary" hover_border_color="tertiary(rgb-mult-0.5)" />
+
   <elements>
     <!-- left/right separator (menu and rest) -->
     <div flex_direction="row" gap="8" width="100%" height="100%" padding="4" interactable="0">
@@ -136,10 +141,10 @@
 
           <!-- Left bottom side -->
           <div margin_left="8">
-            <Button id="btn_audio" color="highlight(transparent)" border_color="highlight(transparent)" tooltip="AUDIO.VOLUME" tooltip_side="top">
+            <Button macro="button_style" id="btn_audio" color="highlight(transparent)" border_color="highlight(transparent)" tooltip="AUDIO.VOLUME" tooltip_side="top">
               <sprite src_builtin="dashboard/volume.svg" width="24" height="24" margin="8" color="on_background" />
             </Button>
-            <Button id="btn_recenter" color="highlight(transparent)" border_color="highlight(transparent)" tooltip="ACTIONS.RECENTER_PLAYSPACE" tooltip_side="top">
+            <Button macro="button_style" id="btn_recenter" color="highlight(transparent)" border_color="highlight(transparent)" tooltip="ACTIONS.RECENTER_PLAYSPACE" tooltip_side="top">
               <sprite src_builtin="dashboard/recenter.svg" width="24" height="24" margin="8" color="on_background" />
             </Button>
           </div>

dash-frontend/src/frontend.rs

@@ -1,11 +1,12 @@
-use std::{path::PathBuf, rc::Rc};
+use std::{collections::HashMap, path::PathBuf, rc::Rc};
 
 use chrono::Timelike;
 use glam::Vec2;
+use strum::EnumCount;
 use wgui::{
 	assets::{AssetPath, AssetProvider},
 	components::button::ComponentButton,
-	event::StyleSetRequest,
+	event::{CallbackDataCommon, StyleSetRequest},
 	font_config::WguiFontConfig,
 	globals::WguiGlobals,
 	i18n::Translation,
@@ -61,6 +62,7 @@ pub struct Frontend<T> {
 	state: ParserState,
 
 	current_tab: Option<Box<dyn Tab<T>>>,
+	side_buttons: Vec<(TabType, Rc<ComponentButton>)>,
 
 	pub tasks: FrontendTasks,
 
@@ -181,6 +183,7 @@ impl<T: 'static> Frontend<T> {
 			layout,
 			state,
 			current_tab: None,
+			side_buttons: Vec::with_capacity(TabType::COUNT),
 			globals,
 			tasks,
 			ticks: 0,
@@ -439,6 +442,15 @@ impl<T: 'static> Frontend<T> {
 
 		self.current_tab = Some(tab);
 
+		let mut common = CallbackDataCommon {
+			state: &self.layout.state,
+			alterables: &mut self.layout.alterables,
+		};
+
+		for (t, btn) in self.side_buttons.iter() {
+			btn.set_sticky_state(&mut common, tab_type == *t);
+		}
+
 		Ok(())
 	}
 
@@ -454,34 +466,29 @@ impl<T: 'static> Frontend<T> {
 		// ################################
 
 		// "Home" side button
-		self.tasks.handle_button(
-			&self.state.fetch_component_as::<ComponentButton>("btn_side_home")?,
-			FrontendTask::SetTab(TabType::Home),
-		);
+		let btn = self.state.fetch_component_as::<ComponentButton>("btn_side_home")?;
+		self.tasks.handle_button(&btn, FrontendTask::SetTab(TabType::Home));
+		self.side_buttons.push((TabType::Home, btn));
 
 		// "Apps" side button
-		self.tasks.handle_button(
-			&self.state.fetch_component_as::<ComponentButton>("btn_side_apps")?,
-			FrontendTask::SetTab(TabType::Apps),
-		);
+		let btn = self.state.fetch_component_as::<ComponentButton>("btn_side_apps")?;
+		self.tasks.handle_button(&btn, FrontendTask::SetTab(TabType::Apps));
+		self.side_buttons.push((TabType::Apps, btn));
 
 		// "Games" side button
-		self.tasks.handle_button(
-			&self.state.fetch_component_as::<ComponentButton>("btn_side_games")?,
-			FrontendTask::SetTab(TabType::Games),
-		);
+		let btn = self.state.fetch_component_as::<ComponentButton>("btn_side_games")?;
+		self.tasks.handle_button(&btn, FrontendTask::SetTab(TabType::Games));
+		self.side_buttons.push((TabType::Games, btn));
 
 		// "Monado side button"
-		self.tasks.handle_button(
-			&self.state.fetch_component_as::<ComponentButton>("btn_side_monado")?,
-			FrontendTask::SetTab(TabType::Monado),
-		);
+		let btn = self.state.fetch_component_as::<ComponentButton>("btn_side_monado")?;
+		self.tasks.handle_button(&btn, FrontendTask::SetTab(TabType::Monado));
+		self.side_buttons.push((TabType::Monado, btn));
 
 		// "Settings" side button
-		self.tasks.handle_button(
-			&self.state.fetch_component_as::<ComponentButton>("btn_side_settings")?,
-			FrontendTask::SetTab(TabType::Settings),
-		);
+		let btn = self.state.fetch_component_as::<ComponentButton>("btn_side_settings")?;
+		self.tasks.handle_button(&btn, FrontendTask::SetTab(TabType::Settings));
+		self.side_buttons.push((TabType::Settings, btn));
 
 		// ################################
 		// BOTTOM BAR BUTTONS

dash-frontend/src/tab/mod.rs

@@ -1,3 +1,5 @@
+use strum::EnumCount;
+
 use crate::frontend::Frontend;
 
 pub mod apps;
@@ -8,7 +10,7 @@ pub mod monado;
 pub mod settings;
 pub mod welcome;
 
-#[derive(Clone, Copy, Debug)]
+#[derive(Clone, Copy, Debug, PartialEq, Eq, EnumCount)]
 pub enum TabType {
 	Home,
 	Apps,