chore: Adjust onboarding design
This commit is contained in:
parent
b473fa3ca4
commit
79a625a25f
@ -1,5 +1,4 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
|
||||
import 'package:fluffychat/utils/platform_infos.dart';
|
||||
import 'app_config.dart';
|
||||
@ -59,7 +58,6 @@ abstract class FluffyThemes {
|
||||
filled: true,
|
||||
),
|
||||
appBarTheme: AppBarTheme(
|
||||
systemOverlayStyle: SystemUiOverlayStyle.dark,
|
||||
surfaceTintColor: Colors.white,
|
||||
shadowColor: Colors.black.withAlpha(64),
|
||||
),
|
||||
@ -92,6 +90,10 @@ abstract class FluffyThemes {
|
||||
filled: true,
|
||||
),
|
||||
dividerColor: Colors.blueGrey.shade900,
|
||||
appBarTheme: AppBarTheme(
|
||||
surfaceTintColor: Colors.black,
|
||||
shadowColor: Colors.black.withAlpha(64),
|
||||
),
|
||||
);
|
||||
|
||||
static Color blackWhiteColor(BuildContext context) =>
|
||||
|
@ -1,9 +1,9 @@
|
||||
import 'package:fluffychat/config/app_config.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'package:flutter_gen/gen_l10n/l10n.dart';
|
||||
import 'package:vrouter/vrouter.dart';
|
||||
|
||||
import 'package:fluffychat/config/app_config.dart';
|
||||
import 'package:fluffychat/pages/chat_list/chat_list.dart';
|
||||
import 'package:fluffychat/pages/chat_list/client_chooser_button.dart';
|
||||
import 'package:fluffychat/widgets/matrix.dart';
|
||||
|
@ -33,7 +33,7 @@ class ConnectPageView extends StatelessWidget {
|
||||
children: [
|
||||
if (Matrix.of(context).loginRegistrationSupported ?? false) ...[
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: Center(
|
||||
child: Stack(
|
||||
children: [
|
||||
@ -85,7 +85,7 @@ class ConnectPageView extends StatelessWidget {
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: TextField(
|
||||
controller: controller.usernameController,
|
||||
onSubmitted: (_) => controller.signUp(),
|
||||
@ -101,7 +101,7 @@ class ConnectPageView extends StatelessWidget {
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: Hero(
|
||||
tag: 'loginButton',
|
||||
child: ElevatedButton(
|
||||
@ -116,7 +116,7 @@ class ConnectPageView extends StatelessWidget {
|
||||
children: [
|
||||
const Expanded(child: Divider(color: Colors.white)),
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: Text(
|
||||
L10n.of(context)!.or,
|
||||
style: const TextStyle(color: Colors.white),
|
||||
@ -138,7 +138,7 @@ class ConnectPageView extends StatelessWidget {
|
||||
: Center(
|
||||
child: identityProviders.length == 1
|
||||
? Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: ElevatedButton(
|
||||
onPressed: () => controller
|
||||
.ssoLoginAction(identityProviders.single.id!),
|
||||
@ -160,7 +160,7 @@ class ConnectPageView extends StatelessWidget {
|
||||
),
|
||||
if (controller.supportsLogin)
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: Hero(
|
||||
tag: 'signinButton',
|
||||
child: ElevatedButton(
|
||||
|
@ -2,7 +2,6 @@ import 'package:flutter/material.dart';
|
||||
|
||||
import 'package:flutter_gen/gen_l10n/l10n.dart';
|
||||
import 'package:url_launcher/url_launcher.dart';
|
||||
import 'package:vrouter/vrouter.dart';
|
||||
|
||||
import 'package:fluffychat/config/app_config.dart';
|
||||
import 'package:fluffychat/utils/platform_infos.dart';
|
||||
@ -18,177 +17,152 @@ class HomeserverPickerView extends StatelessWidget {
|
||||
Widget build(BuildContext context) {
|
||||
final benchmarkResults = controller.benchmarkResults;
|
||||
return LoginScaffold(
|
||||
appBar: VRouter.of(context).path == '/home'
|
||||
? null
|
||||
: AppBar(title: Text(L10n.of(context)!.addAccount)),
|
||||
body: SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
// display a prominent banner to import session for TOR browser
|
||||
// users. This feature is just some UX sugar as TOR users are
|
||||
// usually forced to logout as TOR browser is non-persistent
|
||||
AnimatedContainer(
|
||||
height: controller.isTorBrowser ? 64 : 0,
|
||||
duration: const Duration(milliseconds: 300),
|
||||
appBar: AppBar(
|
||||
backgroundColor: Colors.transparent,
|
||||
actions: [
|
||||
IconButton(
|
||||
onPressed: controller.restoreBackup,
|
||||
tooltip: L10n.of(context)!.hydrate,
|
||||
icon: const Icon(
|
||||
Icons.restore_outlined,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
IconButton(
|
||||
tooltip: L10n.of(context)!.privacy,
|
||||
onPressed: () => launch(AppConfig.privacyUrl),
|
||||
icon: const Icon(
|
||||
Icons.shield_outlined,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
IconButton(
|
||||
tooltip: L10n.of(context)!.about,
|
||||
onPressed: () => PlatformInfos.showDialog(context),
|
||||
icon: const Icon(
|
||||
Icons.info_outlined,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
body: Column(
|
||||
children: [
|
||||
// display a prominent banner to import session for TOR browser
|
||||
// users. This feature is just some UX sugar as TOR users are
|
||||
// usually forced to logout as TOR browser is non-persistent
|
||||
AnimatedContainer(
|
||||
height: controller.isTorBrowser ? 64 : 0,
|
||||
duration: const Duration(milliseconds: 300),
|
||||
clipBehavior: Clip.hardEdge,
|
||||
curve: Curves.bounceInOut,
|
||||
decoration: const BoxDecoration(),
|
||||
child: Material(
|
||||
clipBehavior: Clip.hardEdge,
|
||||
curve: Curves.bounceInOut,
|
||||
decoration: const BoxDecoration(),
|
||||
child: Material(
|
||||
clipBehavior: Clip.hardEdge,
|
||||
borderRadius:
|
||||
const BorderRadius.vertical(bottom: Radius.circular(8)),
|
||||
color: Theme.of(context).colorScheme.surface,
|
||||
child: ListTile(
|
||||
leading: const Icon(Icons.vpn_key),
|
||||
title: Text(L10n.of(context)!.hydrateTor),
|
||||
subtitle: Text(L10n.of(context)!.hydrateTorLong),
|
||||
trailing: const Icon(Icons.chevron_right_outlined),
|
||||
onTap: controller.restoreBackup,
|
||||
),
|
||||
borderRadius:
|
||||
const BorderRadius.vertical(bottom: Radius.circular(8)),
|
||||
color: Theme.of(context).colorScheme.surface,
|
||||
child: ListTile(
|
||||
leading: const Icon(Icons.vpn_key),
|
||||
title: Text(L10n.of(context)!.hydrateTor),
|
||||
subtitle: Text(L10n.of(context)!.hydrateTorLong),
|
||||
trailing: const Icon(Icons.chevron_right_outlined),
|
||||
onTap: controller.restoreBackup,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: ListView(
|
||||
children: [
|
||||
Container(
|
||||
alignment: Alignment.center,
|
||||
height: 256,
|
||||
child: Image.asset('assets/info-logo.png'),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: TextField(
|
||||
focusNode: controller.homeserverFocusNode,
|
||||
controller: controller.homeserverController,
|
||||
onChanged: controller.onChanged,
|
||||
decoration: InputDecoration(
|
||||
prefixText: '${L10n.of(context)!.homeserver}: ',
|
||||
hintText: L10n.of(context)!.enterYourHomeserver,
|
||||
suffixIcon: const Icon(Icons.search),
|
||||
errorText: controller.error,
|
||||
fillColor: Theme.of(context)
|
||||
.colorScheme
|
||||
.background
|
||||
.withOpacity(0.75),
|
||||
),
|
||||
readOnly: !AppConfig.allowOtherHomeservers,
|
||||
onSubmitted: (_) => controller.checkHomeserverAction(),
|
||||
autocorrect: false,
|
||||
),
|
||||
Expanded(
|
||||
child: ListView(
|
||||
children: [
|
||||
Container(
|
||||
alignment: Alignment.center,
|
||||
height: 200,
|
||||
child: Image.asset('assets/info-logo.png'),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: TextField(
|
||||
focusNode: controller.homeserverFocusNode,
|
||||
controller: controller.homeserverController,
|
||||
onChanged: controller.onChanged,
|
||||
decoration: InputDecoration(
|
||||
prefixText: '${L10n.of(context)!.homeserver}: ',
|
||||
hintText: L10n.of(context)!.enterYourHomeserver,
|
||||
suffixIcon: const Icon(Icons.search),
|
||||
errorText: controller.error,
|
||||
fillColor: Theme.of(context)
|
||||
.colorScheme
|
||||
.background
|
||||
.withOpacity(0.75),
|
||||
),
|
||||
readOnly: !AppConfig.allowOtherHomeservers,
|
||||
onSubmitted: (_) => controller.checkHomeserverAction(),
|
||||
autocorrect: false,
|
||||
),
|
||||
if (controller.displayServerList)
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: Material(
|
||||
borderRadius:
|
||||
BorderRadius.circular(AppConfig.borderRadius),
|
||||
color: Colors.white.withAlpha(200),
|
||||
clipBehavior: Clip.hardEdge,
|
||||
child: benchmarkResults == null
|
||||
? const Center(
|
||||
child: Padding(
|
||||
padding: EdgeInsets.all(16.0),
|
||||
child: CircularProgressIndicator.adaptive(),
|
||||
))
|
||||
: Column(
|
||||
children: controller.filteredHomeservers
|
||||
.map(
|
||||
(server) => ListTile(
|
||||
trailing: IconButton(
|
||||
icon: const Icon(
|
||||
Icons.info_outlined,
|
||||
color: Colors.black,
|
||||
),
|
||||
onPressed: () =>
|
||||
controller.showServerInfo(server),
|
||||
),
|
||||
onTap: () => controller.setServer(
|
||||
server.homeserver.baseUrl.host),
|
||||
title: Text(
|
||||
server.homeserver.baseUrl.host,
|
||||
style: const TextStyle(
|
||||
color: Colors.black),
|
||||
),
|
||||
subtitle: Text(
|
||||
server.homeserver.description ?? '',
|
||||
style: TextStyle(
|
||||
color: Colors.grey.shade700),
|
||||
),
|
||||
if (controller.displayServerList)
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: Material(
|
||||
borderRadius:
|
||||
BorderRadius.circular(AppConfig.borderRadius),
|
||||
color: Colors.white.withAlpha(200),
|
||||
clipBehavior: Clip.hardEdge,
|
||||
child: benchmarkResults == null
|
||||
? const Center(
|
||||
child: Padding(
|
||||
padding: EdgeInsets.all(12.0),
|
||||
child: CircularProgressIndicator.adaptive(),
|
||||
))
|
||||
: Column(
|
||||
children: controller.filteredHomeservers
|
||||
.map(
|
||||
(server) => ListTile(
|
||||
trailing: IconButton(
|
||||
icon: const Icon(
|
||||
Icons.info_outlined,
|
||||
color: Colors.black,
|
||||
),
|
||||
onPressed: () =>
|
||||
controller.showServerInfo(server),
|
||||
),
|
||||
)
|
||||
.toList(),
|
||||
),
|
||||
),
|
||||
),
|
||||
Wrap(
|
||||
alignment: WrapAlignment.center,
|
||||
children: [
|
||||
TextButton(
|
||||
onPressed: () => launch(AppConfig.privacyUrl),
|
||||
child: Text(
|
||||
L10n.of(context)!.privacy,
|
||||
style: const TextStyle(
|
||||
decoration: TextDecoration.underline,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
),
|
||||
TextButton(
|
||||
onPressed: () => PlatformInfos.showDialog(context),
|
||||
child: Text(
|
||||
L10n.of(context)!.about,
|
||||
style: const TextStyle(
|
||||
decoration: TextDecoration.underline,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
width: double.infinity,
|
||||
child: Hero(
|
||||
tag: 'loginButton',
|
||||
child: ElevatedButton(
|
||||
onPressed: controller.isLoading
|
||||
? null
|
||||
: controller.checkHomeserverAction,
|
||||
child: controller.isLoading
|
||||
? const LinearProgressIndicator()
|
||||
: Text(L10n.of(context)!.connect),
|
||||
),
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: ExpansionTile(
|
||||
title: Text(L10n.of(context)!.advanced),
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: TextButton(
|
||||
onPressed: controller.isLoading
|
||||
? () {}
|
||||
: controller.restoreBackup,
|
||||
style: ElevatedButton.styleFrom(
|
||||
primary: Colors.white.withAlpha(200),
|
||||
onPrimary: Colors.black,
|
||||
shadowColor: Colors.white,
|
||||
),
|
||||
child: controller.isLoading
|
||||
? const LinearProgressIndicator()
|
||||
: Text(L10n.of(context)!.hydrate),
|
||||
onTap: () => controller.setServer(
|
||||
server.homeserver.baseUrl.host),
|
||||
title: Text(
|
||||
server.homeserver.baseUrl.host,
|
||||
style: const TextStyle(
|
||||
color: Colors.black),
|
||||
),
|
||||
subtitle: Text(
|
||||
server.homeserver.description ?? '',
|
||||
style: TextStyle(
|
||||
color: Colors.grey.shade700),
|
||||
),
|
||||
),
|
||||
)
|
||||
.toList(),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
Container(
|
||||
padding: const EdgeInsets.all(12),
|
||||
width: double.infinity,
|
||||
child: Hero(
|
||||
tag: 'loginButton',
|
||||
child: ElevatedButton(
|
||||
onPressed: controller.isLoading
|
||||
? null
|
||||
: controller.checkHomeserverAction,
|
||||
child: controller.isLoading
|
||||
? const LinearProgressIndicator()
|
||||
: Text(L10n.of(context)!.connect),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
@ -34,7 +34,7 @@ class LoginView extends StatelessWidget {
|
||||
child: ListView(
|
||||
children: <Widget>[
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: TextField(
|
||||
readOnly: controller.loading,
|
||||
autocorrect: false,
|
||||
@ -57,7 +57,7 @@ class LoginView extends StatelessWidget {
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: TextField(
|
||||
readOnly: controller.loading,
|
||||
autocorrect: false,
|
||||
@ -91,7 +91,7 @@ class LoginView extends StatelessWidget {
|
||||
Hero(
|
||||
tag: 'signinButton',
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: ElevatedButton(
|
||||
onPressed: controller.loading
|
||||
? null
|
||||
@ -106,7 +106,7 @@ class LoginView extends StatelessWidget {
|
||||
children: [
|
||||
const Expanded(child: Divider(color: Colors.white)),
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: Text(
|
||||
L10n.of(context)!.or,
|
||||
style: const TextStyle(color: Colors.white),
|
||||
@ -116,7 +116,7 @@ class LoginView extends StatelessWidget {
|
||||
],
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: ElevatedButton(
|
||||
onPressed:
|
||||
controller.loading ? () {} : controller.passwordForgotten,
|
||||
|
@ -27,7 +27,7 @@ class SignupPageView extends StatelessWidget {
|
||||
child: ListView(
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: TextFormField(
|
||||
readOnly: controller.loading,
|
||||
autocorrect: false,
|
||||
@ -60,7 +60,7 @@ class SignupPageView extends StatelessWidget {
|
||||
),
|
||||
if (controller.displaySecondPasswordField)
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: TextFormField(
|
||||
readOnly: controller.loading,
|
||||
autocorrect: false,
|
||||
@ -81,7 +81,7 @@ class SignupPageView extends StatelessWidget {
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
padding: const EdgeInsets.all(12.0),
|
||||
child: TextFormField(
|
||||
readOnly: controller.loading,
|
||||
autocorrect: false,
|
||||
@ -109,7 +109,7 @@ class SignupPageView extends StatelessWidget {
|
||||
Hero(
|
||||
tag: 'loginButton',
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
padding: const EdgeInsets.all(12),
|
||||
child: ElevatedButton(
|
||||
onPressed: controller.loading ? () {} : controller.signup,
|
||||
child: controller.loading
|
||||
|
Loading…
Reference in New Issue
Block a user