chore: Follow up sign up design

This commit is contained in:
Christian Kußowski 2026-02-24 20:23:35 +01:00
commit 2408568f36
No known key found for this signature in database
GPG key ID: E067ECD60F1A0652
5 changed files with 162 additions and 159 deletions

View file

@ -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

View file

@ -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);

View file

@ -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'],

View file

@ -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';

View file

@ -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: