chore: Follow up sign up design
This commit is contained in:
parent
0401456481
commit
2408568f36
5 changed files with 162 additions and 159 deletions
|
|
@ -37,164 +37,165 @@ class SignInPage extends StatelessWidget {
|
||||||
? L10n.of(context).createNewAccount
|
? L10n.of(context).createNewAccount
|
||||||
: L10n.of(context).login,
|
: L10n.of(context).login,
|
||||||
),
|
),
|
||||||
bottom: PreferredSize(
|
),
|
||||||
preferredSize: const Size.fromHeight(56 + 60),
|
body: Padding(
|
||||||
child: Padding(
|
padding: const EdgeInsets.symmetric(horizontal: 16.0),
|
||||||
padding: const EdgeInsets.all(16.0),
|
child: Column(
|
||||||
child: Column(
|
spacing: 16,
|
||||||
mainAxisSize: .min,
|
children: [
|
||||||
crossAxisAlignment: .center,
|
SelectableText(
|
||||||
spacing: 12,
|
signUp
|
||||||
children: [
|
? L10n.of(context).signUpGreeting
|
||||||
SelectableText(
|
: L10n.of(context).signInGreeting,
|
||||||
signUp
|
textAlign: .center,
|
||||||
? L10n.of(context).signUpGreeting
|
),
|
||||||
: L10n.of(context).signInGreeting,
|
TextField(
|
||||||
textAlign: .center,
|
readOnly:
|
||||||
|
state.publicHomeservers.connectionState ==
|
||||||
|
ConnectionState.waiting,
|
||||||
|
controller: viewModel.filterTextController,
|
||||||
|
autocorrect: false,
|
||||||
|
keyboardType: TextInputType.url,
|
||||||
|
decoration: InputDecoration(
|
||||||
|
filled: true,
|
||||||
|
fillColor: theme.colorScheme.secondaryContainer,
|
||||||
|
border: OutlineInputBorder(
|
||||||
|
borderSide: BorderSide.none,
|
||||||
|
borderRadius: BorderRadius.circular(99),
|
||||||
),
|
),
|
||||||
TextField(
|
errorText: state.publicHomeservers.error?.toLocalizedString(
|
||||||
readOnly:
|
context,
|
||||||
state.publicHomeservers.connectionState ==
|
),
|
||||||
ConnectionState.waiting,
|
prefixIcon: const Icon(Icons.search_outlined),
|
||||||
controller: viewModel.filterTextController,
|
hintText: L10n.of(context).searchOrEnterHomeserverAddress,
|
||||||
autocorrect: false,
|
),
|
||||||
keyboardType: TextInputType.url,
|
),
|
||||||
decoration: InputDecoration(
|
if (state.publicHomeservers.connectionState ==
|
||||||
filled: true,
|
ConnectionState.done)
|
||||||
fillColor: theme.colorScheme.secondaryContainer,
|
Expanded(
|
||||||
border: OutlineInputBorder(
|
child: Material(
|
||||||
borderSide: BorderSide.none,
|
borderRadius: BorderRadius.circular(
|
||||||
borderRadius: BorderRadius.circular(99),
|
AppConfig.borderRadius,
|
||||||
|
),
|
||||||
|
clipBehavior: Clip.hardEdge,
|
||||||
|
color: theme.colorScheme.surfaceContainerLow,
|
||||||
|
child: RadioGroup<PublicHomeserverData>(
|
||||||
|
groupValue: state.selectedHomeserver,
|
||||||
|
onChanged: viewModel.selectHomeserver,
|
||||||
|
child: ListView.builder(
|
||||||
|
itemCount: publicHomeservers.length,
|
||||||
|
itemBuilder: (context, i) {
|
||||||
|
final server = publicHomeservers[i];
|
||||||
|
final website = server.website;
|
||||||
|
return RadioListTile.adaptive(
|
||||||
|
value: server,
|
||||||
|
radioScaleFactor:
|
||||||
|
FluffyThemes.isColumnMode(context) ||
|
||||||
|
{
|
||||||
|
TargetPlatform.iOS,
|
||||||
|
TargetPlatform.macOS,
|
||||||
|
}.contains(theme.platform)
|
||||||
|
? 2
|
||||||
|
: 1,
|
||||||
|
title: Row(
|
||||||
|
children: [
|
||||||
|
Expanded(
|
||||||
|
child: Text(server.name ?? 'Unknown'),
|
||||||
|
),
|
||||||
|
if (website != null)
|
||||||
|
SizedBox.square(
|
||||||
|
dimension: 32,
|
||||||
|
child: IconButton(
|
||||||
|
icon: const Icon(
|
||||||
|
Icons.open_in_new_outlined,
|
||||||
|
size: 16,
|
||||||
|
),
|
||||||
|
onPressed: () =>
|
||||||
|
launchUrlString(website),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
subtitle: Column(
|
||||||
|
spacing: 4.0,
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
mainAxisSize: MainAxisSize.min,
|
||||||
|
children: [
|
||||||
|
if (server.features?.isNotEmpty == true)
|
||||||
|
Wrap(
|
||||||
|
spacing: 4.0,
|
||||||
|
runSpacing: 4.0,
|
||||||
|
children: [
|
||||||
|
...?server.languages?.map(
|
||||||
|
(language) => Material(
|
||||||
|
borderRadius: BorderRadius.circular(
|
||||||
|
AppConfig.borderRadius,
|
||||||
|
),
|
||||||
|
color: theme
|
||||||
|
.colorScheme
|
||||||
|
.tertiaryContainer,
|
||||||
|
child: Padding(
|
||||||
|
padding:
|
||||||
|
const EdgeInsets.symmetric(
|
||||||
|
horizontal: 6.0,
|
||||||
|
vertical: 3.0,
|
||||||
|
),
|
||||||
|
child: Text(
|
||||||
|
language,
|
||||||
|
style: TextStyle(
|
||||||
|
fontSize: 10,
|
||||||
|
color: theme
|
||||||
|
.colorScheme
|
||||||
|
.onTertiaryContainer,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
...server.features!.map(
|
||||||
|
(feature) => Material(
|
||||||
|
borderRadius: BorderRadius.circular(
|
||||||
|
AppConfig.borderRadius,
|
||||||
|
),
|
||||||
|
color: theme
|
||||||
|
.colorScheme
|
||||||
|
.secondaryContainer,
|
||||||
|
child: Padding(
|
||||||
|
padding:
|
||||||
|
const EdgeInsets.symmetric(
|
||||||
|
horizontal: 6.0,
|
||||||
|
vertical: 3.0,
|
||||||
|
),
|
||||||
|
child: Text(
|
||||||
|
feature,
|
||||||
|
style: TextStyle(
|
||||||
|
fontSize: 10,
|
||||||
|
color: theme
|
||||||
|
.colorScheme
|
||||||
|
.onSecondaryContainer,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
Text(
|
||||||
|
server.description ?? 'A matrix homeserver',
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
);
|
||||||
|
},
|
||||||
),
|
),
|
||||||
errorText: state.publicHomeservers.error
|
|
||||||
?.toLocalizedString(context),
|
|
||||||
prefixIcon: const Icon(Icons.search_outlined),
|
|
||||||
hintText: L10n.of(
|
|
||||||
context,
|
|
||||||
).searchOrEnterHomeserverAddress,
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
)
|
||||||
),
|
else
|
||||||
),
|
Center(child: CircularProgressIndicator.adaptive()),
|
||||||
|
],
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
body: state.publicHomeservers.connectionState == ConnectionState.done
|
|
||||||
? Padding(
|
|
||||||
padding: const EdgeInsets.symmetric(horizontal: 16.0),
|
|
||||||
child: Material(
|
|
||||||
borderRadius: BorderRadius.circular(AppConfig.borderRadius),
|
|
||||||
clipBehavior: Clip.hardEdge,
|
|
||||||
color: theme.colorScheme.surfaceContainerLow,
|
|
||||||
child: RadioGroup<PublicHomeserverData>(
|
|
||||||
groupValue: state.selectedHomeserver,
|
|
||||||
onChanged: viewModel.selectHomeserver,
|
|
||||||
child: ListView.builder(
|
|
||||||
itemCount: publicHomeservers.length,
|
|
||||||
itemBuilder: (context, i) {
|
|
||||||
final server = publicHomeservers[i];
|
|
||||||
final homepage = server.homepage;
|
|
||||||
return RadioListTile.adaptive(
|
|
||||||
value: server,
|
|
||||||
radioScaleFactor:
|
|
||||||
FluffyThemes.isColumnMode(context) ||
|
|
||||||
{
|
|
||||||
TargetPlatform.iOS,
|
|
||||||
TargetPlatform.macOS,
|
|
||||||
}.contains(theme.platform)
|
|
||||||
? 2
|
|
||||||
: 1,
|
|
||||||
title: Row(
|
|
||||||
children: [
|
|
||||||
Expanded(child: Text(server.name ?? 'Unknown')),
|
|
||||||
if (homepage != null)
|
|
||||||
SizedBox.square(
|
|
||||||
dimension: 32,
|
|
||||||
child: IconButton(
|
|
||||||
icon: const Icon(
|
|
||||||
Icons.open_in_new_outlined,
|
|
||||||
size: 16,
|
|
||||||
),
|
|
||||||
onPressed: () =>
|
|
||||||
launchUrlString(homepage),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
subtitle: Column(
|
|
||||||
spacing: 4.0,
|
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
|
||||||
mainAxisSize: MainAxisSize.min,
|
|
||||||
children: [
|
|
||||||
if (server.features?.isNotEmpty == true)
|
|
||||||
Wrap(
|
|
||||||
spacing: 4.0,
|
|
||||||
runSpacing: 4.0,
|
|
||||||
children: [
|
|
||||||
...?server.languages?.map(
|
|
||||||
(language) => Material(
|
|
||||||
borderRadius: BorderRadius.circular(
|
|
||||||
AppConfig.borderRadius,
|
|
||||||
),
|
|
||||||
color: theme
|
|
||||||
.colorScheme
|
|
||||||
.tertiaryContainer,
|
|
||||||
child: Padding(
|
|
||||||
padding: const EdgeInsets.symmetric(
|
|
||||||
horizontal: 6.0,
|
|
||||||
vertical: 3.0,
|
|
||||||
),
|
|
||||||
child: Text(
|
|
||||||
language,
|
|
||||||
style: TextStyle(
|
|
||||||
fontSize: 10,
|
|
||||||
color: theme
|
|
||||||
.colorScheme
|
|
||||||
.onTertiaryContainer,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
...server.features!.map(
|
|
||||||
(feature) => Material(
|
|
||||||
borderRadius: BorderRadius.circular(
|
|
||||||
AppConfig.borderRadius,
|
|
||||||
),
|
|
||||||
color: theme
|
|
||||||
.colorScheme
|
|
||||||
.secondaryContainer,
|
|
||||||
child: Padding(
|
|
||||||
padding: const EdgeInsets.symmetric(
|
|
||||||
horizontal: 6.0,
|
|
||||||
vertical: 3.0,
|
|
||||||
),
|
|
||||||
child: Text(
|
|
||||||
feature,
|
|
||||||
style: TextStyle(
|
|
||||||
fontSize: 10,
|
|
||||||
color: theme
|
|
||||||
.colorScheme
|
|
||||||
.onSecondaryContainer,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
Text(
|
|
||||||
server.description ?? 'A matrix homeserver',
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
);
|
|
||||||
},
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
)
|
|
||||||
: Center(child: CircularProgressIndicator.adaptive()),
|
|
||||||
bottomNavigationBar: AnimatedSize(
|
bottomNavigationBar: AnimatedSize(
|
||||||
duration: FluffyThemes.animationDuration,
|
duration: FluffyThemes.animationDuration,
|
||||||
curve: FluffyThemes.animationCurve,
|
curve: FluffyThemes.animationCurve,
|
||||||
|
|
@ -203,12 +204,14 @@ class SignInPage extends StatelessWidget {
|
||||||
!publicHomeservers.contains(selectedHomserver)
|
!publicHomeservers.contains(selectedHomserver)
|
||||||
? const SizedBox.shrink()
|
? const SizedBox.shrink()
|
||||||
: Material(
|
: Material(
|
||||||
elevation: 8,
|
|
||||||
shadowColor: theme.appBarTheme.shadowColor,
|
|
||||||
child: Padding(
|
child: Padding(
|
||||||
padding: const EdgeInsets.all(16.0),
|
padding: const EdgeInsets.all(16.0),
|
||||||
child: SafeArea(
|
child: SafeArea(
|
||||||
child: ElevatedButton(
|
child: ElevatedButton(
|
||||||
|
style: ElevatedButton.styleFrom(
|
||||||
|
backgroundColor: theme.colorScheme.primary,
|
||||||
|
foregroundColor: theme.colorScheme.onPrimary,
|
||||||
|
),
|
||||||
onPressed:
|
onPressed:
|
||||||
state.loginLoading.connectionState ==
|
state.loginLoading.connectionState ==
|
||||||
ConnectionState.waiting
|
ConnectionState.waiting
|
||||||
|
|
|
||||||
|
|
@ -7,7 +7,7 @@ int sortHomeservers(PublicHomeserverData a, PublicHomeserverData b) {
|
||||||
int _calcHomeserverScore(PublicHomeserverData homeserver) {
|
int _calcHomeserverScore(PublicHomeserverData homeserver) {
|
||||||
var score = 0;
|
var score = 0;
|
||||||
if (homeserver.description?.isNotEmpty == true) score++;
|
if (homeserver.description?.isNotEmpty == true) score++;
|
||||||
if (homeserver.homepage?.isNotEmpty == true) score++;
|
if (homeserver.website?.isNotEmpty == true) score++;
|
||||||
score += (homeserver.languages?.length ?? 0);
|
score += (homeserver.languages?.length ?? 0);
|
||||||
score += (homeserver.features?.length ?? 0);
|
score += (homeserver.features?.length ?? 0);
|
||||||
score += (homeserver.onlineStatus ?? 0);
|
score += (homeserver.onlineStatus ?? 0);
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
class PublicHomeserverData {
|
class PublicHomeserverData {
|
||||||
final String? name;
|
final String? name;
|
||||||
final String? clientDomain;
|
final String? clientDomain;
|
||||||
final String? homepage;
|
final String? website;
|
||||||
final String? isp;
|
final String? isp;
|
||||||
final String? staffJur;
|
final String? staffJur;
|
||||||
final String? rules;
|
final String? rules;
|
||||||
|
|
@ -26,7 +26,7 @@ class PublicHomeserverData {
|
||||||
PublicHomeserverData({
|
PublicHomeserverData({
|
||||||
this.name,
|
this.name,
|
||||||
this.clientDomain,
|
this.clientDomain,
|
||||||
this.homepage,
|
this.website,
|
||||||
this.isp,
|
this.isp,
|
||||||
this.staffJur,
|
this.staffJur,
|
||||||
this.rules,
|
this.rules,
|
||||||
|
|
@ -53,7 +53,7 @@ class PublicHomeserverData {
|
||||||
return PublicHomeserverData(
|
return PublicHomeserverData(
|
||||||
name: json['name'],
|
name: json['name'],
|
||||||
clientDomain: json['client_domain'],
|
clientDomain: json['client_domain'],
|
||||||
homepage: json['homepage'],
|
website: json['website'],
|
||||||
isp: json['isp'],
|
isp: json['isp'],
|
||||||
staffJur: json['staff_jur'],
|
staffJur: json['staff_jur'],
|
||||||
rules: json['rules'],
|
rules: json['rules'],
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,10 @@
|
||||||
import 'package:fluffychat/config/setting_keys.dart';
|
|
||||||
import 'package:flutter/foundation.dart';
|
import 'package:flutter/foundation.dart';
|
||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
import 'package:go_router/go_router.dart';
|
import 'package:go_router/go_router.dart';
|
||||||
import 'package:url_launcher/url_launcher_string.dart';
|
import 'package:url_launcher/url_launcher_string.dart';
|
||||||
|
|
||||||
|
import 'package:fluffychat/config/setting_keys.dart';
|
||||||
import 'package:fluffychat/l10n/l10n.dart';
|
import 'package:fluffychat/l10n/l10n.dart';
|
||||||
import 'package:fluffychat/pages/sign_in/view_model/model/public_homeserver_data.dart';
|
import 'package:fluffychat/pages/sign_in/view_model/model/public_homeserver_data.dart';
|
||||||
import 'package:fluffychat/utils/localized_exception_extension.dart';
|
import 'package:fluffychat/utils/localized_exception_extension.dart';
|
||||||
|
|
|
||||||
24
pubspec.lock
24
pubspec.lock
|
|
@ -165,10 +165,10 @@ packages:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
name: characters
|
name: characters
|
||||||
sha256: f71061c654a3380576a52b451dd5532377954cf9dbd272a78fc8479606670803
|
sha256: faf38497bda5ead2a8c7615f4f7939df04333478bf32e4173fcb06d428b5716b
|
||||||
url: "https://pub.dev"
|
url: "https://pub.dev"
|
||||||
source: hosted
|
source: hosted
|
||||||
version: "1.4.0"
|
version: "1.4.1"
|
||||||
charcode:
|
charcode:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
|
|
@ -1112,18 +1112,18 @@ packages:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
name: matcher
|
name: matcher
|
||||||
sha256: dc58c723c3c24bf8d3e2d3ad3f2f9d7bd9cf43ec6feaa64181775e60190153f2
|
sha256: "12956d0ad8390bbcc63ca2e1469c0619946ccb52809807067a7020d57e647aa6"
|
||||||
url: "https://pub.dev"
|
url: "https://pub.dev"
|
||||||
source: hosted
|
source: hosted
|
||||||
version: "0.12.17"
|
version: "0.12.18"
|
||||||
material_color_utilities:
|
material_color_utilities:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
name: material_color_utilities
|
name: material_color_utilities
|
||||||
sha256: f7142bb1154231d7ea5f96bc7bde4bda2a0945d2806bb11670e30b850d56bdec
|
sha256: "9c337007e82b1889149c82ed242ed1cb24a66044e30979c44912381e9be4c48b"
|
||||||
url: "https://pub.dev"
|
url: "https://pub.dev"
|
||||||
source: hosted
|
source: hosted
|
||||||
version: "0.11.1"
|
version: "0.13.0"
|
||||||
matrix:
|
matrix:
|
||||||
dependency: "direct main"
|
dependency: "direct main"
|
||||||
description:
|
description:
|
||||||
|
|
@ -1877,26 +1877,26 @@ packages:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
name: test
|
name: test
|
||||||
sha256: "75906bf273541b676716d1ca7627a17e4c4070a3a16272b7a3dc7da3b9f3f6b7"
|
sha256: "54c516bbb7cee2754d327ad4fca637f78abfc3cbcc5ace83b3eda117e42cd71a"
|
||||||
url: "https://pub.dev"
|
url: "https://pub.dev"
|
||||||
source: hosted
|
source: hosted
|
||||||
version: "1.26.3"
|
version: "1.29.0"
|
||||||
test_api:
|
test_api:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
name: test_api
|
name: test_api
|
||||||
sha256: ab2726c1a94d3176a45960b6234466ec367179b87dd74f1611adb1f3b5fb9d55
|
sha256: "93167629bfc610f71560ab9312acdda4959de4df6fac7492c89ff0d3886f6636"
|
||||||
url: "https://pub.dev"
|
url: "https://pub.dev"
|
||||||
source: hosted
|
source: hosted
|
||||||
version: "0.7.7"
|
version: "0.7.9"
|
||||||
test_core:
|
test_core:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
name: test_core
|
name: test_core
|
||||||
sha256: "0cc24b5ff94b38d2ae73e1eb43cc302b77964fbf67abad1e296025b78deb53d0"
|
sha256: "394f07d21f0f2255ec9e3989f21e54d3c7dc0e6e9dbce160e5a9c1a6be0e2943"
|
||||||
url: "https://pub.dev"
|
url: "https://pub.dev"
|
||||||
source: hosted
|
source: hosted
|
||||||
version: "0.6.12"
|
version: "0.6.15"
|
||||||
timezone:
|
timezone:
|
||||||
dependency: transitive
|
dependency: transitive
|
||||||
description:
|
description:
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue