[AGS] Fixes, BT apparently crashing

config/astal/components/QuickActions/modules/Audio/Audio.tsx

@@ -113,6 +113,7 @@ const SinkPicker = (type: AstalWp.MediaClass) => {
         <box vertical>
             <label
                 label={`Available Audio ${type === AstalWp.MediaClass.AUDIO_SPEAKER ? "Output" : type === AstalWp.MediaClass.AUDIO_MICROPHONE ? "Input" : ""} Devices`}
+                cssClasses={[ 'title-2' ]}
             ></label>
             <Gtk.Separator marginBottom={5} marginTop={3}></Gtk.Separator>
             <box vertical cssClasses={["sink-picker"]}>

config/astal/components/bar/bar.scss

@@ -61,6 +61,6 @@ window.Bar {
   }
   
   .quick-view-symbol {
-    margin: 2px;
+    margin: 4px;
   }
 }

config/astal/components/bar/modules/Hyprland.tsx

@@ -121,11 +121,15 @@ const WindowPopoverBox = () => {
         <box vertical>
             {bind(hypr, 'clients').as(clients => {
                 return clients.map(client => {
-                    return <box>
+                    return <button child={
+                        <box>
                             <label label={bind(client, 'workspace').as(w => `(WS ${w.name})`)}></label>
                             <label label={bind(client, 'initialClass').as(c => `[${c}]`)}></label>
                             <label label={bind(client, 'title')}></label>
                         </box>
+                    }
+                    onClicked={() => client.focus()}
+                    ></button>
                 })
             })}
         </box>

config/astal/components/bar/modules/SystemInfo.tsx

@@ -60,6 +60,9 @@ const SystemInfo = () => {
                 onClicked={() => openSysInfo()}
                 child={
                     <box tooltipText={sysinfo.ramUsed(v => v)}>
+                        <box
+                            cssClasses={[ 'quick-view-symbol' ]}
+                        >
                             <image
                                 iconName={"power-profile-performance-symbolic"}
                                 marginEnd={1}
@@ -68,10 +71,19 @@ const SystemInfo = () => {
                                 label={sysinfo.cpuUtil(util => util)}
                                 marginEnd={5}
                             ></label>
+                        </box>
+                        <box
+                            cssClasses={[ 'quick-view-symbol' ]}
+                        >
                             <image iconName={"histogram-symbolic"}></image>
                             <label label={sysinfo.ramUtil(util => util)}></label>
+                        </box>
+                        <box
+                            cssClasses={[ 'quick-view-symbol' ]}
+                        >
                             <image iconName={"show-gpu-effects-symbolic"}></image>
                             <label label={sysinfo.gpuUtil(util => util)}></label>
+                        </box>
                         {panel}
                     </box>
                 }