feat: welcome screen UI improvement (#3057)

This commit is contained in:
Yijing Huang 2023-07-31 10:01:12 -05:00 committed by GitHub
parent 338e342410
commit 3039944c74
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 101 additions and 94 deletions

View File

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

View File

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

View File

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

View File

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