Browse Source

feat: welcome screen UI improvement (#3057)

Yijing Huang 1 năm trước cách đây
mục cha
commit
3039944c74

+ 1 - 1
frontend/appflowy_flutter/lib/startup/tasks/app_window_size_manager.dart

@@ -7,7 +7,7 @@ import 'package:appflowy/core/config/kv_keys.dart';
 import 'package:appflowy/startup/startup.dart';
 
 class WindowSizeManager {
-  static const double minWindowHeight = 400.0;
+  static const double minWindowHeight = 600.0;
   static const double minWindowWidth = 800.0;
 
   static const width = 'width';

+ 22 - 28
frontend/appflowy_flutter/lib/user/presentation/folder/folder_widget.dart

@@ -171,23 +171,19 @@ class CreateFolderWidgetState extends State<CreateFolderWidget> {
         const VSpace(4.0),
         Padding(
           padding: const EdgeInsets.symmetric(horizontal: 4.0),
-          child: Row(
-            children: [
-              _buildTextButton(
-                context,
-                LocaleKeys.settings_files_create.tr(),
-                () async {
-                  if (_path.isEmpty) {
-                    _showToast(
-                      LocaleKeys.settings_files_locationCannotBeEmpty.tr(),
-                    );
-                  } else {
-                    await getIt<ApplicationDataStorage>().setCustomPath(_path);
-                    await widget.onPressedCreate();
-                  }
-                },
-              ),
-            ],
+          child: _buildTextButton(
+            context,
+            LocaleKeys.settings_files_create.tr(),
+            () async {
+              if (_path.isEmpty) {
+                _showToast(
+                  LocaleKeys.settings_files_locationCannotBeEmpty.tr(),
+                );
+              } else {
+                await getIt<ApplicationDataStorage>().setCustomPath(_path);
+                await widget.onPressedCreate();
+              }
+            },
           ),
         )
       ],
@@ -218,13 +214,10 @@ Widget _buildTextButton(
   String title,
   VoidCallback onPressed,
 ) {
-  return SizedBox(
-    width: 60,
-    child: SecondaryTextButton(
-      title,
-      mode: SecondaryTextButtonMode.small,
-      onPressed: onPressed,
-    ),
+  return SecondaryTextButton(
+    title,
+    mode: SecondaryTextButtonMode.small,
+    onPressed: onPressed,
   );
 }
 
@@ -243,17 +236,18 @@ class _FolderCard extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    const cardSpacing = 16.0;
     return Card(
       child: Padding(
         padding: const EdgeInsets.symmetric(
-          vertical: 16.0,
-          horizontal: 16.0,
+          vertical: cardSpacing,
+          horizontal: cardSpacing,
         ),
         child: Row(
           children: [
             if (icon != null)
               Padding(
-                padding: const EdgeInsets.only(right: 20),
+                padding: const EdgeInsets.only(right: cardSpacing),
                 child: icon!,
               ),
             Expanded(
@@ -280,7 +274,7 @@ class _FolderCard extends StatelessWidget {
               ),
             ),
             if (trailing != null) ...[
-              const HSpace(40),
+              const HSpace(cardSpacing),
               trailing!,
             ],
           ],

+ 77 - 65
frontend/appflowy_flutter/lib/user/presentation/skip_log_in_screen.dart

@@ -85,7 +85,6 @@ class _SkipLogInScreenState extends State<SkipLogInScreen> {
           ),
         ),
         const Spacer(),
-        const VSpace(48),
         const SkipLoginPageFooter(),
         const VSpace(20),
       ],
@@ -172,36 +171,48 @@ class SubscribeButtons extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Row(
-      mainAxisAlignment: MainAxisAlignment.center,
-      mainAxisSize: MainAxisSize.min,
+    return Wrap(
+      alignment: WrapAlignment.center,
       children: [
-        FlowyText.regular(
-          LocaleKeys.youCanAlso.tr(),
-          fontSize: FontSizes.s12,
-        ),
-        FlowyTextButton(
-          LocaleKeys.githubStarText.tr(),
-          fontWeight: FontWeight.w500,
-          fontColor: Theme.of(context).colorScheme.primary,
-          hoverColor: Colors.transparent,
-          fillColor: Colors.transparent,
-          onPressed: () => _launchURL(
-            'https://github.com/AppFlowy-IO/appflowy',
-          ),
-        ),
-        FlowyText.regular(
-          LocaleKeys.and.tr(),
-          fontSize: FontSizes.s12,
+        Row(
+          mainAxisAlignment: MainAxisAlignment.center,
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            FlowyText.regular(
+              LocaleKeys.youCanAlso.tr(),
+              fontSize: FontSizes.s12,
+            ),
+            FlowyTextButton(
+              LocaleKeys.githubStarText.tr(),
+              padding: const EdgeInsets.symmetric(horizontal: 4),
+              fontWeight: FontWeight.w500,
+              fontColor: Theme.of(context).colorScheme.primary,
+              hoverColor: Colors.transparent,
+              fillColor: Colors.transparent,
+              onPressed: () => _launchURL(
+                'https://github.com/AppFlowy-IO/appflowy',
+              ),
+            ),
+          ],
         ),
-        FlowyTextButton(
-          LocaleKeys.subscribeNewsletterText.tr(),
-          overflow: TextOverflow.ellipsis,
-          fontWeight: FontWeight.w500,
-          fontColor: Theme.of(context).colorScheme.primary,
-          hoverColor: Colors.transparent,
-          fillColor: Colors.transparent,
-          onPressed: () => _launchURL('https://www.appflowy.io/blog'),
+        Row(
+          mainAxisAlignment: MainAxisAlignment.center,
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            FlowyText.regular(
+              LocaleKeys.and.tr(),
+              fontSize: FontSizes.s12,
+            ),
+            FlowyTextButton(
+              LocaleKeys.subscribeNewsletterText.tr(),
+              padding: const EdgeInsets.symmetric(horizontal: 4.0),
+              fontWeight: FontWeight.w500,
+              fontColor: Theme.of(context).colorScheme.primary,
+              hoverColor: Colors.transparent,
+              fillColor: Colors.transparent,
+              onPressed: () => _launchURL('https://www.appflowy.io/blog'),
+            ),
+          ],
         ),
       ],
     );
@@ -224,43 +235,44 @@ class LanguageSelectorOnWelcomePage extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return BlocBuilder<AppearanceSettingsCubit, AppearanceSettingsState>(
-      builder: (context, state) {
-        return AppFlowyPopover(
-          offset: const Offset(0, -450),
-          direction: PopoverDirection.bottomWithRightAligned,
-          child: FlowyButton(
-            useIntrinsicWidth: true,
-            text: Row(
-              mainAxisSize: MainAxisSize.min,
-              mainAxisAlignment: MainAxisAlignment.end,
-              children: [
-                const FlowySvg(
-                  name: 'login/language',
-                  size: Size.square(20),
-                ),
-                const HSpace(4),
-                FlowyText(
-                  languageFromLocale(state.locale),
-                ),
-                // const HSpace(4),
-                const FlowySvg(
-                  name: 'home/drop_down_hide',
-                  size: Size.square(20),
-                ),
-              ],
+    return AppFlowyPopover(
+      offset: const Offset(0, -450),
+      direction: PopoverDirection.bottomWithRightAligned,
+      child: FlowyButton(
+        useIntrinsicWidth: true,
+        text: Row(
+          mainAxisSize: MainAxisSize.min,
+          mainAxisAlignment: MainAxisAlignment.end,
+          children: [
+            const FlowySvg(
+              name: 'login/language',
+              size: Size.square(20),
             ),
-          ),
-          popupBuilder: (BuildContext context) {
-            final easyLocalization = EasyLocalization.of(context);
-            if (easyLocalization == null) {
-              return const SizedBox.shrink();
-            }
-            final allLocales = easyLocalization.supportedLocales;
-            return LanguageItemsListView(
-              allLocales: allLocales,
-            );
-          },
+            const HSpace(4),
+            Builder(
+              builder: (context) {
+                final currentLocale =
+                    context.watch<AppearanceSettingsCubit>().state.locale;
+                return FlowyText(
+                  languageFromLocale(currentLocale),
+                );
+              },
+            ),
+            const FlowySvg(
+              name: 'home/drop_down_hide',
+              size: Size.square(20),
+            ),
+          ],
+        ),
+      ),
+      popupBuilder: (BuildContext context) {
+        final easyLocalization = EasyLocalization.of(context);
+        if (easyLocalization == null) {
+          return const SizedBox.shrink();
+        }
+        final allLocales = easyLocalization.supportedLocales;
+        return LanguageItemsListView(
+          allLocales: allLocales,
         );
       },
     );

+ 1 - 0
frontend/appflowy_flutter/packages/flowy_infra_ui/lib/style_widget/button.dart

@@ -195,6 +195,7 @@ class FlowyTextButton extends StatelessWidget {
       highlightColor: Colors.transparent,
       elevation: 0,
       constraints: constraints,
+      materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
       onPressed: () {},
       child: child,
     );