2ndbeam/fluffychat-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

design: New design for login page

Browse source
This commit is contained in:
krille-chan 2023-12-24 13:46:29 +01:00
commit 4a008d0c2d
No known key found for this signature in database
7 changed files with 240 additions and 260 deletions
Download patch file Download diff file Expand all files Collapse all files

111
lib/pages/login/login_view.dart
View file

@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_gen/gen_l10n/l10n.dart';
import 'package:fluffychat/config/themes.dart';
import 'package:fluffychat/widgets/layouts/login_scaffold.dart';
import 'package:fluffychat/widgets/matrix.dart';
import 'login.dart';
@ -13,29 +14,48 @@ class LoginView extends StatelessWidget {
@override
Widget build(BuildContext context) {
final homeserver = Matrix.of(context)
.getLoginClient()
.homeserver
.toString()
.replaceFirst('https://', '');
final title = L10n.of(context)!.logInTo(homeserver);
final titleParts = title.split(homeserver);
final textFieldFillColor = FluffyThemes.isColumnMode(context)
? Theme.of(context).colorScheme.background
: Theme.of(context).colorScheme.surfaceVariant;
return LoginScaffold(
enforceMobileMode: Matrix.of(context).client.isLogged(),
appBar: AppBar(
leading: controller.loading ? null : const BackButton(),
leading: controller.loading ? null : const Center(child: BackButton()),
automaticallyImplyLeading: !controller.loading,
centerTitle: true,
title: Text(
L10n.of(context)!.logInTo(
Matrix.of(context)
.getLoginClient()
.homeserver
.toString()
.replaceFirst('https://', ''),
titleSpacing: !controller.loading ? 0 : null,
title: Text.rich(
TextSpan(
children: [
TextSpan(text: titleParts.first),
TextSpan(
text: homeserver,
style: const TextStyle(fontWeight: FontWeight.bold),
),
TextSpan(text: titleParts.last),
],
),
style: const TextStyle(fontSize: 18),
),
),
body: Builder(
builder: (context) {
return AutofillGroup(
child: ListView(
padding: const EdgeInsets.symmetric(horizontal: 8),
children: <Widget>[
Image.asset('assets/banner_transparent.png'),
const SizedBox(height: 16),
Padding(
padding: const EdgeInsets.all(12.0),
padding: const EdgeInsets.symmetric(horizontal: 8.0),
child: TextField(
readOnly: controller.loading,
autocorrect: false,
@ -50,12 +70,14 @@ class LoginView extends StatelessWidget {
prefixIcon: const Icon(Icons.account_box_outlined),
errorText: controller.usernameError,
errorStyle: const TextStyle(color: Colors.orange),
fillColor: textFieldFillColor,
hintText: L10n.of(context)!.emailOrUsername,
),
),
),
const SizedBox(height: 16),
Padding(
padding: const EdgeInsets.all(12.0),
padding: const EdgeInsets.symmetric(horizontal: 8.0),
child: TextField(
readOnly: controller.loading,
autocorrect: false,
@ -69,6 +91,7 @@ class LoginView extends StatelessWidget {
prefixIcon: const Icon(Icons.lock_outlined),
errorText: controller.passwordError,
errorStyle: const TextStyle(color: Colors.orange),
fillColor: textFieldFillColor,
suffixIcon: IconButton(
onPressed: controller.toggleShowPassword,
icon: Icon(
@ -82,64 +105,36 @@ class LoginView extends StatelessWidget {
),
),
),
Hero(
tag: 'signinButton',
child: Padding(
padding: const EdgeInsets.all(12.0),
child: ElevatedButton.icon(
style: ElevatedButton.styleFrom(
backgroundColor: Theme.of(context).colorScheme.primary,
foregroundColor:
Theme.of(context).colorScheme.onPrimary,
),
onPressed: controller.loading ? null : controller.login,
icon: const Icon(Icons.login_outlined),
label: controller.loading
? const LinearProgressIndicator()
: Text(L10n.of(context)!.login),
),
),
),
const SizedBox(height: 16),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16.0),
child: Row(
children: [
Expanded(
child: Divider(
thickness: 1,
color: Theme.of(context).dividerColor,
),
),
Padding(
padding: const EdgeInsets.all(12.0),
child: Text(
L10n.of(context)!.or,
style: const TextStyle(fontSize: 18),
),
),
Expanded(
child: Divider(
thickness: 1,
color: Theme.of(context).dividerColor,
),
),
],
),
),
Padding(
padding: const EdgeInsets.all(12.0),
padding: const EdgeInsets.symmetric(horizontal: 8.0),
child: ElevatedButton.icon(
style: ElevatedButton.styleFrom(
backgroundColor: Theme.of(context).colorScheme.primary,
foregroundColor: Theme.of(context).colorScheme.onPrimary,
),
onPressed: controller.loading ? null : controller.login,
icon: const Icon(Icons.login_outlined),
label: controller.loading
? const LinearProgressIndicator()
: Text(L10n.of(context)!.login),
),
),
const SizedBox(height: 16),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 8.0),
child: TextButton.icon(
onPressed: controller.loading
? () {}
: controller.passwordForgotten,
style: ElevatedButton.styleFrom(
style: TextButton.styleFrom(
foregroundColor: Theme.of(context).colorScheme.error,
backgroundColor: Theme.of(context).colorScheme.onError,
),
icon: const Icon(Icons.safety_check_outlined),
label: Text(L10n.of(context)!.passwordForgotten),
),
),
const SizedBox(height: 16),
],
),
);