diff --git a/lib/app.dart b/lib/app.dart index 8976b7358..efe0ec76c 100644 --- a/lib/app.dart +++ b/lib/app.dart @@ -14,7 +14,7 @@ final lightThemeData = ThemeData( fontFamily: 'Inter', brightness: Brightness.light, hintColor: Colors.grey, - iconTheme: IconThemeData(color: Colors.green), + iconTheme: IconThemeData(color: Colors.black), primaryIconTheme: IconThemeData(color: Colors.red, opacity: 1.0, size: 50.0), colorScheme: ColorScheme.light(primary: Colors.blue), accentColor: Color.fromRGBO(45, 194, 98, 0.2), @@ -26,20 +26,20 @@ final lightThemeData = ThemeData( scaffoldBackgroundColor: Colors.white, backgroundColor: Colors.white, appBarTheme: AppBarTheme().copyWith(color: Colors.blue), + //https://api.flutter.dev/flutter/material/TextTheme-class.html textTheme: TextTheme().copyWith( - caption: TextStyle( - color: Colors.black.withOpacity(0.7), - fontSize: 14, - ), - overline: TextStyle( - color: Colors.black.withOpacity(0.8), - fontSize: 12, - )), + headline6: TextStyle( + color: Colors.black, fontSize: 18, fontWeight: FontWeight.w600), + subtitle1: TextStyle( + color: Colors.black, fontSize: 15, fontWeight: FontWeight.w500), + caption: TextStyle(color: Colors.black.withOpacity(0.7), fontSize: 14), + overline: TextStyle(color: Colors.black.withOpacity(0.8), fontSize: 12)), primaryTextTheme: TextTheme().copyWith( bodyText2: TextStyle(color: Colors.yellow), bodyText1: TextStyle(color: Colors.orange)), - cardColor: Color.fromRGBO(250, 250, 250, 1.0), // + cardColor: Color.fromRGBO(250, 250, 250, 1.0), + // dialogTheme: DialogTheme().copyWith( backgroundColor: Color.fromRGBO(250, 250, 250, 1.0), // ), @@ -69,6 +69,10 @@ final darkThemeData = ThemeData( ), // primaryColor: Colors.red, textTheme: TextTheme().copyWith( + headline6: TextStyle( + color: Colors.white, fontSize: 18, fontWeight: FontWeight.w600), + subtitle1: TextStyle( + color: Colors.white, fontSize: 16, fontWeight: FontWeight.w500), caption: TextStyle( color: Colors.white.withOpacity(0.6), fontSize: 14, diff --git a/lib/ui/settings/account_section_widget.dart b/lib/ui/settings/account_section_widget.dart index c3232b5d5..a28adb049 100644 --- a/lib/ui/settings/account_section_widget.dart +++ b/lib/ui/settings/account_section_widget.dart @@ -1,5 +1,5 @@ -import 'dart:io'; - +import 'package:expandable/expandable.dart'; +import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:flutter_sodium/flutter_sodium.dart'; import 'package:photos/core/configuration.dart'; @@ -9,6 +9,7 @@ import 'package:photos/ui/change_email_dialog.dart'; import 'package:photos/ui/password_entry_page.dart'; import 'package:photos/ui/payment/subscription.dart'; import 'package:photos/ui/recovery_key_dialog.dart'; +import 'package:photos/ui/settings/common_settings.dart'; import 'package:photos/ui/settings/settings_section_title.dart'; import 'package:photos/ui/settings/settings_text_item.dart'; import 'package:photos/utils/auth_util.dart'; @@ -25,12 +26,17 @@ class AccountSectionWidget extends StatefulWidget { class AccountSectionWidgetState extends State { @override Widget build(BuildContext context) { + return ExpandablePanel( + header: SettingsSectionTitle("Account"), + collapsed: Container(), + expanded: _getSectionOptions(context), + theme: getExpandableTheme(context), + ); + } + + Column _getSectionOptions(BuildContext context) { return Column( children: [ - SettingsSectionTitle("account"), - Padding( - padding: EdgeInsets.all(4), - ), GestureDetector( behavior: HitTestBehavior.translucent, onTap: () async { @@ -43,15 +49,9 @@ class AccountSectionWidgetState extends State { ); }, child: SettingsTextItem( - text: "subscription plan", icon: Icons.navigate_next), + text: "Subscription plan", icon: Icons.navigate_next), ), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(2)) - : Padding(padding: EdgeInsets.all(2)), - Divider(height: 4), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(2)) - : Padding(padding: EdgeInsets.all(4)), + SectionOptionDivider, GestureDetector( behavior: HitTestBehavior.translucent, onTap: () async { @@ -82,15 +82,9 @@ class AccountSectionWidgetState extends State { ); }, child: - SettingsTextItem(text: "recovery key", icon: Icons.navigate_next), + SettingsTextItem(text: "Recovery key", icon: Icons.navigate_next), ), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(2)) - : Padding(padding: EdgeInsets.all(4)), - Divider(height: 4), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(2)) - : Padding(padding: EdgeInsets.all(2)), + SectionOptionDivider, GestureDetector( behavior: HitTestBehavior.translucent, onTap: () async { @@ -113,13 +107,9 @@ class AccountSectionWidgetState extends State { ); }, child: - SettingsTextItem(text: "change email", icon: Icons.navigate_next), + SettingsTextItem(text: "Change email", icon: Icons.navigate_next), ), - Padding(padding: EdgeInsets.all(2)), - Divider(height: 4), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(2)) - : Padding(padding: EdgeInsets.all(4)), + SectionOptionDivider, GestureDetector( behavior: HitTestBehavior.translucent, onTap: () async { diff --git a/lib/ui/settings/app_version_widget.dart b/lib/ui/settings/app_version_widget.dart index bee2f9de5..b218904ce 100644 --- a/lib/ui/settings/app_version_widget.dart +++ b/lib/ui/settings/app_version_widget.dart @@ -51,10 +51,7 @@ class _AppVersionWidgetState extends State { padding: const EdgeInsets.all(20), child: Text( "app version: " + snapshot.data, - style: TextStyle( - fontSize: 12, - color: Colors.white.withOpacity(0.6), - ), + style: Theme.of(context).textTheme.caption, ), ); } diff --git a/lib/ui/settings/backup_section_widget.dart b/lib/ui/settings/backup_section_widget.dart index 1a956ceaa..fd9e30839 100644 --- a/lib/ui/settings/backup_section_widget.dart +++ b/lib/ui/settings/backup_section_widget.dart @@ -1,5 +1,6 @@ import 'dart:io'; +import 'package:expandable/expandable.dart'; import 'package:flutter/material.dart'; import 'package:photos/core/configuration.dart'; import 'package:photos/models/backup_status.dart'; @@ -9,6 +10,7 @@ import 'package:photos/services/sync_service.dart'; import 'package:photos/ui/backup_folder_selection_page.dart'; import 'package:photos/ui/deduplicate_page.dart'; import 'package:photos/ui/free_space_page.dart'; +import 'package:photos/ui/settings/common_settings.dart'; import 'package:photos/ui/settings/settings_section_title.dart'; import 'package:photos/ui/settings/settings_text_item.dart'; import 'package:photos/utils/data_util.dart'; @@ -27,39 +29,38 @@ class BackupSectionWidget extends StatefulWidget { class BackupSectionWidgetState extends State { @override Widget build(BuildContext context) { + return ExpandablePanel( + header: SettingsSectionTitle("Backup"), + collapsed: Container(), + expanded: _getSectionOptions(context), + theme: getExpandableTheme(context), + ); + } + + Widget _getSectionOptions(BuildContext context) { return Column( children: [ - SettingsSectionTitle("backup"), - Padding( - padding: EdgeInsets.all(4), - ), GestureDetector( behavior: HitTestBehavior.translucent, onTap: () async { routeToPage( context, BackupFolderSelectionPage( - buttonText: "backup", + buttonText: "Backup", ), ); }, child: SettingsTextItem( - text: "backed up folders", icon: Icons.navigate_next), + text: "Backed up folders", icon: Icons.navigate_next), ), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(2)) - : Padding(padding: EdgeInsets.all(0)), - Divider(height: 4), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(2)) - : Padding(padding: EdgeInsets.all(4)), + SectionOptionDivider, SizedBox( height: 36, child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - Text("backup over mobile data"), - Switch( + Text("Backup over mobile data"), + Switch.adaptive( value: Configuration.instance.shouldBackupOverMobileData(), onChanged: (value) async { Configuration.instance.setBackupOverMobileData(value); @@ -69,20 +70,14 @@ class BackupSectionWidgetState extends State { ], ), ), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(2)) - : Padding(padding: EdgeInsets.all(4)), - Divider(height: 4), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(2)) - : Padding(padding: EdgeInsets.all(4)), + SectionOptionDivider, SizedBox( height: 36, child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - Text("backup videos"), - Switch( + Text("Backup videos"), + Switch.adaptive( value: Configuration.instance.shouldBackupVideos(), onChanged: (value) async { Configuration.instance.setShouldBackupVideos(value); @@ -92,13 +87,7 @@ class BackupSectionWidgetState extends State { ], ), ), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(4)) - : Padding(padding: EdgeInsets.all(2)), - Divider(height: 4), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(2)) - : Padding(padding: EdgeInsets.all(2)), + SectionOptionDivider, GestureDetector( behavior: HitTestBehavior.translucent, onTap: () async { @@ -117,17 +106,11 @@ class BackupSectionWidgetState extends State { } }, child: SettingsTextItem( - text: "free up space", + text: "Free up space", icon: Icons.navigate_next, ), ), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(4)) - : Padding(padding: EdgeInsets.all(2)), - Divider(height: 4), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(2)) - : Padding(padding: EdgeInsets.all(2)), + SectionOptionDivider, GestureDetector( behavior: HitTestBehavior.translucent, onTap: () async { @@ -156,7 +139,7 @@ class BackupSectionWidgetState extends State { } }, child: SettingsTextItem( - text: "deduplicate files", + text: "Deduplicate files", icon: Icons.navigate_next, ), ), diff --git a/lib/ui/settings/common_settings.dart b/lib/ui/settings/common_settings.dart new file mode 100644 index 000000000..fbe14643b --- /dev/null +++ b/lib/ui/settings/common_settings.dart @@ -0,0 +1,21 @@ +import 'dart:io'; + +import 'package:expandable/expandable.dart'; +import 'package:flutter/cupertino.dart'; +import 'package:flutter/material.dart'; + +Widget SectionOptionDivider = Padding( + padding: EdgeInsets.all(Platform.isIOS ? 4 : 2), +); + +ExpandableThemeData getExpandableTheme(BuildContext context) { + return ExpandableThemeData( + expandIcon: CupertinoIcons.plus, + collapseIcon: CupertinoIcons.minus, + iconPadding: EdgeInsets.all(4), + iconColor: Theme.of(context).colorScheme.onSurface, + iconSize: 20.0, + iconRotationAngle: 3.14 / 2, + hasIcon: true, + ); +} diff --git a/lib/ui/settings/danger_section_widget.dart b/lib/ui/settings/danger_section_widget.dart index 24b017706..1587011b6 100644 --- a/lib/ui/settings/danger_section_widget.dart +++ b/lib/ui/settings/danger_section_widget.dart @@ -1,8 +1,8 @@ -import 'dart:io'; - +import 'package:expandable/expandable.dart'; import 'package:flutter/material.dart'; import 'package:flutter_email_sender/flutter_email_sender.dart'; import 'package:photos/services/user_service.dart'; +import 'package:photos/ui/settings/common_settings.dart'; import 'package:photos/ui/settings/settings_section_title.dart'; import 'package:photos/ui/settings/settings_text_item.dart'; import 'package:url_launcher/url_launcher.dart'; @@ -17,30 +17,32 @@ class DangerSectionWidget extends StatefulWidget { class _DangerSectionWidgetState extends State { @override Widget build(BuildContext context) { + return ExpandablePanel( + header: SettingsSectionTitle("Exit", color: Colors.red), + collapsed: Container(), + expanded: _getSectionOptions(context), + theme: getExpandableTheme(context), + ); + } + + Widget _getSectionOptions(BuildContext context) { return Column( children: [ - SettingsSectionTitle("exit", color: Colors.red), - Padding( - padding: EdgeInsets.all(4), - ), GestureDetector( behavior: HitTestBehavior.translucent, onTap: () { _onLogoutTapped(); }, - child: SettingsTextItem(text: "logout", icon: Icons.navigate_next), + child: SettingsTextItem(text: "Logout", icon: Icons.navigate_next), ), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(2)) - : Padding(padding: EdgeInsets.all(2)), - Divider(height: 4), + SectionOptionDivider, GestureDetector( behavior: HitTestBehavior.translucent, onTap: () { _onDeleteAccountTapped(); }, child: SettingsTextItem( - text: "delete account", icon: Icons.navigate_next), + text: "Delete account", icon: Icons.navigate_next), ), ], ); diff --git a/lib/ui/settings/debug_section_widget.dart b/lib/ui/settings/debug_section_widget.dart index e92b89f8c..a39112478 100644 --- a/lib/ui/settings/debug_section_widget.dart +++ b/lib/ui/settings/debug_section_widget.dart @@ -1,25 +1,33 @@ +import 'package:expandable/expandable.dart'; import 'package:flutter/material.dart'; import 'package:flutter_sodium/flutter_sodium.dart'; import 'package:photos/core/configuration.dart'; import 'package:photos/core/network.dart'; +import 'package:photos/ui/settings/common_settings.dart'; import 'package:photos/ui/settings/settings_section_title.dart'; import 'package:photos/ui/settings/settings_text_item.dart'; class DebugSectionWidget extends StatelessWidget { const DebugSectionWidget({Key key}) : super(key: key); - @override Widget build(BuildContext context) { + return ExpandablePanel( + header: SettingsSectionTitle("Debug"), + collapsed: Container(), + expanded: _getSectionOptions(context), + theme: getExpandableTheme(context), + ); + } + + Widget _getSectionOptions(BuildContext context) { return Column(children: [ - Padding(padding: EdgeInsets.all(12)), - SettingsSectionTitle("debug"), GestureDetector( behavior: HitTestBehavior.translucent, onTap: () async { _showKeyAttributesDialog(context); }, child: - SettingsTextItem(text: "key attributes", icon: Icons.navigate_next), + SettingsTextItem(text: "Key attributes", icon: Icons.navigate_next), ), GestureDetector( behavior: HitTestBehavior.translucent, @@ -27,7 +35,7 @@ class DebugSectionWidget extends StatelessWidget { Network.instance.getAlice().showInspector(); }, child: SettingsTextItem( - text: "network requests", icon: Icons.navigate_next), + text: "Network requests", icon: Icons.navigate_next), ) ]); } diff --git a/lib/ui/settings/info_section_widget.dart b/lib/ui/settings/info_section_widget.dart index 32ca8130b..10a58e4ae 100644 --- a/lib/ui/settings/info_section_widget.dart +++ b/lib/ui/settings/info_section_widget.dart @@ -1,6 +1,8 @@ +import 'package:expandable/expandable.dart'; import 'package:flutter/material.dart'; import 'package:photos/services/update_service.dart'; import 'package:photos/ui/app_update_dialog.dart'; +import 'package:photos/ui/settings/common_settings.dart'; import 'package:photos/ui/settings/settings_section_title.dart'; import 'package:photos/ui/settings/settings_text_item.dart'; import 'package:photos/ui/web_page.dart'; @@ -13,24 +15,31 @@ class InfoSectionWidget extends StatelessWidget { @override Widget build(BuildContext context) { + return ExpandablePanel( + header: SettingsSectionTitle("About"), + collapsed: Container(), + expanded: _getSectionOptions(context), + theme: getExpandableTheme(context), + ); + } + + Widget _getSectionOptions(BuildContext context) { return Column( children: [ - SettingsSectionTitle("about"), - Padding(padding: EdgeInsets.all(4)), GestureDetector( behavior: HitTestBehavior.translucent, onTap: () async { Navigator.of(context).push( MaterialPageRoute( builder: (BuildContext context) { - return WebPage("faq", "https://ente.io/faq"); + return WebPage("Faq", "https://ente.io/faq"); }, ), ); }, - child: SettingsTextItem(text: "faq", icon: Icons.navigate_next), + child: SettingsTextItem(text: "Faq", icon: Icons.navigate_next), ), - Divider(height: 4), + SectionOptionDivider, GestureDetector( behavior: HitTestBehavior.translucent, onTap: () { @@ -42,9 +51,9 @@ class InfoSectionWidget extends StatelessWidget { ), ); }, - child: SettingsTextItem(text: "terms", icon: Icons.navigate_next), + child: SettingsTextItem(text: "Terms", icon: Icons.navigate_next), ), - Divider(height: 4), + SectionOptionDivider, GestureDetector( behavior: HitTestBehavior.translucent, onTap: () { @@ -56,16 +65,16 @@ class InfoSectionWidget extends StatelessWidget { ), ); }, - child: SettingsTextItem(text: "privacy", icon: Icons.navigate_next), + child: SettingsTextItem(text: "Privacy", icon: Icons.navigate_next), ), - Divider(height: 4), + SectionOptionDivider, GestureDetector( behavior: HitTestBehavior.translucent, onTap: () async { launch("https://github.com/ente-io/frame"); }, child: - SettingsTextItem(text: "source code", icon: Icons.navigate_next), + SettingsTextItem(text: "Source code", icon: Icons.navigate_next), ), UpdateService.instance.isIndependent() ? Column( @@ -94,7 +103,7 @@ class InfoSectionWidget extends StatelessWidget { } }, child: SettingsTextItem( - text: "check for updates", icon: Icons.navigate_next), + text: "Check for updates", icon: Icons.navigate_next), ), ], ) diff --git a/lib/ui/settings/security_section_widget.dart b/lib/ui/settings/security_section_widget.dart index 3021f8f6a..291ebf6cc 100644 --- a/lib/ui/settings/security_section_widget.dart +++ b/lib/ui/settings/security_section_widget.dart @@ -1,6 +1,7 @@ import 'dart:async'; import 'dart:io'; +import 'package:expandable/expandable.dart'; import 'package:flutter/material.dart'; import 'package:flutter_windowmanager/flutter_windowmanager.dart'; import 'package:photos/core/configuration.dart'; @@ -10,6 +11,7 @@ import 'package:photos/services/user_service.dart'; import 'package:photos/ui/app_lock.dart'; import 'package:photos/ui/loading_widget.dart'; import 'package:photos/ui/sessions_page.dart'; +import 'package:photos/ui/settings/common_settings.dart'; import 'package:photos/ui/settings/settings_section_title.dart'; import 'package:photos/ui/settings/settings_text_item.dart'; import 'package:photos/utils/auth_util.dart'; @@ -49,25 +51,31 @@ class _SecuritySectionWidgetState extends State { @override Widget build(BuildContext context) { + return ExpandablePanel( + header: SettingsSectionTitle("Security"), + collapsed: Container(), + expanded: _getSectionOptions(context), + theme: getExpandableTheme(context), + ); + } + + Widget _getSectionOptions(BuildContext context) { final List children = []; - children.addAll([ - SettingsSectionTitle("security"), - ]); if (_config.hasConfiguredAccount()) { children.addAll( [ - Padding(padding: EdgeInsets.all(6)), + Padding(padding: EdgeInsets.all(2)), SizedBox( height: 36, child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - Text("two-factor"), + Text("Two-factor"), FutureBuilder( future: UserService.instance.fetchTwoFactorStatus(), builder: (_, snapshot) { if (snapshot.hasData) { - return Switch( + return Switch.adaptive( value: snapshot.data, onChanged: (value) async { AppLock.of(context).setEnabled(false); @@ -103,18 +111,14 @@ class _SecuritySectionWidgetState extends State { ); } children.addAll([ - Padding(padding: EdgeInsets.all(2)), - Divider(height: 4), - Platform.isIOS - ? Padding(padding: EdgeInsets.all(2)) - : Padding(padding: EdgeInsets.all(4)), + SectionOptionDivider, SizedBox( height: 36, child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - Text("lockscreen"), - Switch( + Text("Lockscreen"), + Switch.adaptive( value: _config.shouldShowLockScreen(), onChanged: (value) async { AppLock.of(context).disable(); @@ -137,21 +141,19 @@ class _SecuritySectionWidgetState extends State { if (Platform.isAndroid) { children.addAll( [ - Padding(padding: EdgeInsets.all(4)), - Divider(height: 4), - Padding(padding: EdgeInsets.all(4)), + SectionOptionDivider, SizedBox( height: 36, child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - Text("hide from recents"), - Switch( + Text("Hide from recents"), + Switch.adaptive( value: _config.shouldHideFromRecents(), onChanged: (value) async { if (value) { AlertDialog alert = AlertDialog( - title: Text("hide from recents?"), + title: Text("Hide from recents?"), content: SingleChildScrollView( child: Column( mainAxisAlignment: MainAxisAlignment.start, @@ -219,9 +221,7 @@ class _SecuritySectionWidgetState extends State { ); } children.addAll([ - Padding(padding: EdgeInsets.all(4)), - Divider(height: 4), - Padding(padding: EdgeInsets.all(2)), + SectionOptionDivider, GestureDetector( behavior: HitTestBehavior.translucent, onTap: () async { @@ -242,7 +242,7 @@ class _SecuritySectionWidgetState extends State { ); }, child: SettingsTextItem( - text: "active sessions", icon: Icons.navigate_next), + text: "Active sessions", icon: Icons.navigate_next), ), ]); return Column( @@ -252,9 +252,9 @@ class _SecuritySectionWidgetState extends State { void _disableTwoFactor() { AlertDialog alert = AlertDialog( - title: Text("disable two-factor"), + title: Text("Disable two-factor"), content: - Text("are you sure you want to disable two-factor authentication?"), + Text("Are you sure you want to disable two-factor authentication?"), actions: [ TextButton( child: Text( diff --git a/lib/ui/settings/settings_section_title.dart b/lib/ui/settings/settings_section_title.dart index 6bcb8d2e8..e86840354 100644 --- a/lib/ui/settings/settings_section_title.dart +++ b/lib/ui/settings/settings_section_title.dart @@ -18,11 +18,12 @@ class SettingsSectionTitle extends StatelessWidget { alignment: Alignment.centerLeft, child: Text( title, - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 16, - color: color ?? Theme.of(context).buttonColor, - ), + style: color != null + ? Theme.of(context) + .textTheme + .headline6 + .merge(TextStyle(color: color)) + : Theme.of(context).textTheme.headline6, ), ), Padding(padding: EdgeInsets.all(4)), diff --git a/lib/ui/settings/settings_text_item.dart b/lib/ui/settings/settings_text_item.dart index 47082489b..209f5f81f 100644 --- a/lib/ui/settings/settings_text_item.dart +++ b/lib/ui/settings/settings_text_item.dart @@ -19,7 +19,10 @@ class SettingsTextItem extends StatelessWidget { Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - Align(alignment: Alignment.centerLeft, child: Text(text)), + Align( + alignment: Alignment.centerLeft, + child: + Text(text, style: Theme.of(context).textTheme.subtitle1)), Icon(icon), ], ), @@ -27,4 +30,4 @@ class SettingsTextItem extends StatelessWidget { ], ); } -} \ No newline at end of file +} diff --git a/lib/ui/settings/social_section_widget.dart b/lib/ui/settings/social_section_widget.dart index be94b8419..1e6cefc22 100644 --- a/lib/ui/settings/social_section_widget.dart +++ b/lib/ui/settings/social_section_widget.dart @@ -1,7 +1,9 @@ import 'dart:io'; +import 'package:expandable/expandable.dart'; import 'package:flutter/material.dart'; import 'package:photos/services/update_service.dart'; +import 'package:photos/ui/settings/common_settings.dart'; import 'package:photos/ui/settings/settings_section_title.dart'; import 'package:photos/ui/settings/settings_text_item.dart'; import 'package:url_launcher/url_launcher.dart'; @@ -11,32 +13,39 @@ class SocialSectionWidget extends StatelessWidget { @override Widget build(BuildContext context) { + return ExpandablePanel( + header: SettingsSectionTitle("Social"), + collapsed: Container(), + expanded: _getSectionOptions(context), + theme: getExpandableTheme(context), + ); + } + + Widget _getSectionOptions(BuildContext context) { return Column( children: [ - SettingsSectionTitle("social"), - Padding(padding: EdgeInsets.all(4)), GestureDetector( behavior: HitTestBehavior.translucent, onTap: () { launch("https://twitter.com/enteio"); }, - child: SettingsTextItem(text: "twitter", icon: Icons.navigate_next), + child: SettingsTextItem(text: "Twitter", icon: Icons.navigate_next), ), - Divider(height: 4), + SectionOptionDivider, GestureDetector( behavior: HitTestBehavior.translucent, onTap: () { launch("https://discord.gg/uRqua3jSr5"); }, - child: SettingsTextItem(text: "discord", icon: Icons.navigate_next), + child: SettingsTextItem(text: "Discord", icon: Icons.navigate_next), ), - Divider(height: 4), + SectionOptionDivider, GestureDetector( behavior: HitTestBehavior.translucent, onTap: () { launch("https://reddit.com/r/enteio"); }, - child: SettingsTextItem(text: "reddit", icon: Icons.navigate_next), + child: SettingsTextItem(text: "Reddit", icon: Icons.navigate_next), ), !UpdateService.instance.isIndependent() ? Column( @@ -54,7 +63,7 @@ class SocialSectionWidget extends StatelessWidget { } }, child: SettingsTextItem( - text: "rate us! ✨", icon: Icons.navigate_next), + text: "Rate us! ✨", icon: Icons.navigate_next), ), ], ) diff --git a/lib/ui/settings/support_section_widget.dart b/lib/ui/settings/support_section_widget.dart index f11123b60..4c81aaf37 100644 --- a/lib/ui/settings/support_section_widget.dart +++ b/lib/ui/settings/support_section_widget.dart @@ -1,8 +1,10 @@ +import 'package:expandable/expandable.dart'; import 'package:flutter/material.dart'; import 'package:flutter_email_sender/flutter_email_sender.dart'; import 'package:logging/logging.dart'; import 'package:photos/core/configuration.dart'; import 'package:photos/core/constants.dart'; +import 'package:photos/ui/settings/common_settings.dart'; import 'package:photos/ui/settings/settings_section_title.dart'; import 'package:photos/ui/settings/settings_text_item.dart'; import 'package:photos/ui/web_page.dart'; @@ -15,10 +17,17 @@ class SupportSectionWidget extends StatelessWidget { @override Widget build(BuildContext context) { + return ExpandablePanel( + header: SettingsSectionTitle("Support"), + collapsed: Container(), + expanded: _getSectionOptions(context), + theme: getExpandableTheme(context), + ); + } + + Widget _getSectionOptions(BuildContext context) { return Column( children: [ - SettingsSectionTitle("support"), - Padding(padding: EdgeInsets.all(4)), GestureDetector( behavior: HitTestBehavior.translucent, onTap: () async { @@ -33,9 +42,9 @@ class SupportSectionWidget extends StatelessWidget { launch("mailto:hey@ente.io"); } }, - child: SettingsTextItem(text: "email", icon: Icons.navigate_next), + child: SettingsTextItem(text: "Email", icon: Icons.navigate_next), ), - Divider(height: 4), + SectionOptionDivider, GestureDetector( behavior: HitTestBehavior.translucent, onTap: () { @@ -53,9 +62,9 @@ class SupportSectionWidget extends StatelessWidget { ), ); }, - child: SettingsTextItem(text: "roadmap", icon: Icons.navigate_next), + child: SettingsTextItem(text: "Roadmap", icon: Icons.navigate_next), ), - Divider(height: 4), + SectionOptionDivider, GestureDetector( behavior: HitTestBehavior.translucent, onTap: () async { @@ -64,7 +73,7 @@ class SupportSectionWidget extends StatelessWidget { }); }, child: SettingsTextItem( - text: "report bug 🐞", icon: Icons.navigate_next), + text: "Report bug 🐞", icon: Icons.navigate_next), ), ], ); diff --git a/lib/ui/settings_page.dart b/lib/ui/settings_page.dart index e747a61db..0251c7609 100644 --- a/lib/ui/settings_page.dart +++ b/lib/ui/settings_page.dart @@ -20,37 +20,41 @@ class SettingsPage extends StatelessWidget { Widget build(BuildContext context) { return Scaffold( appBar: AppBar( - title: Text("settings"), + title: Text("Settings"), ), - body: _getBody(), + body: _getBody(context), ); } - Widget _getBody() { + Widget _getBody(BuildContext context) { final hasLoggedIn = Configuration.instance.getToken() != null; final List contents = []; + final sectionDivider = Divider( + height: 10, + color: Theme.of(context).colorScheme.onSurface.withOpacity(0.4), + ); if (hasLoggedIn) { contents.addAll([ DetailsSectionWidget(), - Padding(padding: EdgeInsets.all(12)), + sectionDivider, BackupSectionWidget(), - Padding(padding: EdgeInsets.all(12)), + sectionDivider, AccountSectionWidget(), - Padding(padding: EdgeInsets.all(12)), + sectionDivider, ]); } contents.addAll([ SecuritySectionWidget(), - Padding(padding: EdgeInsets.all(12)), + sectionDivider, SupportSectionWidget(), - Padding(padding: EdgeInsets.all(12)), + sectionDivider, SocialSectionWidget(), - Padding(padding: EdgeInsets.all(12)), + sectionDivider, InfoSectionWidget(), ]); if (hasLoggedIn) { contents.addAll([ - Padding(padding: EdgeInsets.all(12)), + sectionDivider, DangerSectionWidget(), ]); }