design: New design for login page
This commit is contained in:
parent
29dbf6f9f5
commit
4a008d0c2d
7 changed files with 240 additions and 260 deletions
|
|
@ -2,10 +2,11 @@ import 'dart:math';
|
|||
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'package:fluffychat/config/themes.dart';
|
||||
|
||||
class EmptyPage extends StatelessWidget {
|
||||
final bool loading;
|
||||
static const double _width = 300;
|
||||
const EmptyPage({this.loading = false, super.key});
|
||||
static const double _width = 128;
|
||||
const EmptyPage({super.key});
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final width = min(MediaQuery.of(context).size.width, EmptyPage._width) / 2;
|
||||
|
|
@ -14,31 +15,20 @@ class EmptyPage extends StatelessWidget {
|
|||
appBar: AppBar(
|
||||
automaticallyImplyLeading: false,
|
||||
elevation: 0,
|
||||
backgroundColor: Theme.of(context).scaffoldBackgroundColor,
|
||||
backgroundColor: Colors.transparent,
|
||||
),
|
||||
extendBodyBehindAppBar: true,
|
||||
body: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Center(
|
||||
child: Hero(
|
||||
tag: 'info-logo',
|
||||
child: Image.asset(
|
||||
'assets/favicon.png',
|
||||
width: width,
|
||||
height: width,
|
||||
filterQuality: FilterQuality.medium,
|
||||
),
|
||||
),
|
||||
),
|
||||
if (loading)
|
||||
Center(
|
||||
child: SizedBox(
|
||||
width: width,
|
||||
child: const LinearProgressIndicator(),
|
||||
),
|
||||
),
|
||||
],
|
||||
body: Container(
|
||||
decoration: BoxDecoration(
|
||||
gradient: FluffyThemes.backgroundGradient(context, 128),
|
||||
),
|
||||
alignment: Alignment.center,
|
||||
child: Image.asset(
|
||||
'assets/favicon.png',
|
||||
width: width,
|
||||
height: width,
|
||||
filterQuality: FilterQuality.medium,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -37,9 +37,10 @@ class LoginScaffold extends StatelessWidget {
|
|||
actions: appBar?.actions,
|
||||
backgroundColor: isMobileMode ? null : Colors.transparent,
|
||||
),
|
||||
extendBodyBehindAppBar: true,
|
||||
extendBody: true,
|
||||
body: body,
|
||||
backgroundColor: isMobileMode
|
||||
? null
|
||||
: Theme.of(context).colorScheme.background.withOpacity(0.9),
|
||||
bottomNavigationBar: isMobileMode
|
||||
? Material(
|
||||
elevation: 4,
|
||||
|
|
@ -52,8 +53,11 @@ class LoginScaffold extends StatelessWidget {
|
|||
);
|
||||
if (isMobileMode) return scaffold;
|
||||
return Container(
|
||||
decoration: BoxDecoration(
|
||||
gradient: FluffyThemes.backgroundGradient(context, 255),
|
||||
decoration: const BoxDecoration(
|
||||
image: DecorationImage(
|
||||
fit: BoxFit.cover,
|
||||
image: AssetImage('assets/login_wallpaper.png'),
|
||||
),
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
|
|
@ -63,7 +67,7 @@ class LoginScaffold extends StatelessWidget {
|
|||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16.0),
|
||||
child: Material(
|
||||
color: Theme.of(context).scaffoldBackgroundColor,
|
||||
color: Colors.transparent,
|
||||
borderRadius: BorderRadius.circular(AppConfig.borderRadius),
|
||||
clipBehavior: Clip.hardEdge,
|
||||
elevation:
|
||||
|
|
@ -72,34 +76,14 @@ class LoginScaffold extends StatelessWidget {
|
|||
child: ConstrainedBox(
|
||||
constraints: isMobileMode
|
||||
? const BoxConstraints()
|
||||
: const BoxConstraints(maxWidth: 960, maxHeight: 640),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.stretch,
|
||||
children: [
|
||||
Expanded(
|
||||
child: Image.asset(
|
||||
'assets/login_wallpaper.png',
|
||||
fit: BoxFit.cover,
|
||||
),
|
||||
),
|
||||
Container(
|
||||
width: 1,
|
||||
color: Theme.of(context).dividerTheme.color,
|
||||
),
|
||||
Expanded(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: scaffold,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
: const BoxConstraints(maxWidth: 480, maxHeight: 720),
|
||||
child: scaffold,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
const _PrivacyButtons(mainAxisAlignment: MainAxisAlignment.end),
|
||||
const _PrivacyButtons(mainAxisAlignment: MainAxisAlignment.center),
|
||||
],
|
||||
),
|
||||
);
|
||||
|
|
@ -112,6 +96,18 @@ class _PrivacyButtons extends StatelessWidget {
|
|||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final shadowTextStyle = FluffyThemes.isColumnMode(context)
|
||||
? const TextStyle(
|
||||
color: Colors.white,
|
||||
shadows: [
|
||||
Shadow(
|
||||
offset: Offset(0.0, 0.0),
|
||||
blurRadius: 3,
|
||||
color: Colors.black,
|
||||
),
|
||||
],
|
||||
)
|
||||
: null;
|
||||
return SizedBox(
|
||||
height: 64,
|
||||
child: Padding(
|
||||
|
|
@ -121,11 +117,17 @@ class _PrivacyButtons extends StatelessWidget {
|
|||
children: [
|
||||
TextButton(
|
||||
onPressed: () => PlatformInfos.showDialog(context),
|
||||
child: Text(L10n.of(context)!.about),
|
||||
child: Text(
|
||||
L10n.of(context)!.about,
|
||||
style: shadowTextStyle,
|
||||
),
|
||||
),
|
||||
TextButton(
|
||||
onPressed: () => launchUrlString(AppConfig.privacyUrl),
|
||||
child: Text(L10n.of(context)!.privacy),
|
||||
child: Text(
|
||||
L10n.of(context)!.privacy,
|
||||
style: shadowTextStyle,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue