mirror of
https://github.com/AppFlowy-IO/AppFlowy.git
synced 2024-08-30 18:12:39 +00:00
config theme color and login screen color
This commit is contained in:
appflowy
parent
317cbb37b6
commit
835ace5da0
|
Before Width: | Height: | Size: 313 B After Width: | Height: | Size: 313 B |
|
Before Width: | Height: | Size: 310 B After Width: | Height: | Size: 310 B |
|
Before Width: | Height: | Size: 316 B After Width: | Height: | Size: 316 B |
|
Before Width: | Height: | Size: 322 B After Width: | Height: | Size: 322 B |
11
app_flowy/assets/images/small_logo.svg
Normal file
11
app_flowy/assets/images/small_logo.svg
Normal file
@ -0,0 +1,11 @@
|
||||
<svg width="41" height="40" viewBox="0 0 41 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M39.9564 24.0195C38.8098 30.1683 33.7828 35.5321 28.0061 38.5411C27.3005 38.9336 26.4627 39.1516 25.6689 39.1952H37.9279C39.1185 39.1952 39.9564 38.323 39.9564 37.2328V24.0195Z" fill="#F7931E"/>
|
||||
<path d="M15.4381 12.1576C15.2617 12.2884 15.0853 12.4192 14.9089 12.55C11.9103 14.6432 2.82634 21.3589 0.753788 18.4371C-1.27467 15.6026 0.886079 7.57868 6.08952 3.69755C6.17771 3.61033 6.31 3.56672 6.3982 3.4795C12.0867 -0.48885 16.32 0.078058 18.3926 2.95621C20.3328 5.65992 18.1721 9.93353 15.4381 12.1576Z" fill="#8427E0"/>
|
||||
<path d="M33.8715 36.098C33.7833 36.1852 33.6951 36.2288 33.5628 36.316C27.8743 40.2844 23.641 39.7175 21.5684 36.8393C19.6282 34.1356 21.7889 29.862 24.5229 27.638C24.6993 27.5072 24.8757 27.3763 25.0521 27.2455C28.0507 25.1959 37.1347 18.4366 39.1631 21.3584C41.2357 24.1929 39.119 32.2169 33.8715 36.098Z" fill="#FFBD00"/>
|
||||
<path d="M17.9954 38.8459C15.085 40.8955 6.70658 38.6715 2.87014 33.264C2.78195 33.1768 2.69376 33.046 2.64966 32.9588C-1.09858 27.5078 -0.481224 23.4086 2.38508 21.4462C5.20728 19.4838 9.61698 21.7515 11.8218 24.586C11.91 24.7168 11.9982 24.804 12.0864 24.9349C14.159 27.8566 20.9499 36.8399 17.9954 38.8459Z" fill="#E3006D"/>
|
||||
<path d="M15.4385 12.1576C11.3816 13.9455 2.73857 17.6086 1.45976 14.6432C0.357338 12.1576 2.3858 7.09899 6.08994 3.69755C6.17814 3.61033 6.31043 3.56672 6.39862 3.4795C12.0871 -0.48885 16.3204 0.078058 18.393 2.95621C20.3333 5.65992 18.1725 9.93353 15.4385 12.1576Z" fill="#9327FF"/>
|
||||
<path d="M37.6624 18.3955C34.8402 20.3579 30.4305 18.0903 28.2257 15.2557C28.1375 15.1249 28.0493 15.0377 27.9611 14.9069C25.8444 11.9415 19.0535 2.95819 21.9639 0.952211C24.8743 -1.09738 33.2968 1.12664 37.1333 6.53407C37.2215 6.6649 37.3096 6.75211 37.3978 6.88294C41.102 12.334 40.5287 16.3895 37.6624 18.3955Z" fill="#00B5FF"/>
|
||||
<path d="M37.6628 18.3934C34.8406 20.3557 30.4309 18.0881 28.2261 15.2536C26.4181 11.1108 22.9344 2.95603 25.8448 1.73499C28.4906 0.601179 33.9587 2.86881 37.4423 6.88077C41.1024 12.3318 40.5291 16.3874 37.6628 18.3934Z" fill="#00C8FF"/>
|
||||
<path d="M33.8715 36.0986C33.7833 36.1858 33.6951 36.2294 33.5628 36.3166C27.8743 40.285 23.641 39.7181 21.5684 36.8399C19.6282 34.1362 21.7889 29.8626 24.5229 27.6386C28.5799 25.8506 37.2229 22.1875 38.5017 25.1529C39.6482 27.6386 37.6197 32.6971 33.8715 36.0986Z" fill="#FFCE00"/>
|
||||
<path d="M14.2031 38.061C11.5572 39.1948 6.08922 36.9708 2.64966 32.9588C-1.09858 27.5078 -0.481224 23.4086 2.38508 21.4462C5.20728 19.4838 9.61698 21.7515 11.8218 24.586C13.6298 28.6852 17.1135 36.8399 14.2031 38.061Z" fill="#FB006D"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.6 KiB |
@ -2,6 +2,7 @@ import 'package:app_flowy/startup/startup.dart';
|
||||
import 'package:app_flowy/user/application/sign_in/sign_in_bloc.dart';
|
||||
import 'package:app_flowy/user/domain/i_auth.dart';
|
||||
import 'package:app_flowy/user/presentation/sign_in/widgets/background.dart';
|
||||
import 'package:flowy_infra/theme.dart';
|
||||
import 'package:flowy_infra_ui/widget/rounded_button.dart';
|
||||
import 'package:flowy_infra_ui/widget/rounded_input_field.dart';
|
||||
import 'package:flowy_infra_ui/widget/spacing.dart';
|
||||
@ -10,6 +11,7 @@ import 'package:flowy_sdk/protobuf/flowy-user/user_profile.pb.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||
import 'package:dartz/dartz.dart';
|
||||
import 'package:flowy_infra/image.dart';
|
||||
|
||||
class SignInScreen extends StatelessWidget {
|
||||
final IAuthRouter router;
|
||||
@ -71,6 +73,7 @@ class SignInForm extends StatelessWidget {
|
||||
const EmailTextField(),
|
||||
const PasswordTextField(),
|
||||
ForgetPasswordButton(router: router),
|
||||
const VSpace(30),
|
||||
const LoginButton(),
|
||||
const VSpace(10),
|
||||
SignUpPrompt(router: router),
|
||||
@ -94,18 +97,19 @@ class SignUpPrompt extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = context.watch<AppTheme>();
|
||||
return Row(
|
||||
children: [
|
||||
const Text("Dont't have an account",
|
||||
style: TextStyle(color: Colors.blueGrey, fontSize: 12)),
|
||||
Text("Dont't have an account",
|
||||
style: TextStyle(color: theme.shader3, fontSize: 12)),
|
||||
TextButton(
|
||||
style: TextButton.styleFrom(
|
||||
textStyle: const TextStyle(fontSize: 12),
|
||||
),
|
||||
onPressed: () => router.showSignUpScreen(context),
|
||||
child: const Text(
|
||||
child: Text(
|
||||
'Sign Up',
|
||||
style: TextStyle(color: Colors.lightBlue),
|
||||
style: TextStyle(color: theme.main1),
|
||||
),
|
||||
),
|
||||
],
|
||||
@ -121,11 +125,12 @@ class LoginButton extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = context.watch<AppTheme>();
|
||||
return RoundedTextButton(
|
||||
title: 'Login',
|
||||
height: 45,
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
color: Colors.lightBlue,
|
||||
color: theme.main1,
|
||||
press: () {
|
||||
context
|
||||
.read<SignInBloc>()
|
||||
@ -145,14 +150,15 @@ class ForgetPasswordButton extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = context.watch<AppTheme>();
|
||||
return TextButton(
|
||||
style: TextButton.styleFrom(
|
||||
textStyle: const TextStyle(fontSize: 12),
|
||||
),
|
||||
onPressed: () => router.showForgetPasswordScreen(context),
|
||||
child: const Text(
|
||||
child: Text(
|
||||
'Forgot Password?',
|
||||
style: TextStyle(color: Colors.lightBlue),
|
||||
style: TextStyle(color: theme.main1),
|
||||
),
|
||||
);
|
||||
}
|
||||
@ -165,15 +171,18 @@ class PasswordTextField extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = context.watch<AppTheme>();
|
||||
return BlocBuilder<SignInBloc, SignInState>(
|
||||
buildWhen: (previous, current) =>
|
||||
previous.passwordError != current.passwordError,
|
||||
builder: (context, state) {
|
||||
return RoundedInputField(
|
||||
obscureText: true,
|
||||
obscureIcon: svgWidgetWithName("home/Hide.svg"),
|
||||
obscureHideIcon: svgWidgetWithName("home/Show.svg"),
|
||||
hintText: 'password',
|
||||
normalBorderColor: Colors.green,
|
||||
highlightBorderColor: Colors.red,
|
||||
normalBorderColor: theme.shader4,
|
||||
highlightBorderColor: theme.red,
|
||||
errorText: context
|
||||
.read<SignInBloc>()
|
||||
.state
|
||||
@ -195,14 +204,15 @@ class EmailTextField extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = context.watch<AppTheme>();
|
||||
return BlocBuilder<SignInBloc, SignInState>(
|
||||
buildWhen: (previous, current) =>
|
||||
previous.emailError != current.emailError,
|
||||
builder: (context, state) {
|
||||
return RoundedInputField(
|
||||
hintText: 'email',
|
||||
normalBorderColor: Colors.green,
|
||||
highlightBorderColor: Colors.red,
|
||||
normalBorderColor: theme.shader4,
|
||||
highlightBorderColor: theme.red,
|
||||
errorText: context
|
||||
.read<SignInBloc>()
|
||||
.state
|
||||
|
||||
@ -1,5 +1,8 @@
|
||||
import 'package:flowy_infra/image.dart';
|
||||
import 'package:flowy_infra/theme.dart';
|
||||
import 'package:flowy_infra_ui/widget/spacing.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
class SignInFormContainer extends StatelessWidget {
|
||||
final List<Widget> children;
|
||||
@ -32,22 +35,19 @@ class SignInTitle extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = context.watch<AppTheme>();
|
||||
return SizedBox(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Image(
|
||||
fit: BoxFit.cover,
|
||||
width: logoSize.width,
|
||||
height: logoSize.height,
|
||||
image: const AssetImage('assets/images/app_flowy_logo.jpg')),
|
||||
svgWidgetWithName("small_logo.svg"),
|
||||
const VSpace(30),
|
||||
Text(
|
||||
title,
|
||||
style: const TextStyle(
|
||||
color: Colors.black,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontSize: 20,
|
||||
style: TextStyle(
|
||||
color: theme.shader1,
|
||||
fontWeight: FontWeight.w600,
|
||||
fontSize: 24,
|
||||
),
|
||||
)
|
||||
],
|
||||
|
||||
@ -1,7 +1,6 @@
|
||||
import 'package:flowy_sdk/protobuf/flowy-workspace/view_create.pb.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'package:flutter_svg/flutter_svg.dart';
|
||||
import 'package:flowy_infra/image.dart';
|
||||
|
||||
AssetImage assetImageForViewType(ViewType type) {
|
||||
final imageName = imageNameForViewType(type);
|
||||
@ -10,9 +9,7 @@ AssetImage assetImageForViewType(ViewType type) {
|
||||
|
||||
Widget svgImageForViewType(ViewType type) {
|
||||
final imageName = imageNameForViewType(type);
|
||||
final Widget svg = SvgPicture.asset(
|
||||
'assets/images/$imageName',
|
||||
);
|
||||
final Widget svg = svgWidgetWithName(imageName);
|
||||
|
||||
return svg;
|
||||
}
|
||||
|
||||
10
app_flowy/packages/flowy_infra/lib/image.dart
Normal file
10
app_flowy/packages/flowy_infra/lib/image.dart
Normal file
@ -0,0 +1,10 @@
|
||||
import 'package:flutter/widgets.dart';
|
||||
import 'package:flutter_svg/flutter_svg.dart';
|
||||
|
||||
Widget svgWidgetWithName(String name) {
|
||||
final Widget svg = SvgPicture.asset(
|
||||
'assets/images/$name',
|
||||
);
|
||||
|
||||
return svg;
|
||||
}
|
||||
@ -11,9 +11,7 @@ class AppTheme {
|
||||
static ThemeType defaultTheme = ThemeType.light;
|
||||
|
||||
bool isDark;
|
||||
late Color bg1; //
|
||||
late Color surface; //
|
||||
late Color bg2;
|
||||
late Color accent1;
|
||||
late Color accent1Dark;
|
||||
late Color accent1Darker;
|
||||
@ -24,10 +22,41 @@ class AppTheme {
|
||||
late Color greyWeak;
|
||||
late Color error;
|
||||
late Color focus;
|
||||
|
||||
late Color txt;
|
||||
late Color accentTxt;
|
||||
|
||||
late Color hover;
|
||||
late Color selector;
|
||||
late Color red;
|
||||
late Color yellow;
|
||||
late Color green;
|
||||
|
||||
late Color shader1;
|
||||
late Color shader2;
|
||||
late Color shader3;
|
||||
late Color shader4;
|
||||
late Color shader5;
|
||||
late Color shader6;
|
||||
late Color shader7;
|
||||
|
||||
late Color bg1;
|
||||
late Color bg2;
|
||||
late Color bg3;
|
||||
late Color bg4;
|
||||
|
||||
late Color tint1;
|
||||
late Color tint2;
|
||||
late Color tint3;
|
||||
late Color tint4;
|
||||
late Color tint5;
|
||||
late Color tint6;
|
||||
late Color tint7;
|
||||
late Color tint8;
|
||||
late Color tint9;
|
||||
|
||||
late Color main1;
|
||||
late Color main2;
|
||||
|
||||
/// Default constructor
|
||||
AppTheme({this.isDark = true}) {
|
||||
txt = isDark ? Colors.white : Colors.black;
|
||||
@ -39,8 +68,6 @@ class AppTheme {
|
||||
switch (t) {
|
||||
case ThemeType.light:
|
||||
return AppTheme(isDark: false)
|
||||
..bg1 = const Color.fromARGB(255, 247, 248, 252)
|
||||
..bg2 = const Color(0xffc1dcbc)
|
||||
..surface = Colors.white
|
||||
..accent1 = const Color(0xff00a086)
|
||||
..accent1Dark = const Color(0xff00856f)
|
||||
@ -51,7 +78,34 @@ class AppTheme {
|
||||
..grey = const Color(0xff515d5a)
|
||||
..greyStrong = const Color(0xff151918)
|
||||
..error = Colors.red.shade900
|
||||
..focus = const Color(0xFF0ee2b1);
|
||||
..focus = const Color(0xFFe0f8ff)
|
||||
..hover = const Color(0xFFe0f8ff) //
|
||||
..selector = const Color(0xfff2fcff)
|
||||
..red = const Color(0xfffb006d)
|
||||
..yellow = const Color(0xffffd667)
|
||||
..green = const Color(0xff66cf80)
|
||||
..shader1 = const Color(0xff333333)
|
||||
..shader2 = const Color(0xff4f4f4f)
|
||||
..shader3 = const Color(0xff828282)
|
||||
..shader4 = const Color(0xffbdbdbd)
|
||||
..shader5 = const Color(0xffe0e0e0)
|
||||
..shader6 = const Color(0xfff2f2f2)
|
||||
..shader7 = const Color(0xffffffff)
|
||||
..bg1 = const Color(0xfff7f8fc)
|
||||
..bg2 = const Color(0xffedeef2)
|
||||
..bg3 = const Color(0xffe2e4eb)
|
||||
..bg4 = const Color(0xff2c144b)
|
||||
..tint1 = const Color(0xffe8e0ff)
|
||||
..tint2 = const Color(0xffffe7fd)
|
||||
..tint3 = const Color(0xffffe7ee)
|
||||
..tint4 = const Color(0xffffefe3)
|
||||
..tint5 = const Color(0xfffff2cd)
|
||||
..tint6 = const Color(0xfff5ffdc)
|
||||
..tint7 = const Color(0xffddffd6)
|
||||
..tint8 = const Color(0xffdefff1)
|
||||
..tint9 = const Color(0xffdefff1)
|
||||
..main1 = const Color(0xff00bcf0)
|
||||
..main2 = const Color(0xff00b7ea);
|
||||
|
||||
case ThemeType.dark:
|
||||
return AppTheme(isDark: true)
|
||||
@ -67,7 +121,34 @@ class AppTheme {
|
||||
..grey = const Color(0xffced4d3)
|
||||
..greyStrong = const Color(0xffffffff)
|
||||
..error = const Color(0xffe55642)
|
||||
..focus = const Color(0xff0ee2b1);
|
||||
..focus = const Color(0xff0ee2b1)
|
||||
..hover = const Color(0xFFe0f8ff) //
|
||||
..selector = const Color(0xfff2fcff)
|
||||
..red = const Color(0xfffb006d)
|
||||
..yellow = const Color(0xffffd667)
|
||||
..green = const Color(0xff66cf80)
|
||||
..shader1 = const Color(0xff333333)
|
||||
..shader2 = const Color(0xff4f4f4f)
|
||||
..shader3 = const Color(0xff828282)
|
||||
..shader4 = const Color(0xffbdbdbd)
|
||||
..shader5 = const Color(0xffe0e0e0)
|
||||
..shader6 = const Color(0xfff2f2f2)
|
||||
..shader7 = const Color(0xffffffff)
|
||||
..bg1 = const Color(0xfff7f8fc)
|
||||
..bg2 = const Color(0xffedeef2)
|
||||
..bg3 = const Color(0xffe2e4eb)
|
||||
..bg4 = const Color(0xff2c144b)
|
||||
..tint1 = const Color(0xffe8e0ff)
|
||||
..tint2 = const Color(0xffffe7fd)
|
||||
..tint3 = const Color(0xffffe7ee)
|
||||
..tint4 = const Color(0xffffefe3)
|
||||
..tint5 = const Color(0xfffff2cd)
|
||||
..tint6 = const Color(0xfff5ffdc)
|
||||
..tint7 = const Color(0xffddffd6)
|
||||
..tint8 = const Color(0xffdefff1)
|
||||
..tint9 = const Color(0xffdefff1)
|
||||
..main1 = const Color(0xff00bcf0)
|
||||
..main2 = const Color(0xff00b7ea);
|
||||
}
|
||||
}
|
||||
|
||||
@ -76,23 +157,23 @@ class AppTheme {
|
||||
textTheme: (isDark ? ThemeData.dark() : ThemeData.light()).textTheme,
|
||||
colorScheme: ColorScheme(
|
||||
brightness: isDark ? Brightness.dark : Brightness.light,
|
||||
primary: accent1,
|
||||
primaryVariant: accent1Darker,
|
||||
secondary: accent2,
|
||||
secondaryVariant: ColorUtils.shiftHsl(accent2, -.2),
|
||||
primary: main1,
|
||||
primaryVariant: main2,
|
||||
secondary: bg1,
|
||||
secondaryVariant: bg2,
|
||||
background: bg1,
|
||||
surface: surface,
|
||||
onBackground: txt,
|
||||
onBackground: bg1,
|
||||
onSurface: txt,
|
||||
onError: txt,
|
||||
onPrimary: accentTxt,
|
||||
onSecondary: accentTxt,
|
||||
onError: red,
|
||||
onPrimary: bg1,
|
||||
onSecondary: bg1,
|
||||
error: error),
|
||||
);
|
||||
return t.copyWith(
|
||||
materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
|
||||
highlightColor: accent1,
|
||||
toggleableActiveColor: accent1);
|
||||
highlightColor: main1,
|
||||
toggleableActiveColor: main1);
|
||||
}
|
||||
|
||||
Color shift(Color c, double d) =>
|
||||
|
||||
@ -7,7 +7,7 @@ packages:
|
||||
name: async
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "2.6.1"
|
||||
version: "2.7.0"
|
||||
boolean_selector:
|
||||
dependency: transitive
|
||||
description:
|
||||
@ -28,7 +28,7 @@ packages:
|
||||
name: charcode
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "1.2.0"
|
||||
version: "1.3.1"
|
||||
clock:
|
||||
dependency: transitive
|
||||
description:
|
||||
@ -69,6 +69,13 @@ packages:
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "1.0.4"
|
||||
flutter_svg:
|
||||
dependency: "direct main"
|
||||
description:
|
||||
name: flutter_svg
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "0.22.0"
|
||||
flutter_test:
|
||||
dependency: "direct dev"
|
||||
description: flutter
|
||||
@ -101,7 +108,7 @@ packages:
|
||||
name: meta
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "1.3.0"
|
||||
version: "1.7.0"
|
||||
path:
|
||||
dependency: transitive
|
||||
description:
|
||||
@ -109,6 +116,27 @@ packages:
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "1.8.0"
|
||||
path_drawing:
|
||||
dependency: transitive
|
||||
description:
|
||||
name: path_drawing
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "0.5.1"
|
||||
path_parsing:
|
||||
dependency: transitive
|
||||
description:
|
||||
name: path_parsing
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "0.2.1"
|
||||
petitparser:
|
||||
dependency: transitive
|
||||
description:
|
||||
name: petitparser
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "4.2.0"
|
||||
sky_engine:
|
||||
dependency: transitive
|
||||
description: flutter
|
||||
@ -155,7 +183,7 @@ packages:
|
||||
name: test_api
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "0.3.0"
|
||||
version: "0.4.1"
|
||||
textstyle_extensions:
|
||||
dependency: "direct main"
|
||||
description:
|
||||
@ -191,6 +219,13 @@ packages:
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "2.1.0"
|
||||
xml:
|
||||
dependency: transitive
|
||||
description:
|
||||
name: xml
|
||||
url: "https://pub.dartlang.org"
|
||||
source: hosted
|
||||
version: "5.2.0"
|
||||
sdks:
|
||||
dart: ">=2.12.0 <3.0.0"
|
||||
flutter: ">=1.17.0"
|
||||
dart: ">=2.13.0 <3.0.0"
|
||||
flutter: ">=1.24.0-7.0"
|
||||
|
||||
@ -14,6 +14,7 @@ dependencies:
|
||||
uuid: ">=2.2.2"
|
||||
textstyle_extensions: '2.0.0-nullsafety'
|
||||
logger: ^1.0.0
|
||||
flutter_svg: ^0.22.0
|
||||
|
||||
dev_dependencies:
|
||||
flutter_test:
|
||||
|
||||
@ -117,12 +117,12 @@ class ScrollbarState extends State<StyledScrollbar> {
|
||||
var showHandle = contentExtent > _viewExtent && contentExtent > 0;
|
||||
// Handle color
|
||||
var handleColor = widget.handleColor ??
|
||||
(theme.isDark ? theme.greyWeak.withOpacity(.2) : theme.greyWeak);
|
||||
(theme.isDark ? theme.bg2.withOpacity(.2) : theme.bg2);
|
||||
// Track color
|
||||
var trackColor = widget.trackColor ??
|
||||
(theme.isDark
|
||||
? theme.greyWeak.withOpacity(.1)
|
||||
: theme.greyWeak.withOpacity(.3));
|
||||
? theme.bg2.withOpacity(.1)
|
||||
: theme.bg2.withOpacity(.3));
|
||||
|
||||
//Layout the stack, it just contains a child, and
|
||||
return Stack(children: <Widget>[
|
||||
|
||||
@ -200,7 +200,7 @@ class StyledSearchTextInputState extends State<StyledSearchTextInput> {
|
||||
autocorrect: widget.autoCorrect ?? false,
|
||||
enableSuggestions: widget.enableSuggestions ?? false,
|
||||
style: widget.style ?? TextStyles.Body1,
|
||||
cursorColor: theme.accent1,
|
||||
cursorColor: theme.main1,
|
||||
controller: _controller,
|
||||
showCursor: true,
|
||||
enabled: widget.enabled,
|
||||
@ -218,7 +218,7 @@ class StyledSearchTextInputState extends State<StyledSearchTextInput> {
|
||||
errorText: widget.errorText,
|
||||
errorMaxLines: 2,
|
||||
hintText: widget.hintText,
|
||||
hintStyle: TextStyles.Body1.textColor(theme.grey),
|
||||
hintStyle: TextStyles.Body1.textColor(theme.shader4),
|
||||
labelText: widget.label),
|
||||
),
|
||||
);
|
||||
|
||||
@ -82,7 +82,7 @@ class _BaseStyledBtnState extends State<BaseStyledButton> {
|
||||
boxShadow: _isFocused
|
||||
? [
|
||||
BoxShadow(
|
||||
color: theme.focus.withOpacity(0.25),
|
||||
color: theme.shader6,
|
||||
offset: Offset.zero,
|
||||
blurRadius: 8.0,
|
||||
spreadRadius: 0.0),
|
||||
@ -99,7 +99,7 @@ class _BaseStyledBtnState extends State<BaseStyledButton> {
|
||||
shape: RoundedRectangleBorder(
|
||||
side: BorderSide(
|
||||
width: 1.8,
|
||||
color: theme.focus,
|
||||
color: theme.shader6,
|
||||
),
|
||||
borderRadius:
|
||||
BorderRadius.circular(widget.borderRadius ?? Corners.s5),
|
||||
@ -119,8 +119,8 @@ class _BaseStyledBtnState extends State<BaseStyledButton> {
|
||||
highlightElevation: 0,
|
||||
focusElevation: 0,
|
||||
fillColor: Colors.transparent,
|
||||
hoverColor: widget.hoverColor ?? theme.surface,
|
||||
highlightColor: widget.downColor ?? theme.accent1.withOpacity(.1),
|
||||
hoverColor: widget.hoverColor ?? theme.hover,
|
||||
highlightColor: widget.downColor ?? theme.main1,
|
||||
focusColor: widget.focusColor ?? Colors.grey.withOpacity(0.35),
|
||||
child: Opacity(
|
||||
child: Padding(
|
||||
|
||||
@ -23,9 +23,9 @@ class PrimaryButton extends StatelessWidget {
|
||||
minWidth: bigMode ? 160 : 78,
|
||||
minHeight: bigMode ? 60 : 42,
|
||||
contentPadding: EdgeInsets.all(bigMode ? Insets.l : Insets.m),
|
||||
bgColor: theme.accent1Darker,
|
||||
hoverColor: theme.isDark ? theme.accent1 : theme.accent1Dark,
|
||||
downColor: theme.accent1Darker,
|
||||
bgColor: theme.bg1,
|
||||
hoverColor: theme.hover,
|
||||
downColor: theme.selector,
|
||||
borderRadius: bigMode ? Corners.s8 : Corners.s5,
|
||||
child: child,
|
||||
onPressed: onPressed,
|
||||
|
||||
@ -18,7 +18,7 @@ class SecondaryTextButton extends StatelessWidget {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = context.watch<AppTheme>();
|
||||
TextStyle txtStyle = TextStyles.Footnote.textColor(theme.accent1Darker);
|
||||
TextStyle txtStyle = TextStyles.Footnote.textColor(theme.shader1);
|
||||
return SecondaryButton(
|
||||
onPressed: onPressed, child: Text(label, style: txtStyle));
|
||||
}
|
||||
@ -42,7 +42,7 @@ class SecondaryIconButton extends StatelessWidget {
|
||||
minHeight: 36,
|
||||
minWidth: 36,
|
||||
contentPadding: Insets.sm,
|
||||
child: FlowyImageIcon(icon, size: 20, color: color ?? theme.grey),
|
||||
child: FlowyImageIcon(icon, size: 20, color: color ?? theme.shader4),
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -82,12 +82,11 @@ class _SecondaryButtonState extends State<SecondaryButton> {
|
||||
minWidth: widget.minWidth ?? 78,
|
||||
minHeight: widget.minHeight ?? 42,
|
||||
contentPadding: EdgeInsets.all(widget.contentPadding ?? Insets.m),
|
||||
bgColor: theme.surface,
|
||||
outlineColor:
|
||||
(_isMouseOver ? theme.accent1 : theme.grey).withOpacity(.35),
|
||||
hoverColor: theme.surface,
|
||||
bgColor: theme.bg1,
|
||||
outlineColor: (_isMouseOver ? theme.hover : theme.shader6),
|
||||
hoverColor: theme.hover,
|
||||
onFocusChanged: widget.onFocusChanged,
|
||||
downColor: theme.greyWeak.withOpacity(.35),
|
||||
downColor: theme.selector,
|
||||
borderRadius: Corners.s5,
|
||||
child: IgnorePointer(child: widget.child),
|
||||
onPressed: widget.onPressed,
|
||||
|
||||
@ -132,7 +132,7 @@ class StyledDialog extends StatelessWidget {
|
||||
|
||||
Widget innerContent = Container(
|
||||
padding: padding ?? EdgeInsets.all(Insets.lGutter),
|
||||
color: bgColor ?? theme.surface,
|
||||
color: bgColor ?? theme.bg1,
|
||||
child: child,
|
||||
);
|
||||
|
||||
@ -198,9 +198,9 @@ class OkCancelDialog extends StatelessWidget {
|
||||
children: <Widget>[
|
||||
if (title != null) ...[
|
||||
Text(title!.toUpperCase(),
|
||||
style: TextStyles.T1.textColor(theme.accent1Darker)),
|
||||
style: TextStyles.T1.textColor(theme.shader1)),
|
||||
VSpace(Insets.sm * 1.5),
|
||||
Container(color: theme.greyWeak.withOpacity(.35), height: 1),
|
||||
Container(color: theme.bg1, height: 1),
|
||||
VSpace(Insets.m * 1.5),
|
||||
],
|
||||
Text(message, style: TextStyles.Body1.textHeight(1.5)),
|
||||
|
||||
@ -8,6 +8,8 @@ class RoundedInputField extends StatefulWidget {
|
||||
final String? hintText;
|
||||
final IconData? icon;
|
||||
final bool obscureText;
|
||||
final Widget? obscureIcon;
|
||||
final Widget? obscureHideIcon;
|
||||
final Color normalBorderColor;
|
||||
final Color highlightBorderColor;
|
||||
final String errorText;
|
||||
@ -19,6 +21,8 @@ class RoundedInputField extends StatefulWidget {
|
||||
this.hintText,
|
||||
this.icon,
|
||||
this.obscureText = false,
|
||||
this.obscureIcon,
|
||||
this.obscureHideIcon,
|
||||
this.onChanged,
|
||||
this.normalBorderColor = Colors.transparent,
|
||||
this.highlightBorderColor = Colors.transparent,
|
||||
@ -84,13 +88,28 @@ class _RoundedInputFieldState extends State<RoundedInputField> {
|
||||
if (widget.obscureText == false) {
|
||||
return null;
|
||||
}
|
||||
|
||||
Widget? icon;
|
||||
if (widget.obscureText == true) {
|
||||
assert(widget.obscureIcon != null && widget.obscureHideIcon != null);
|
||||
if (widget.enableObscure) {
|
||||
icon = widget.obscureIcon!;
|
||||
} else {
|
||||
icon = widget.obscureHideIcon!;
|
||||
}
|
||||
}
|
||||
|
||||
if (icon == null) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return RoundedImageButton(
|
||||
size: 20,
|
||||
press: () {
|
||||
widget.enableObscure = !widget.enableObscure;
|
||||
setState(() {});
|
||||
},
|
||||
child: const Icon(Icons.password, size: 15),
|
||||
child: icon,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@ -88,6 +88,7 @@ flutter:
|
||||
# To add assets to your application, add an assets section, like this:
|
||||
assets:
|
||||
- assets/images/
|
||||
- assets/images/home/
|
||||
# - images/a_dot_ham.jpeg
|
||||
|
||||
# An image asset can refer to one or more resolution-specific "variants", see
|
||||
|
||||
Loading…
Reference in New Issue
Block a user