home + pinpad dark colors

This commit is contained in:
julian 2022-09-21 11:59:18 -06:00
parent 6e8f0babcd
commit 7d3a9bf0d9
9 changed files with 89 additions and 74 deletions

View file

@ -15,7 +15,6 @@ import 'package:stackwallet/providers/ui/home_view_index_provider.dart';
import 'package:stackwallet/providers/ui/unread_notifications_provider.dart'; import 'package:stackwallet/providers/ui/unread_notifications_provider.dart';
import 'package:stackwallet/services/change_now/change_now_loading_service.dart'; import 'package:stackwallet/services/change_now/change_now_loading_service.dart';
import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/cfcolors.dart';
import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/constants.dart';
import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/utilities/theme/stack_theme.dart';
@ -180,6 +179,10 @@ class _HomeViewState extends ConsumerState<HomeView> {
: Assets.svg.bell, : Assets.svg.bell,
width: 20, width: 20,
height: 20, height: 20,
color: ref.watch(notificationsProvider
.select((value) => value.hasUnreadNotifications))
? null
: StackTheme.instance.color.topNavIconPrimary,
), ),
onPressed: () { onPressed: () {
// reset unread state // reset unread state
@ -228,7 +231,7 @@ class _HomeViewState extends ConsumerState<HomeView> {
color: StackTheme.instance.color.background, color: StackTheme.instance.color.background,
icon: SvgPicture.asset( icon: SvgPicture.asset(
Assets.svg.gear, Assets.svg.gear,
color: CFColors.stackAccent, color: StackTheme.instance.color.topNavIconPrimary,
width: 20, width: 20,
height: 20, height: 20,
), ),
@ -251,7 +254,7 @@ class _HomeViewState extends ConsumerState<HomeView> {
decoration: BoxDecoration( decoration: BoxDecoration(
color: StackTheme.instance.color.background, color: StackTheme.instance.color.background,
boxShadow: [ boxShadow: [
CFColors.standardBoxShadow, StackTheme.instance.standardBoxShadow,
], ],
), ),
child: const Padding( child: const Padding(

View file

@ -10,7 +10,6 @@ import 'package:stackwallet/providers/exchange/estimate_rate_exchange_form_provi
import 'package:stackwallet/providers/exchange/fixed_rate_exchange_form_provider.dart'; import 'package:stackwallet/providers/exchange/fixed_rate_exchange_form_provider.dart';
import 'package:stackwallet/providers/exchange/fixed_rate_market_pairs_provider.dart'; import 'package:stackwallet/providers/exchange/fixed_rate_market_pairs_provider.dart';
import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/providers/providers.dart';
import 'package:stackwallet/utilities/cfcolors.dart';
import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/logger.dart';
import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/utilities/theme/stack_theme.dart';
@ -156,7 +155,7 @@ class _HomeViewButtonBarState extends ConsumerState<HomeViewButtonBar> {
MaterialStateProperty.all<Size>(const Size(46, 36)), MaterialStateProperty.all<Size>(const Size(46, 36)),
) )
: StackTheme.instance : StackTheme.instance
.getPrimaryDisabledButtonColor(context)! .getSecondaryEnabledButtonColor(context)!
.copyWith( .copyWith(
minimumSize: minimumSize:
MaterialStateProperty.all<Size>(const Size(46, 36)), MaterialStateProperty.all<Size>(const Size(46, 36)),
@ -171,8 +170,9 @@ class _HomeViewButtonBarState extends ConsumerState<HomeViewButtonBar> {
"Wallets", "Wallets",
style: STextStyles.button.copyWith( style: STextStyles.button.copyWith(
fontSize: 14, fontSize: 14,
color: color: selectedIndex == 0
selectedIndex == 0 ? CFColors.light1 : CFColors.stackAccent, ? StackTheme.instance.color.buttonTextPrimary
: StackTheme.instance.color.textDark,
), ),
), ),
), ),
@ -182,7 +182,7 @@ class _HomeViewButtonBarState extends ConsumerState<HomeViewButtonBar> {
), ),
Expanded( Expanded(
child: TextButton( child: TextButton(
style: selectedIndex == 0 style: selectedIndex == 1
? StackTheme.instance ? StackTheme.instance
.getPrimaryEnabledButtonColor(context)! .getPrimaryEnabledButtonColor(context)!
.copyWith( .copyWith(
@ -190,7 +190,7 @@ class _HomeViewButtonBarState extends ConsumerState<HomeViewButtonBar> {
MaterialStateProperty.all<Size>(const Size(46, 36)), MaterialStateProperty.all<Size>(const Size(46, 36)),
) )
: StackTheme.instance : StackTheme.instance
.getPrimaryDisabledButtonColor(context)! .getSecondaryEnabledButtonColor(context)!
.copyWith( .copyWith(
minimumSize: minimumSize:
MaterialStateProperty.all<Size>(const Size(46, 36)), MaterialStateProperty.all<Size>(const Size(46, 36)),
@ -228,8 +228,9 @@ class _HomeViewButtonBarState extends ConsumerState<HomeViewButtonBar> {
"Exchange", "Exchange",
style: STextStyles.button.copyWith( style: STextStyles.button.copyWith(
fontSize: 14, fontSize: 14,
color: color: selectedIndex == 1
selectedIndex == 1 ? CFColors.light1 : CFColors.stackAccent, ? StackTheme.instance.color.buttonTextPrimary
: StackTheme.instance.color.textDark,
), ),
), ),
), ),

View file

@ -1,6 +1,5 @@
import 'dart:io'; import 'dart:io';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_secure_storage/flutter_secure_storage.dart'; import 'package:flutter_secure_storage/flutter_secure_storage.dart';
@ -10,7 +9,6 @@ import 'package:stackwallet/pages/home_view/home_view.dart';
import 'package:stackwallet/providers/global/prefs_provider.dart'; import 'package:stackwallet/providers/global/prefs_provider.dart';
import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/biometrics.dart'; import 'package:stackwallet/utilities/biometrics.dart';
import 'package:stackwallet/utilities/cfcolors.dart';
import 'package:stackwallet/utilities/constants.dart'; import 'package:stackwallet/utilities/constants.dart';
import 'package:stackwallet/utilities/enums/flush_bar_type.dart'; import 'package:stackwallet/utilities/enums/flush_bar_type.dart';
import 'package:stackwallet/utilities/flutter_secure_storage_interface.dart'; import 'package:stackwallet/utilities/flutter_secure_storage_interface.dart';
@ -42,8 +40,9 @@ class CreatePinView extends ConsumerStatefulWidget {
class _CreatePinViewState extends ConsumerState<CreatePinView> { class _CreatePinViewState extends ConsumerState<CreatePinView> {
BoxDecoration get _pinPutDecoration { BoxDecoration get _pinPutDecoration {
return BoxDecoration( return BoxDecoration(
color: CFColors.gray3, color: StackTheme.instance.color.textSubtitle3,
border: Border.all(width: 1, color: CFColors.gray3), border:
Border.all(width: 1, color: StackTheme.instance.color.textSubtitle3),
borderRadius: BorderRadius.circular(6), borderRadius: BorderRadius.circular(6),
); );
} }

View file

@ -15,6 +15,8 @@ abstract class StackColorTheme {
Color get accentColorOrange; Color get accentColorOrange;
Color get accentColorDark; Color get accentColorDark;
Color get shadow;
Color get textDark; Color get textDark;
Color get textDark2; Color get textDark2;
Color get textDark3; Color get textDark3;

View file

@ -20,6 +20,9 @@ class DarkColors extends StackColorTheme {
@override @override
Color get accentColorDark => const Color(0xFFF3F3F3); Color get accentColorDark => const Color(0xFFF3F3F3);
@override
Color get shadow => const Color(0x0F2D3132);
@override @override
Color get textDark => const Color(0xFFF3F3F3); Color get textDark => const Color(0xFFF3F3F3);
@override @override

View file

@ -20,6 +20,9 @@ class LightColors extends StackColorTheme {
@override @override
Color get accentColorDark => const Color(0xFF232323); Color get accentColorDark => const Color(0xFF232323);
@override
Color get shadow => const Color(0x0F2D3132);
@override @override
Color get textDark => const Color(0xFF232323); Color get textDark => const Color(0xFF232323);
@override @override

View file

@ -23,6 +23,12 @@ class StackTheme {
} }
} }
BoxShadow get standardBoxShadow => BoxShadow(
color: color.shadow,
spreadRadius: 3,
blurRadius: 4,
);
ButtonStyle? getPrimaryEnabledButtonColor(BuildContext context) => ButtonStyle? getPrimaryEnabledButtonColor(BuildContext context) =>
Theme.of(context).textButtonTheme.style?.copyWith( Theme.of(context).textButtonTheme.style?.copyWith(
backgroundColor: MaterialStateProperty.all<Color>( backgroundColor: MaterialStateProperty.all<Color>(

View file

@ -30,7 +30,7 @@ class AppBarIconButton extends StatelessWidget {
width: size, width: size,
decoration: BoxDecoration( decoration: BoxDecoration(
borderRadius: BorderRadius.circular(1000), borderRadius: BorderRadius.circular(1000),
color: color ?? CFColors.white, color: color ?? StackTheme.instance.color.background,
boxShadow: shadows, boxShadow: shadows,
), ),
child: MaterialButton( child: MaterialButton(
@ -65,13 +65,14 @@ class AppBarBackButton extends StatelessWidget {
child: AppBarIconButton( child: AppBarIconButton(
size: isDesktop ? 56 : 32, size: isDesktop ? 56 : 32,
color: isDesktop color: isDesktop
? CFColors.textFieldDefaultBackground ? StackTheme.instance.color.textFieldDefaultBG
: StackTheme.instance.color.background, : StackTheme.instance.color.background,
shadows: const [], shadows: const [],
icon: SvgPicture.asset( icon: SvgPicture.asset(
Assets.svg.arrowLeft, Assets.svg.arrowLeft,
width: 24, width: 24,
height: 24, height: 24,
color: StackTheme.instance.color.topNavIconPrimary,
), ),
onPressed: onPressed ?? Navigator.of(context).pop, onPressed: onPressed ?? Navigator.of(context).pop,
), ),

View file

@ -2,7 +2,6 @@ import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart'; import 'package:flutter_svg/flutter_svg.dart';
import 'package:google_fonts/google_fonts.dart'; import 'package:google_fonts/google_fonts.dart';
import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/cfcolors.dart';
import 'package:stackwallet/utilities/theme/stack_theme.dart'; import 'package:stackwallet/utilities/theme/stack_theme.dart';
class NumberKey extends StatefulWidget { class NumberKey extends StatefulWidget {
@ -23,7 +22,7 @@ class _NumberKeyState extends State<NumberKey> {
late final String number; late final String number;
late final ValueSetter<String> onPressed; late final ValueSetter<String> onPressed;
Color _color = CFColors.white; Color _color = StackTheme.instance.color.numberBackDefault;
@override @override
void initState() { void initState() {
@ -52,13 +51,14 @@ class _NumberKeyState extends State<NumberKey> {
onPressed: () async { onPressed: () async {
onPressed.call(number); onPressed.call(number);
setState(() { setState(() {
_color = CFColors.splashLight; _color =
StackTheme.instance.color.numberBackDefault.withOpacity(0.8);
}); });
Future<void>.delayed(const Duration(milliseconds: 200), () { Future<void>.delayed(const Duration(milliseconds: 200), () {
if (mounted) { if (mounted) {
setState(() { setState(() {
_color = CFColors.white; _color = StackTheme.instance.color.numberBackDefault;
}); });
} }
}); });
@ -67,7 +67,7 @@ class _NumberKeyState extends State<NumberKey> {
child: Text( child: Text(
number, number,
style: GoogleFonts.roboto( style: GoogleFonts.roboto(
color: CFColors.stackAccent, color: StackTheme.instance.color.numberTextDefault,
fontWeight: FontWeight.w400, fontWeight: FontWeight.w400,
fontSize: 26, fontSize: 26,
), ),
@ -93,7 +93,7 @@ class BackspaceKey extends StatefulWidget {
class _BackspaceKeyState extends State<BackspaceKey> { class _BackspaceKeyState extends State<BackspaceKey> {
late final VoidCallback onPressed; late final VoidCallback onPressed;
Color _color = CFColors.stackAccent; Color _color = StackTheme.instance.color.numpadBackDefault;
@override @override
void initState() { void initState() {
@ -120,13 +120,14 @@ class _BackspaceKeyState extends State<BackspaceKey> {
onPressed: () { onPressed: () {
onPressed.call(); onPressed.call();
setState(() { setState(() {
_color = CFColors.stackAccent.withOpacity(0.8); _color =
StackTheme.instance.color.numpadBackDefault.withOpacity(0.8);
}); });
Future<void>.delayed(const Duration(milliseconds: 200), () { Future<void>.delayed(const Duration(milliseconds: 200), () {
if (mounted) { if (mounted) {
setState(() { setState(() {
_color = CFColors.stackAccent; _color = StackTheme.instance.color.numpadBackDefault;
}); });
} }
}); });
@ -136,6 +137,7 @@ class _BackspaceKeyState extends State<BackspaceKey> {
Assets.svg.delete, Assets.svg.delete,
width: 20, width: 20,
height: 20, height: 20,
color: StackTheme.instance.color.numpadTextDefault,
), ),
), ),
), ),
@ -143,44 +145,43 @@ class _BackspaceKeyState extends State<BackspaceKey> {
} }
} }
// class SubmitKey extends StatelessWidget { class SubmitKey extends StatelessWidget {
// const SubmitKey({ const SubmitKey({
// Key? key, Key? key,
// required this.onPressed, required this.onPressed,
// }) : super(key: key); }) : super(key: key);
//
// final VoidCallback onPressed; final VoidCallback onPressed;
//
// @override @override
// Widget build(BuildContext context) { Widget build(BuildContext context) {
// return Container( return Container(
// height: 72, height: 72,
// width: 72, width: 72,
// decoration: ShapeDecoration( decoration: ShapeDecoration(
// shape: StadiumBorder(), shape: const StadiumBorder(),
// color: CFColors.stackAccent, color: StackTheme.instance.color.numpadBackDefault,
// shadows: [], shadows: const [],
// ), ),
// child: MaterialButton( child: MaterialButton(
// // splashColor: CFColors.splashLight, // splashColor: CFColors.splashLight,
// materialTapTargetSize: MaterialTapTargetSize.shrinkWrap, materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
// shape: StadiumBorder(), shape: const StadiumBorder(),
// onPressed: () { onPressed: () {
// onPressed.call(); onPressed.call();
// }, },
// child: Container( child: Center(
// child: Center( child: SvgPicture.asset(
// child: SvgPicture.asset( Assets.svg.arrowRight,
// Assets.svg.arrowRight, width: 20,
// width: 20, height: 20,
// height: 20, color: StackTheme.instance.color.numpadTextDefault,
// ), ),
// ), ),
// ), ),
// ), );
// ); }
// } }
// }
class PinKeyboard extends StatelessWidget { class PinKeyboard extends StatelessWidget {
const PinKeyboard({ const PinKeyboard({
@ -204,9 +205,9 @@ class PinKeyboard extends StatelessWidget {
onBackPressed.call(); onBackPressed.call();
} }
// void _submitHandler() { void _submitHandler() {
// onSubmitPressed.call(); onSubmitPressed.call();
// } }
void _numberHandler(String number) { void _numberHandler(String number) {
onNumberKeyPressed.call(number); onNumberKeyPressed.call(number);
@ -297,9 +298,8 @@ class PinKeyboard extends StatelessWidget {
), ),
Row( Row(
children: [ children: [
const SizedBox( BackspaceKey(
height: 72, onPressed: _backHandler,
width: 72,
), ),
const SizedBox( const SizedBox(
width: 24, width: 24,
@ -311,11 +311,8 @@ class PinKeyboard extends StatelessWidget {
const SizedBox( const SizedBox(
width: 24, width: 24,
), ),
// SubmitKey( SubmitKey(
// onPressed: _submitHandler, onPressed: _submitHandler,
// )
BackspaceKey(
onPressed: _backHandler,
), ),
], ],
) )