chore: titlebar buttons not working

lib/components/titlebar/titlebar.dart

@@ -7,6 +7,8 @@ import 'package:spotube/provider/user_preferences/user_preferences_provider.dart
 import 'package:spotube/utils/platform.dart';
 import 'package:window_manager/window_manager.dart';
 
+final kTitlebarVisible = kIsWindows || kIsLinux;
+
 class TitleBar extends HookConsumerWidget implements PreferredSizeWidget {
   final bool automaticallyImplyLeading;
   final List<Widget> trailing;

lib/components/titlebar/titlebar_buttons.dart

@@ -1,6 +1,8 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
+import 'package:spotube/components/titlebar/titlebar.dart';
 import 'package:spotube/components/titlebar/titlebar_icon_buttons.dart';
 import 'package:spotube/components/titlebar/window_button.dart';
 import 'package:spotube/provider/user_preferences/user_preferences_provider.dart';
@@ -20,6 +22,7 @@ class WindowTitleBarButtons extends HookConsumerWidget {
     final preferences = ref.watch(userPreferencesProvider);
     final isMaximized = useState<bool?>(null);
     const type = ThemeType.auto;
+    final scale = context.theme.scaling;
 
     Future<void> onClose() async {
       await windowManager.close();
@@ -34,7 +37,7 @@ class WindowTitleBarButtons extends HookConsumerWidget {
       return null;
     }, []);
 
-    if (!kIsDesktop || kIsMacOS || preferences.systemTitleBar) {
+    if (!kTitlebarVisible || preferences.systemTitleBar) {
       return const SizedBox.shrink();
     }
 
@@ -43,8 +46,8 @@ class WindowTitleBarButtons extends HookConsumerWidget {
       final colors = WindowButtonColors(
         normal: Colors.transparent,
         iconNormal: foregroundColor ?? theme.colorScheme.onSurface,
-        mouseOver: theme.colorScheme.onSurface.withOpacity(0.1),
-        mouseDown: theme.colorScheme.onSurface.withOpacity(0.2),
+        mouseOver: theme.colorScheme.onSurface.withAlpha(25),
+        mouseDown: theme.colorScheme.onSurface.withAlpha(51),
         iconMouseOver: theme.colorScheme.onSurface,
         iconMouseDown: theme.colorScheme.onSurface,
       );
@@ -58,8 +61,8 @@ class WindowTitleBarButtons extends HookConsumerWidget {
         iconMouseDown: Colors.black,
       );
 
-      return Padding(
-        padding: const EdgeInsets.only(bottom: 25),
+      return Transform(
+        transform: Matrix4.translationValues(18, -12, 0) * scale,
         child: Row(
           crossAxisAlignment: CrossAxisAlignment.start,
           children: [
@@ -92,8 +95,8 @@ class WindowTitleBarButtons extends HookConsumerWidget {
       );
     }
 
-    return Padding(
-      padding: const EdgeInsets.only(bottom: 20, left: 10),
+    return Transform(
+      transform: Matrix4.translationValues(18, -12, 0) * scale,
       child: Row(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [

lib/components/titlebar/window_button.dart

@@ -1,8 +1,6 @@
-import 'dart:io';
-
-import 'package:flutter/foundation.dart';
-import 'package:flutter/material.dart';
+import 'package:shadcn_flutter/shadcn_flutter.dart';
 import 'package:spotube/components/titlebar/mouse_state.dart';
+import 'package:spotube/components/titlebar/titlebar.dart';
 
 typedef WindowButtonIconBuilder = Widget Function(
     WindowButtonContext buttonContext);
@@ -86,14 +84,7 @@ class WindowButton extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    if (kIsWeb) {
-      return Container();
-    } else {
-      // Don't show button on macOS
-      if (Platform.isMacOS) {
-        return Container();
-      }
-    }
+    if (!kTitlebarVisible) return const SizedBox.shrink();
 
     return MouseStateBuilder(
       builder: (context, mouseState) {
@@ -103,11 +94,12 @@ class WindowButton extends StatelessWidget {
             backgroundColor: getBackgroundColor(mouseState),
             iconColor: getIconColor(mouseState));
 
-        var icon =
-            (iconBuilder != null) ? iconBuilder!(buttonContext) : Container();
+        var icon = (iconBuilder != null)
+            ? iconBuilder!(buttonContext)
+            : const SizedBox();
 
         var fadeOutColor =
-            getBackgroundColor(MouseState()..isMouseOver = true).withOpacity(0);
+            getBackgroundColor(MouseState()..isMouseOver = true).withAlpha(0);
         var padding = this.padding ?? const EdgeInsets.all(10);
         var animationMs =
             mouseState.isMouseOver ? (animate ? 100 : 0) : (animate ? 200 : 0);

lib/pages/home/home.dart

@@ -36,7 +36,7 @@ class HomePage extends HookConsumerWidget {
         bottom: false,
         child: Scaffold(
           headers: [
-            if (kIsWindows || kIsLinux) const TitleBar(),
+            if (kTitlebarVisible) const TitleBar(),
           ],
           child: CustomScrollView(
             controller: controller,

lib/pages/library/library.dart

@@ -2,6 +2,7 @@ import 'package:flutter/material.dart' show Badge;
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:shadcn_flutter/shadcn_flutter.dart';
+import 'package:shadcn_flutter/shadcn_flutter_extension.dart';
 
 import 'package:spotube/modules/library/user_local_tracks.dart';
 import 'package:spotube/components/titlebar/titlebar.dart';
@@ -11,7 +12,6 @@ import 'package:spotube/modules/library/user_downloads.dart';
 import 'package:spotube/modules/library/user_playlists.dart';
 import 'package:spotube/extensions/context.dart';
 import 'package:spotube/provider/download_manager_provider.dart';
-import 'package:spotube/utils/platform.dart';
 
 class LibraryPage extends HookConsumerWidget {
   static const name = "library";
@@ -19,6 +19,7 @@ class LibraryPage extends HookConsumerWidget {
   const LibraryPage({super.key});
   @override
   Widget build(BuildContext context, ref) {
+    final scale = context.theme.scaling;
     final downloadingCount = ref.watch(downloadManagerProvider).$downloadCount;
     final index = useState(0);
 
@@ -38,8 +39,13 @@ class LibraryPage extends HookConsumerWidget {
       bottom: false,
       child: Scaffold(
         headers: [
-          if (kIsWindows || kIsLinux) const TitleBar(),
-          SingleChildScrollView(
+          TitleBar(
+            padding: const EdgeInsets.symmetric(
+                  horizontal: 18,
+                  vertical: 12,
+                ).copyWith(left: 0) *
+                scale,
+            child: SingleChildScrollView(
               scrollDirection: Axis.horizontal,
               child: TabList(
                 index: index.value,
@@ -54,6 +60,7 @@ class LibraryPage extends HookConsumerWidget {
                 ],
               ),
             ),
+          ),
           const Gap(10),
         ],
         child: IndexedStack(

lib/pages/search/search.dart

@@ -19,7 +19,6 @@ import 'package:spotube/pages/search/sections/tracks.dart';
 import 'package:spotube/provider/authentication/authentication.dart';
 import 'package:spotube/provider/spotify/spotify.dart';
 import 'package:spotube/services/kv_store/kv_store.dart';
-import 'package:spotube/utils/platform.dart';
 
 class SearchPage extends HookConsumerWidget {
   static const name = "search";
@@ -70,8 +69,7 @@ class SearchPage extends HookConsumerWidget {
       bottom: false,
       child: Scaffold(
         headers: [
-          if (kIsWindows || kIsLinux)
-            const TitleBar(automaticallyImplyLeading: true)
+          if (kTitlebarVisible) const TitleBar(automaticallyImplyLeading: true)
         ],
         child: auth.asData?.value == null
             ? const AnonymousFallback()

lib/pages/stats/stats.dart

@@ -16,7 +16,7 @@ class StatsPage extends HookConsumerWidget {
       bottom: false,
       child: Scaffold(
         headers: [
-          if (kIsWindows || kIsLinux) const TitleBar(),
+          if (kTitlebarVisible) const TitleBar(),
         ],
         child: CustomScrollView(
           slivers: [