desktop colors, text styles, and some ui element platform specific checks

This commit is contained in:
julian 2022-09-15 13:48:28 -06:00
parent 349646c05b
commit 28916a9b93
6 changed files with 121 additions and 39 deletions

View file

@ -53,6 +53,7 @@ Future<dynamic> showFloatingFlushBar({
Constants.size.circularBorderRadius,
),
margin: const EdgeInsets.all(20),
maxWidth: 550,
);
final _route = flushRoute.showFlushbar<dynamic>(

View file

@ -3,6 +3,7 @@ import 'dart:io';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:stackwallet/pages/pinpad_views/create_pin_view.dart';
import 'package:stackwallet/pages_desktop_specific/create_password/create_password_view.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/cfcolors.dart';
import 'package:stackwallet/utilities/text_styles.dart';
@ -254,13 +255,9 @@ class GetStartedButton extends StatelessWidget {
width: 328,
height: 70,
child: TextButton(
style: Theme.of(context).textButtonTheme.style?.copyWith(
backgroundColor: MaterialStateProperty.all<Color>(
CFColors.stackAccent,
),
),
style: CFColors.getPrimaryEnabledButtonColor(context),
onPressed: () {
// TODO: password setup flow
Navigator.of(context).pushNamed(CreatePasswordView.routeName);
},
child: Text(
"Get started",

View file

@ -145,4 +145,42 @@ abstract class CFColors {
}
return MaterialColor(color.value, swatch);
}
// new
static const Color textDark = Color(0xFF232323);
static const Color textSubtitle1 = Color(0xFF8E9192);
static const Color textSubtitle2 = Color(0xFFA9ACAC);
static const Color buttonTextSecondary = Color(0xFF232323);
static const Color buttonTextPrimary = Color(0xFFFFFFFF);
static const Color buttonTextPrimaryDisabled = Color(0xFFF8F8F8);
static const Color textFieldDefaultBackground = Color(0xFFEEEFF1);
static const Color buttonBackgroundPrimary = Color(0xFF232323);
static const Color buttonBackPrimaryDisabled = Color(0xFFD7D7D7);
// button color themes
static ButtonStyle? getPrimaryEnabledButtonColor(BuildContext context) =>
Theme.of(context).textButtonTheme.style?.copyWith(
backgroundColor: MaterialStateProperty.all<Color>(
CFColors.buttonBackgroundPrimary,
),
);
static ButtonStyle? getPrimaryDisabledButtonColor(BuildContext context) =>
Theme.of(context).textButtonTheme.style?.copyWith(
backgroundColor: MaterialStateProperty.all<Color>(
CFColors.buttonBackPrimaryDisabled,
),
);
static ButtonStyle? getSecondaryEnabledButtonColor(BuildContext context) =>
Theme.of(context).textButtonTheme.style?.copyWith(
backgroundColor: MaterialStateProperty.all<Color>(
CFColors.textFieldDefaultBackground,
),
);
}

View file

@ -143,33 +143,61 @@ class STextStyles {
fontSize: 10,
);
// static final TextStyle pinkHeader = GoogleFonts.workSans(
// color: CFColors.spark,
// fontWeight: FontWeight.w600,
// fontSize: 20,
// );
//
// static final TextStyle textField = GoogleFonts.workSans(
// color: CFColors.dusk,
// fontWeight: FontWeight.w400,
// fontSize: 16,
// );
//
// static final TextStyle textFieldHint = GoogleFonts.workSans(
// color: CFColors.twilight,
// fontWeight: FontWeight.w400,
// fontSize: 16,
// );
//
// static final TextStyle textFieldSuffix = GoogleFonts.workSans(
// color: CFColors.twilight,
// fontWeight: FontWeight.w600,
// fontSize: 16,
// );
//
// static final TextStyle label = GoogleFonts.workSans(
// color: CFColors.twilight,
// fontWeight: FontWeight.w500,
// fontSize: 12,
// );
// Desktop
static final TextStyle desktopH2 = GoogleFonts.inter(
color: CFColors.textDark,
fontWeight: FontWeight.w600,
fontSize: 32,
height: 32 / 32,
);
static final TextStyle desktopTextMedium = GoogleFonts.inter(
color: CFColors.textDark,
fontWeight: FontWeight.w500,
fontSize: 20,
height: 30 / 20,
);
static final TextStyle desktopSubtitleH2 = GoogleFonts.inter(
color: CFColors.textDark,
fontWeight: FontWeight.w400,
fontSize: 20,
height: 28 / 20,
);
static final TextStyle desktopButtonEnabled = GoogleFonts.inter(
color: CFColors.buttonTextPrimary,
fontWeight: FontWeight.w500,
fontSize: 20,
height: 26 / 20,
);
static final TextStyle desktopButtonDisabled = GoogleFonts.inter(
color: CFColors.buttonTextPrimaryDisabled,
fontWeight: FontWeight.w500,
fontSize: 20,
height: 26 / 20,
);
static final TextStyle desktopTextExtraSmall = GoogleFonts.inter(
color: CFColors.buttonTextPrimaryDisabled,
fontWeight: FontWeight.w500,
fontSize: 16,
height: 24 / 16,
);
static final TextStyle desktopButtonSecondaryEnabled = GoogleFonts.inter(
color: CFColors.buttonTextSecondary,
fontWeight: FontWeight.w500,
fontSize: 16,
height: 24 / 16,
);
static final TextStyle desktopTextFieldLabel = GoogleFonts.inter(
color: CFColors.textSubtitle2,
fontWeight: FontWeight.w500,
fontSize: 20,
height: 30 / 20,
);
}

View file

@ -1,3 +1,5 @@
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:stackwallet/utilities/assets.dart';
@ -52,10 +54,20 @@ class AppBarBackButton extends StatelessWidget {
@override
Widget build(BuildContext context) {
final isDesktop =
Platform.isMacOS || Platform.isWindows || Platform.isLinux;
return Padding(
padding: const EdgeInsets.all(10),
padding: isDesktop
? const EdgeInsets.symmetric(
vertical: 20,
horizontal: 24,
)
: const EdgeInsets.all(10),
child: AppBarIconButton(
color: CFColors.almostWhite,
size: isDesktop ? 56 : 32,
color: isDesktop
? CFColors.textFieldDefaultBackground
: CFColors.almostWhite,
shadows: const [],
icon: SvgPicture.asset(
Assets.svg.arrowLeft,

View file

@ -1,16 +1,22 @@
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:stackwallet/utilities/cfcolors.dart';
import 'package:stackwallet/utilities/text_styles.dart';
InputDecoration standardInputDecoration(
String? labelText, FocusNode textFieldFocusNode) {
final isDesktop = Platform.isWindows || Platform.isMacOS || Platform.isLinux;
return InputDecoration(
labelText: labelText,
fillColor: textFieldFocusNode.hasFocus
? CFColors.textFieldActive
: CFColors.textFieldInactive,
labelStyle: STextStyles.fieldLabel,
hintStyle: STextStyles.fieldLabel,
labelStyle:
isDesktop ? STextStyles.desktopTextFieldLabel : STextStyles.fieldLabel,
hintStyle:
isDesktop ? STextStyles.desktopTextFieldLabel : STextStyles.fieldLabel,
enabledBorder: InputBorder.none,
focusedBorder: InputBorder.none,
errorBorder: InputBorder.none,