mirror of
				https://github.com/KevinMidboe/immich.git
				synced 2025-10-29 17:40:28 +00:00 
			
		
		
		
	chore(mobile): additional MD3 styling and refactor some code (#1741)
This commit is contained in:
		@@ -14,11 +14,15 @@ class BackupInfoCard extends StatelessWidget {
 | 
			
		||||
 | 
			
		||||
  @override
 | 
			
		||||
  Widget build(BuildContext context) {
 | 
			
		||||
    var isDarkMode = Theme.of(context).brightness == Brightness.dark;
 | 
			
		||||
 | 
			
		||||
    return Card(
 | 
			
		||||
      shape: RoundedRectangleBorder(
 | 
			
		||||
        borderRadius: BorderRadius.circular(5), // if you need this
 | 
			
		||||
        side: const BorderSide(
 | 
			
		||||
          color: Colors.black12,
 | 
			
		||||
        borderRadius: BorderRadius.circular(20), // if you need this
 | 
			
		||||
        side: BorderSide(
 | 
			
		||||
          color: isDarkMode
 | 
			
		||||
              ? const Color.fromARGB(255, 101, 101, 101)
 | 
			
		||||
              : Colors.black12,
 | 
			
		||||
          width: 1,
 | 
			
		||||
        ),
 | 
			
		||||
      ),
 | 
			
		||||
 
 | 
			
		||||
@@ -31,6 +31,7 @@ class BackupControllerPage extends HookConsumerWidget {
 | 
			
		||||
            !hasExclusiveAccess
 | 
			
		||||
        ? false
 | 
			
		||||
        : true;
 | 
			
		||||
    var isDarkMode = Theme.of(context).brightness == Brightness.dark;
 | 
			
		||||
 | 
			
		||||
    useEffect(
 | 
			
		||||
      () {
 | 
			
		||||
@@ -421,9 +422,11 @@ class BackupControllerPage extends HookConsumerWidget {
 | 
			
		||||
    buildFolderSelectionTile() {
 | 
			
		||||
      return Card(
 | 
			
		||||
        shape: RoundedRectangleBorder(
 | 
			
		||||
          borderRadius: BorderRadius.circular(5), // if you need this
 | 
			
		||||
          side: const BorderSide(
 | 
			
		||||
            color: Colors.black12,
 | 
			
		||||
          borderRadius: BorderRadius.circular(20),
 | 
			
		||||
          side: BorderSide(
 | 
			
		||||
            color: isDarkMode
 | 
			
		||||
                ? const Color.fromARGB(255, 101, 101, 101)
 | 
			
		||||
                : Colors.black12,
 | 
			
		||||
            width: 1,
 | 
			
		||||
          ),
 | 
			
		||||
        ),
 | 
			
		||||
@@ -476,6 +479,69 @@ class BackupControllerPage extends HookConsumerWidget {
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    Widget buildBackupButton() {
 | 
			
		||||
      return Padding(
 | 
			
		||||
        padding: const EdgeInsets.only(
 | 
			
		||||
          top: 24,
 | 
			
		||||
        ),
 | 
			
		||||
        child: Container(
 | 
			
		||||
          child: backupState.backupProgress == BackUpProgressEnum.inProgress
 | 
			
		||||
              ? ElevatedButton(
 | 
			
		||||
                  style: ElevatedButton.styleFrom(
 | 
			
		||||
                    foregroundColor: Colors.grey[50],
 | 
			
		||||
                    backgroundColor: Colors.red[300],
 | 
			
		||||
                    // padding: const EdgeInsets.all(14),
 | 
			
		||||
                  ),
 | 
			
		||||
                  onPressed: () {
 | 
			
		||||
                    ref.read(backupProvider.notifier).cancelBackup();
 | 
			
		||||
                  },
 | 
			
		||||
                  child: const Text(
 | 
			
		||||
                    "backup_controller_page_cancel",
 | 
			
		||||
                    style: TextStyle(
 | 
			
		||||
                      fontSize: 14,
 | 
			
		||||
                      fontWeight: FontWeight.bold,
 | 
			
		||||
                    ),
 | 
			
		||||
                  ).tr(),
 | 
			
		||||
                )
 | 
			
		||||
              : ElevatedButton(
 | 
			
		||||
                  onPressed: shouldBackup ? startBackup : null,
 | 
			
		||||
                  child: const Text(
 | 
			
		||||
                    "backup_controller_page_start_backup",
 | 
			
		||||
                    style: TextStyle(
 | 
			
		||||
                      fontSize: 14,
 | 
			
		||||
                      fontWeight: FontWeight.bold,
 | 
			
		||||
                    ),
 | 
			
		||||
                  ).tr(),
 | 
			
		||||
                ),
 | 
			
		||||
        ),
 | 
			
		||||
      );
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    buildBackgroundBackupInfo() {
 | 
			
		||||
      return hasExclusiveAccess
 | 
			
		||||
          ? const SizedBox.shrink()
 | 
			
		||||
          : Card(
 | 
			
		||||
              shape: RoundedRectangleBorder(
 | 
			
		||||
                borderRadius: BorderRadius.circular(20), // if you need this
 | 
			
		||||
                side: BorderSide(
 | 
			
		||||
                  color: isDarkMode
 | 
			
		||||
                      ? const Color.fromARGB(255, 101, 101, 101)
 | 
			
		||||
                      : Colors.black12,
 | 
			
		||||
                  width: 1,
 | 
			
		||||
                ),
 | 
			
		||||
              ),
 | 
			
		||||
              elevation: 0,
 | 
			
		||||
              borderOnForeground: false,
 | 
			
		||||
              child: const Padding(
 | 
			
		||||
                padding: EdgeInsets.all(16.0),
 | 
			
		||||
                child: Text(
 | 
			
		||||
                  "Background backup is currently running, some actions are disabled",
 | 
			
		||||
                  style: TextStyle(fontWeight: FontWeight.bold),
 | 
			
		||||
                ),
 | 
			
		||||
              ),
 | 
			
		||||
            );
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    return Scaffold(
 | 
			
		||||
      appBar: AppBar(
 | 
			
		||||
        elevation: 0,
 | 
			
		||||
@@ -506,27 +572,7 @@ class BackupControllerPage extends HookConsumerWidget {
 | 
			
		||||
                style: TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
 | 
			
		||||
              ).tr(),
 | 
			
		||||
            ),
 | 
			
		||||
            hasExclusiveAccess
 | 
			
		||||
                ? const SizedBox.shrink()
 | 
			
		||||
                : Card(
 | 
			
		||||
                    shape: RoundedRectangleBorder(
 | 
			
		||||
                      borderRadius:
 | 
			
		||||
                          BorderRadius.circular(5), // if you need this
 | 
			
		||||
                      side: const BorderSide(
 | 
			
		||||
                        color: Colors.black12,
 | 
			
		||||
                        width: 1,
 | 
			
		||||
                      ),
 | 
			
		||||
                    ),
 | 
			
		||||
                    elevation: 0,
 | 
			
		||||
                    borderOnForeground: false,
 | 
			
		||||
                    child: const Padding(
 | 
			
		||||
                      padding: EdgeInsets.all(16.0),
 | 
			
		||||
                      child: Text(
 | 
			
		||||
                        "Background backup is currently running, some actions are disabled",
 | 
			
		||||
                        style: TextStyle(fontWeight: FontWeight.bold),
 | 
			
		||||
                      ),
 | 
			
		||||
                    ),
 | 
			
		||||
                  ),
 | 
			
		||||
            buildBackgroundBackupInfo(),
 | 
			
		||||
            buildFolderSelectionTile(),
 | 
			
		||||
            BackupInfoCard(
 | 
			
		||||
              title: "backup_controller_page_total".tr(),
 | 
			
		||||
@@ -552,42 +598,7 @@ class BackupControllerPage extends HookConsumerWidget {
 | 
			
		||||
            buildStorageInformation(),
 | 
			
		||||
            const Divider(),
 | 
			
		||||
            const CurrentUploadingAssetInfoBox(),
 | 
			
		||||
            Padding(
 | 
			
		||||
              padding: const EdgeInsets.only(
 | 
			
		||||
                top: 24,
 | 
			
		||||
              ),
 | 
			
		||||
              child: Container(
 | 
			
		||||
                child:
 | 
			
		||||
                    backupState.backupProgress == BackUpProgressEnum.inProgress
 | 
			
		||||
                        ? ElevatedButton(
 | 
			
		||||
                            style: ElevatedButton.styleFrom(
 | 
			
		||||
                              foregroundColor: Colors.grey[50],
 | 
			
		||||
                              backgroundColor: Colors.red[300],
 | 
			
		||||
                              // padding: const EdgeInsets.all(14),
 | 
			
		||||
                            ),
 | 
			
		||||
                            onPressed: () {
 | 
			
		||||
                              ref.read(backupProvider.notifier).cancelBackup();
 | 
			
		||||
                            },
 | 
			
		||||
                            child: const Text(
 | 
			
		||||
                              "backup_controller_page_cancel",
 | 
			
		||||
                              style: TextStyle(
 | 
			
		||||
                                fontSize: 14,
 | 
			
		||||
                                fontWeight: FontWeight.bold,
 | 
			
		||||
                              ),
 | 
			
		||||
                            ).tr(),
 | 
			
		||||
                          )
 | 
			
		||||
                        : ElevatedButton(
 | 
			
		||||
                            onPressed: shouldBackup ? startBackup : null,
 | 
			
		||||
                            child: const Text(
 | 
			
		||||
                              "backup_controller_page_start_backup",
 | 
			
		||||
                              style: TextStyle(
 | 
			
		||||
                                fontSize: 14,
 | 
			
		||||
                                fontWeight: FontWeight.bold,
 | 
			
		||||
                              ),
 | 
			
		||||
                            ).tr(),
 | 
			
		||||
                          ),
 | 
			
		||||
              ),
 | 
			
		||||
            )
 | 
			
		||||
            buildBackupButton()
 | 
			
		||||
          ],
 | 
			
		||||
        ),
 | 
			
		||||
      ),
 | 
			
		||||
 
 | 
			
		||||
@@ -92,8 +92,18 @@ ThemeData immichLightTheme = ThemeData(
 | 
			
		||||
  ),
 | 
			
		||||
  navigationBarTheme: NavigationBarThemeData(
 | 
			
		||||
    indicatorColor: Colors.indigo.withOpacity(0.15),
 | 
			
		||||
    iconTheme: MaterialStatePropertyAll(
 | 
			
		||||
      IconThemeData(color: Colors.grey[700]),
 | 
			
		||||
    ),
 | 
			
		||||
    backgroundColor: immichBackgroundColor,
 | 
			
		||||
    surfaceTintColor: Colors.transparent,
 | 
			
		||||
    labelTextStyle: MaterialStatePropertyAll(
 | 
			
		||||
      TextStyle(
 | 
			
		||||
        fontSize: 12,
 | 
			
		||||
        fontWeight: FontWeight.w600,
 | 
			
		||||
        color: Colors.grey[700],
 | 
			
		||||
      ),
 | 
			
		||||
    ),
 | 
			
		||||
  ),
 | 
			
		||||
);
 | 
			
		||||
 | 
			
		||||
@@ -166,10 +176,17 @@ ThemeData immichDarkTheme = ThemeData(
 | 
			
		||||
  ),
 | 
			
		||||
  navigationBarTheme: NavigationBarThemeData(
 | 
			
		||||
    indicatorColor: immichDarkThemePrimaryColor.withOpacity(0.4),
 | 
			
		||||
    iconTheme: const MaterialStatePropertyAll(
 | 
			
		||||
      IconThemeData(color: Colors.white),
 | 
			
		||||
    iconTheme: MaterialStatePropertyAll(
 | 
			
		||||
      IconThemeData(color: Colors.grey[500]),
 | 
			
		||||
    ),
 | 
			
		||||
    backgroundColor: Colors.grey[900],
 | 
			
		||||
    surfaceTintColor: Colors.transparent,
 | 
			
		||||
    labelTextStyle: MaterialStatePropertyAll(
 | 
			
		||||
      TextStyle(
 | 
			
		||||
        fontSize: 12,
 | 
			
		||||
        fontWeight: FontWeight.w600,
 | 
			
		||||
        color: Colors.grey[500],
 | 
			
		||||
      ),
 | 
			
		||||
    ),
 | 
			
		||||
  ),
 | 
			
		||||
);
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user