Center icon badges properly and split wallpaper tile row to 2 per row

ags/style.css

@@ -364,11 +364,16 @@
 .widget-icon-badge {
   background-color: alpha(@accent, 0.18);
   border-radius: 8px;
-  padding: 8px 11px;
+  min-width: 32px;
+  min-height: 32px;
   color: @accent;
   font-size: 16px;
 }
 
+.widget-icon-badge label {
+  padding: 0;
+}
+
 .widget-card-title {
   font-size: 13px;
   font-weight: bold;

ags/widget/QuickSettings.tsx

@@ -144,6 +144,8 @@ function Toggles() {
             sh("omarchy-launch-bluetooth")
           }}
         />
+      </box>
+      <box class="qs-tiles" spacing={8} homogeneous>
         <Tile
           icon={""}
           label="Wallpaper"

ags/widget/WidgetCard.tsx

@@ -3,8 +3,8 @@ import { Gtk } from "ags/gtk3"
 export function CardHeader({ icon, title }: { icon: any; title: any }) {
   return (
     <box class="widget-card-header" spacing={10}>
-      <box class="widget-icon-badge">
+      <box class="widget-icon-badge" halign={Gtk.Align.CENTER} valign={Gtk.Align.CENTER}>
-        <label label={icon} />
+        <label label={icon} xalign={0.5} yalign={0.5} halign={Gtk.Align.CENTER} valign={Gtk.Align.CENTER} />
       </box>
       <label class="widget-card-title" label={title} xalign={0} halign={Gtk.Align.START} hexpand />
     </box>