styling

mobile/lib/modules/login/ui/login_form.dart

@@ -307,7 +307,7 @@ class LoginForm extends HookConsumerWidget {
           children: [
             Text(
               sanitizeUrl(serverEndpointController.text),
-              style: context.textTheme.displaySmall,
+              style: context.textTheme.titleSmall,
               textAlign: TextAlign.center,
             ),
             if (isPasswordLoginEnable.value) ...[

mobile/lib/modules/settings/views/settings_page.dart

@@ -67,7 +67,7 @@ class _MobileLayout extends StatelessWidget {
               title: Text(
                 s.title,
                 style: const TextStyle(
-                  fontWeight: FontWeight.bold,
+                  fontWeight: FontWeight.w500,
                 ),
               ).tr(),
               leading: Icon(s.icon),

mobile/lib/shared/ui/app_bar_dialog/app_bar_dialog.dart

@@ -15,6 +15,7 @@ import 'package:immich_mobile/shared/providers/websocket.provider.dart';
 import 'package:immich_mobile/shared/ui/app_bar_dialog/app_bar_profile_info.dart';
 import 'package:immich_mobile/shared/ui/app_bar_dialog/app_bar_server_info.dart';
 import 'package:immich_mobile/shared/ui/confirm_dialog.dart';
+import 'package:immich_mobile/shared/ui/immich_title_text.dart';
 import 'package:immich_mobile/utils/bytes_units.dart';
 import 'package:url_launcher/url_launcher.dart';
 
@@ -48,17 +49,11 @@ class ImmichAppBarDialog extends HookConsumerWidget {
               size: 20,
             ),
           ),
-          Expanded(
+          const Expanded(
             child: Align(
               alignment: Alignment.center,
-              child: Text(
+              child: ImmichTitleText(
-                'IMMICH',
+                fontSize: 16,
-                style: TextStyle(
-                  fontFamily: 'SnowburstOne',
-                  fontWeight: FontWeight.bold,
-                  color: context.primaryColor,
-                  fontSize: 16,
-                ),
               ),
             ),
           ),
@@ -75,15 +70,12 @@ class ImmichAppBarDialog extends HookConsumerWidget {
         leading: SizedBox(
           child: Icon(
             icon,
-            color: theme.textTheme.labelLarge?.color?.withAlpha(250),
             size: 20,
           ),
         ),
         title: Text(
           text,
-          style: theme.textTheme.labelLarge?.copyWith(
+          style: theme.textTheme.labelLarge?.copyWith(),
-            color: theme.textTheme.labelLarge?.color?.withAlpha(250),
-          ),
         ).tr(),
         onTap: onTap,
       );
@@ -161,9 +153,7 @@ class ImmichAppBarDialog extends HookConsumerWidget {
             ),
             title: Text(
               "backup_controller_page_server_storage",
-              style: context.textTheme.labelLarge?.copyWith(
+              style: context.textTheme.titleSmall,
-                fontWeight: FontWeight.w500,
-              ),
             ).tr(),
             isThreeLine: true,
             subtitle: Padding(
@@ -182,8 +172,10 @@ class ImmichAppBarDialog extends HookConsumerWidget {
                   ),
                   Padding(
                     padding: const EdgeInsets.only(top: 12.0),
-                    child:
+                    child: Text(
-                        const Text('backup_controller_page_storage_format').tr(
+                      'backup_controller_page_storage_format',
+                      style: context.textTheme.bodySmall,
+                    ).tr(
                       args: [
                         usedDiskSpace,
                         totalDiskSpace,

mobile/lib/shared/ui/app_bar_dialog/app_bar_server_info.dart

@@ -62,10 +62,8 @@ class AppBarServerInfo extends HookConsumerWidget {
                       ? serverInfoState.versionMismatchErrorMessage
                       : "profile_drawer_client_server_up_to_date".tr(),
                   textAlign: TextAlign.center,
-                  style: TextStyle(
+                  style: context.textTheme.labelMedium?.copyWith(
-                    fontSize: 11,
                     color: context.primaryColor,
-                    fontWeight: FontWeight.w500,
                   ),
                 ),
               ),
@@ -102,7 +100,7 @@ class AppBarServerInfo extends HookConsumerWidget {
                           fontSize: contentFontSize,
                           color: context.textTheme.labelSmall?.color
                               ?.withOpacity(0.5),
-                          fontWeight: FontWeight.bold,
+                          fontWeight: FontWeight.w500,
                         ),
                       ),
                     ),
@@ -144,7 +142,7 @@ class AppBarServerInfo extends HookConsumerWidget {
                           fontSize: contentFontSize,
                           color: context.textTheme.labelSmall?.color
                               ?.withOpacity(0.5),
-                          fontWeight: FontWeight.bold,
+                          fontWeight: FontWeight.w500,
                         ),
                       ),
                     ),
@@ -199,7 +197,7 @@ class AppBarServerInfo extends HookConsumerWidget {
                             fontSize: contentFontSize,
                             color: context.textTheme.labelSmall?.color
                                 ?.withOpacity(0.5),
-                            fontWeight: FontWeight.bold,
+                            fontWeight: FontWeight.w500,
                             overflow: TextOverflow.ellipsis,
                           ),
                           textAlign: TextAlign.end,
@@ -257,7 +255,7 @@ class AppBarServerInfo extends HookConsumerWidget {
                           fontSize: contentFontSize,
                           color: context.textTheme.labelSmall?.color
                               ?.withOpacity(0.5),
-                          fontWeight: FontWeight.bold,
+                          fontWeight: FontWeight.w500,
                         ),
                       ),
                     ),

mobile/lib/utils/immich_app_theme.dart

@@ -38,11 +38,11 @@ final ThemeData immichLightTheme = ThemeData(
   hintColor: Colors.indigo,
   focusColor: Colors.indigo,
   splashColor: Colors.indigo.withOpacity(0.15),
-  fontFamily: 'Overpass',
+  fontFamily: 'BeVietnamPro',
   scaffoldBackgroundColor: immichBackgroundColor,
   snackBarTheme: const SnackBarThemeData(
     contentTextStyle: TextStyle(
-      fontFamily: 'Overpass',
+      fontFamily: 'BeVietnamPro',
       color: Colors.indigo,
       fontWeight: FontWeight.bold,
     ),
@@ -50,9 +50,9 @@ final ThemeData immichLightTheme = ThemeData(
   ),
   appBarTheme: const AppBarTheme(
     titleTextStyle: TextStyle(
-      fontFamily: 'Overpass',
+      fontFamily: 'BeVietnamPro',
       color: Colors.indigo,
-      fontWeight: FontWeight.bold,
+      fontWeight: FontWeight.w500,
       fontSize: 18,
     ),
     backgroundColor: immichBackgroundColor,
@@ -72,35 +72,35 @@ final ThemeData immichLightTheme = ThemeData(
   drawerTheme: const DrawerThemeData(
     backgroundColor: immichBackgroundColor,
   ),
-  textTheme: const TextTheme(
+  // textTheme: const TextTheme(
-    displayLarge: TextStyle(
+  //   displayLarge: TextStyle(
-      fontSize: 26,
+  //     fontSize: 26,
-      fontWeight: FontWeight.bold,
+  //     fontWeight: FontWeight.bold,
-      color: Colors.indigo,
+  //     color: Colors.indigo,
-    ),
+  //   ),
-    displayMedium: TextStyle(
+  //   displayMedium: TextStyle(
-      fontSize: 14,
+  //     fontSize: 14,
-      fontWeight: FontWeight.bold,
+  //     fontWeight: FontWeight.bold,
-      color: Colors.black87,
+  //     color: Colors.black87,
-    ),
+  //   ),
-    displaySmall: TextStyle(
+  //   displaySmall: TextStyle(
-      fontSize: 12,
+  //     fontSize: 12,
-      fontWeight: FontWeight.bold,
+  //     fontWeight: FontWeight.bold,
-      color: Colors.indigo,
+  //     color: Colors.indigo,
-    ),
+  //   ),
-    titleSmall: TextStyle(
+  //   titleSmall: TextStyle(
-      fontSize: 16.0,
+  //     fontSize: 16.0,
-      fontWeight: FontWeight.bold,
+  //     fontWeight: FontWeight.bold,
-    ),
+  //   ),
-    titleMedium: TextStyle(
+  //   titleMedium: TextStyle(
-      fontSize: 18.0,
+  //     fontSize: 18.0,
-      fontWeight: FontWeight.bold,
+  //     fontWeight: FontWeight.bold,
-    ),
+  //   ),
-    titleLarge: TextStyle(
+  //   titleLarge: TextStyle(
-      fontSize: 26.0,
+  //     fontSize: 26.0,
-      fontWeight: FontWeight.bold,
+  //     fontWeight: FontWeight.bold,
-    ),
+  //   ),
-  ),
+  // ),
   elevatedButtonTheme: ElevatedButtonThemeData(
     style: ElevatedButton.styleFrom(
       backgroundColor: Colors.indigo,
@@ -160,10 +160,10 @@ final ThemeData immichDarkTheme = ThemeData(
   primaryColor: immichDarkThemePrimaryColor,
   scaffoldBackgroundColor: immichDarkBackgroundColor,
   hintColor: Colors.grey[600],
-  fontFamily: 'Overpass',
+  fontFamily: 'BeVietnamPro',
   snackBarTheme: SnackBarThemeData(
     contentTextStyle: const TextStyle(
-      fontFamily: 'Overpass',
+      fontFamily: 'BeVietnamPro',
       color: immichDarkThemePrimaryColor,
       fontWeight: FontWeight.bold,
     ),
@@ -176,9 +176,9 @@ final ThemeData immichDarkTheme = ThemeData(
   ),
   appBarTheme: const AppBarTheme(
     titleTextStyle: TextStyle(
-      fontFamily: 'Overpass',
+      fontFamily: 'BeVietnamPro',
       color: immichDarkThemePrimaryColor,
-      fontWeight: FontWeight.bold,
+      fontWeight: FontWeight.w500,
       fontSize: 18,
     ),
     backgroundColor: Color.fromARGB(255, 32, 33, 35),
@@ -196,35 +196,35 @@ final ThemeData immichDarkTheme = ThemeData(
     backgroundColor: immichDarkBackgroundColor,
     scrimColor: Colors.white.withOpacity(0.1),
   ),
-  textTheme: const TextTheme(
+  // textTheme: const TextTheme(
-    displayLarge: TextStyle(
+  //   displayLarge: TextStyle(
-      fontSize: 26,
+  //     fontSize: 26,
-      fontWeight: FontWeight.bold,
+  //     fontWeight: FontWeight.bold,
-      color: Color.fromARGB(255, 255, 255, 255),
+  //     color: Color.fromARGB(255, 255, 255, 255),
-    ),
+  //   ),
-    displayMedium: TextStyle(
+  //   displayMedium: TextStyle(
-      fontSize: 14,
+  //     fontSize: 14,
-      fontWeight: FontWeight.bold,
+  //     fontWeight: FontWeight.bold,
-      color: Color.fromARGB(255, 255, 255, 255),
+  //     color: Color.fromARGB(255, 255, 255, 255),
-    ),
+  //   ),
-    displaySmall: TextStyle(
+  //   displaySmall: TextStyle(
-      fontSize: 12,
+  //     fontSize: 12,
-      fontWeight: FontWeight.bold,
+  //     fontWeight: FontWeight.bold,
-      color: immichDarkThemePrimaryColor,
+  //     color: immichDarkThemePrimaryColor,
-    ),
+  //   ),
-    titleSmall: TextStyle(
+  //   titleSmall: TextStyle(
-      fontSize: 16.0,
+  //     fontSize: 16.0,
-      fontWeight: FontWeight.bold,
+  //     fontWeight: FontWeight.bold,
-    ),
+  //   ),
-    titleMedium: TextStyle(
+  //   titleMedium: TextStyle(
-      fontSize: 18.0,
+  //     fontSize: 18.0,
-      fontWeight: FontWeight.bold,
+  //     fontWeight: FontWeight.bold,
-    ),
+  //   ),
-    titleLarge: TextStyle(
+  //   titleLarge: TextStyle(
-      fontSize: 26.0,
+  //     fontSize: 26.0,
-      fontWeight: FontWeight.bold,
+  //     fontWeight: FontWeight.bold,
-    ),
+  //   ),
-  ),
+  // ),
   cardColor: Colors.grey[900],
   elevatedButtonTheme: ElevatedButtonThemeData(
     style: ElevatedButton.styleFrom(

mobile/pubspec.yaml

@@ -110,17 +110,17 @@ flutter:
     - family: Inconsolata
       fonts:
         - asset: fonts/Inconsolata-Regular.ttf
-    - family: Overpass
+    - family: BeVietnamPro
       fonts:
-        - asset: fonts/overpass/Overpass-Regular.ttf
+        - asset: fonts/bevietnampro/BeVietnamPro-Regular.ttf
           weight: 400
-        - asset: fonts/overpass/Overpass-Italic.ttf
+        - asset: fonts/bevietnampro/BeVietnamPro-Italic.ttf
           style: italic
-        - asset: fonts/overpass/Overpass-Medium.ttf
+        - asset: fonts/bevietnampro/BeVietnamPro-Medium.ttf
           weight: 500
-        - asset: fonts/overpass/Overpass-SemiBold.ttf
+        - asset: fonts/bevietnampro/BeVietnamPro-SemiBold.ttf
           weight: 600
-        - asset: fonts/overpass/Overpass-Bold.ttf
+        - asset: fonts/bevietnampro/BeVietnamPro-Bold.ttf
           weight: 700
     - family: OverpassMono
       fonts: