From 944bee890eb252c4039f494c2b923fc778e2d130 Mon Sep 17 00:00:00 2001 From: julian Date: Mon, 26 Sep 2022 11:34:41 -0600 Subject: [PATCH] text styles font based on theme --- .../restore_options_view.dart | 61 +- .../sub_widgets/step_indicator.dart | 10 +- lib/pages/pinpad_views/create_pin_view.dart | 6 +- .../change_pin_view/change_pin_view.dart | 6 +- .../transaction_search_filter_view.dart | 63 +- lib/utilities/text_styles.dart | 1050 +++++++++++++---- lib/widgets/custom_pin_put/pin_keyboard.dart | 9 +- 7 files changed, 839 insertions(+), 366 deletions(-) diff --git a/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/restore_options_view.dart b/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/restore_options_view.dart index 7d658e87f..0edc110be 100644 --- a/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/restore_options_view.dart +++ b/lib/pages/add_wallet_views/restore_wallet_view/restore_options_view/restore_options_view.dart @@ -80,59 +80,30 @@ class _RestoreOptionsViewState extends ConsumerState { colorArrowNext: Theme.of(context).extension()!.textSubtitle1, colorArrowPrevious: Theme.of(context).extension()!.textSubtitle1, - textStyleButtonNegative: GoogleFonts.inter( + textStyleButtonNegative: STextStyles.datePicker600(context).copyWith( color: baseColor, - letterSpacing: 0.5, - fontSize: 16, - fontWeight: FontWeight.w600, ), - textStyleButtonPositive: GoogleFonts.inter( + textStyleButtonPositive: STextStyles.datePicker600(context).copyWith( color: baseColor, - letterSpacing: 0.5, - fontSize: 16, - fontWeight: FontWeight.w600, ), - textStyleCurrentDayOnCalendar: GoogleFonts.inter( - fontSize: 12, - fontWeight: FontWeight.w400, - letterSpacing: 0.5, - color: Theme.of(context).extension()!.accentColorDark, - ), - textStyleDayHeader: GoogleFonts.inter( - letterSpacing: 0.5, - color: Theme.of(context).extension()!.accentColorDark, - fontSize: 16, - fontWeight: FontWeight.w600, - ), - textStyleDayOnCalendar: GoogleFonts.inter( + textStyleCurrentDayOnCalendar: STextStyles.datePicker400(context), + textStyleDayHeader: STextStyles.datePicker600(context), + textStyleDayOnCalendar: STextStyles.datePicker400(context).copyWith( color: baseColor, - fontSize: 12, - fontWeight: FontWeight.w400, - letterSpacing: 0.5, ), - textStyleDayOnCalendarDisabled: GoogleFonts.inter( - fontSize: 12, - fontWeight: FontWeight.w400, - letterSpacing: 0.5, + textStyleDayOnCalendarDisabled: + STextStyles.datePicker400(context).copyWith( color: Theme.of(context).extension()!.textSubtitle3, ), - textStyleDayOnCalendarSelected: GoogleFonts.inter( - fontSize: 12, - fontWeight: FontWeight.w400, - letterSpacing: 0.5, + textStyleDayOnCalendarSelected: + STextStyles.datePicker400(context).copyWith( color: Theme.of(context).extension()!.popupBG, ), - textStyleMonthYearHeader: GoogleFonts.inter( - letterSpacing: 0.5, + textStyleMonthYearHeader: STextStyles.datePicker600(context).copyWith( color: Theme.of(context).extension()!.textSubtitle1, - fontSize: 16, - fontWeight: FontWeight.w600, ), - textStyleYearButton: GoogleFonts.inter( - letterSpacing: 0.5, + textStyleYearButton: STextStyles.datePicker600(context).copyWith( color: Theme.of(context).extension()!.textWhite, - fontSize: 16, - fontWeight: FontWeight.w600, ), textStyleButtonAction: GoogleFonts.inter(), ); @@ -140,16 +111,10 @@ class _RestoreOptionsViewState extends ConsumerState { MaterialRoundedYearPickerStyle _buildYearPickerStyle() { return MaterialRoundedYearPickerStyle( - textStyleYear: GoogleFonts.inter( - letterSpacing: 0.5, + textStyleYear: STextStyles.datePicker600(context).copyWith( color: Theme.of(context).extension()!.textSubtitle2, - fontWeight: FontWeight.w600, - fontSize: 16, ), - textStyleYearSelected: GoogleFonts.inter( - letterSpacing: 0.5, - color: Theme.of(context).extension()!.accentColorDark, - fontWeight: FontWeight.w600, + textStyleYearSelected: STextStyles.datePicker600(context).copyWith( fontSize: 18, ), ); diff --git a/lib/pages/exchange_view/sub_widgets/step_indicator.dart b/lib/pages/exchange_view/sub_widgets/step_indicator.dart index fd0d3a859..96e1d4a4c 100644 --- a/lib/pages/exchange_view/sub_widgets/step_indicator.dart +++ b/lib/pages/exchange_view/sub_widgets/step_indicator.dart @@ -1,7 +1,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/svg.dart'; -import 'package:google_fonts/google_fonts.dart'; import 'package:stackwallet/utilities/assets.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart'; enum StepIndicatorStatus { current, completed, incomplete } @@ -39,9 +39,7 @@ class StepIndicator extends StatelessWidget { case StepIndicatorStatus.current: return Text( step.toString(), - style: GoogleFonts.roboto( - fontWeight: FontWeight.w600, - fontSize: 8, + style: STextStyles.stepIndicator(context).copyWith( color: Theme.of(context) .extension()! .stepIndicatorIconNumber, @@ -57,9 +55,7 @@ class StepIndicator extends StatelessWidget { case StepIndicatorStatus.incomplete: return Text( step.toString(), - style: GoogleFonts.roboto( - fontWeight: FontWeight.w600, - fontSize: 8, + style: STextStyles.stepIndicator(context).copyWith( color: Theme.of(context) .extension()! .stepIndicatorIconInactive, diff --git a/lib/pages/pinpad_views/create_pin_view.dart b/lib/pages/pinpad_views/create_pin_view.dart index c4e4ee592..f8b84cfb4 100644 --- a/lib/pages/pinpad_views/create_pin_view.dart +++ b/lib/pages/pinpad_views/create_pin_view.dart @@ -3,7 +3,6 @@ import 'dart:io'; import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_secure_storage/flutter_secure_storage.dart'; -import 'package:google_fonts/google_fonts.dart'; import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/pages/home_view/home_view.dart'; import 'package:stackwallet/providers/global/prefs_provider.dart'; @@ -188,7 +187,10 @@ class _CreatePinViewState extends ConsumerState { fieldsCount: Constants.pinLength, eachFieldHeight: 12, eachFieldWidth: 12, - textStyle: GoogleFonts.workSans( + textStyle: STextStyles.infoSmall(context).copyWith( + color: Theme.of(context) + .extension()! + .textSubtitle3, fontSize: 1, ), focusNode: _pinPutFocusNode2, diff --git a/lib/pages/settings_views/global_settings_view/security_views/change_pin_view/change_pin_view.dart b/lib/pages/settings_views/global_settings_view/security_views/change_pin_view/change_pin_view.dart index f083eb63a..39c95cad7 100644 --- a/lib/pages/settings_views/global_settings_view/security_views/change_pin_view/change_pin_view.dart +++ b/lib/pages/settings_views/global_settings_view/security_views/change_pin_view/change_pin_view.dart @@ -1,6 +1,5 @@ import 'package:flutter/material.dart'; import 'package:flutter_secure_storage/flutter_secure_storage.dart'; -import 'package:google_fonts/google_fonts.dart'; import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/security_views/security_view.dart'; import 'package:stackwallet/utilities/assets.dart'; @@ -168,7 +167,10 @@ class _ChangePinViewState extends State { fieldsCount: Constants.pinLength, eachFieldHeight: 12, eachFieldWidth: 12, - textStyle: GoogleFonts.workSans( + textStyle: STextStyles.infoSmall(context).copyWith( + color: Theme.of(context) + .extension()! + .textSubtitle3, fontSize: 1, ), focusNode: _pinPutFocusNode2, diff --git a/lib/pages/wallet_view/transaction_views/transaction_search_filter_view.dart b/lib/pages/wallet_view/transaction_views/transaction_search_filter_view.dart index 48fe89e65..728706702 100644 --- a/lib/pages/wallet_view/transaction_views/transaction_search_filter_view.dart +++ b/lib/pages/wallet_view/transaction_views/transaction_search_filter_view.dart @@ -4,7 +4,6 @@ import 'package:flutter/services.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_rounded_date_picker/flutter_rounded_date_picker.dart'; import 'package:flutter_svg/svg.dart'; -import 'package:google_fonts/google_fonts.dart'; import 'package:stackwallet/models/transaction_filter.dart'; import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/providers/ui/color_theme_provider.dart'; @@ -122,77 +121,43 @@ class _TransactionSearchViewState colorArrowNext: Theme.of(context).extension()!.textSubtitle1, colorArrowPrevious: Theme.of(context).extension()!.textSubtitle1, - textStyleButtonNegative: GoogleFonts.inter( - letterSpacing: 0.5, + textStyleButtonNegative: STextStyles.datePicker600(context).copyWith( color: baseColor, - fontSize: 16, - fontWeight: FontWeight.w600, ), - textStyleButtonPositive: GoogleFonts.inter( - letterSpacing: 0.5, + textStyleButtonPositive: STextStyles.datePicker600(context).copyWith( color: baseColor, - fontSize: 16, - fontWeight: FontWeight.w600, ), - textStyleCurrentDayOnCalendar: GoogleFonts.inter( - letterSpacing: 0.5, - color: Theme.of(context).extension()!.accentColorDark, - fontWeight: FontWeight.w400, - fontSize: 12, - ), - textStyleDayHeader: GoogleFonts.inter( - letterSpacing: 0.5, - color: Theme.of(context).extension()!.accentColorDark, - fontSize: 16, - fontWeight: FontWeight.w600, - ), - textStyleDayOnCalendar: GoogleFonts.inter( - letterSpacing: 0.5, + textStyleCurrentDayOnCalendar: STextStyles.datePicker400(context), + textStyleDayHeader: STextStyles.datePicker600(context), + textStyleDayOnCalendar: STextStyles.datePicker400(context).copyWith( color: baseColor, - fontSize: 12, - fontWeight: FontWeight.w400, ), - textStyleDayOnCalendarDisabled: GoogleFonts.inter( - letterSpacing: 0.5, + textStyleDayOnCalendarDisabled: + STextStyles.datePicker400(context).copyWith( color: Theme.of(context).extension()!.textSubtitle3, - fontWeight: FontWeight.w400, - fontSize: 12, ), - textStyleDayOnCalendarSelected: GoogleFonts.inter( - letterSpacing: 0.5, + textStyleDayOnCalendarSelected: + STextStyles.datePicker400(context).copyWith( color: Theme.of(context).extension()!.textWhite, - fontWeight: FontWeight.w400, - fontSize: 12, ), - textStyleMonthYearHeader: GoogleFonts.inter( - letterSpacing: 0.5, + textStyleMonthYearHeader: STextStyles.datePicker600(context).copyWith( color: Theme.of(context).extension()!.textSubtitle1, - fontSize: 16, - fontWeight: FontWeight.w600, ), - textStyleYearButton: GoogleFonts.inter( - letterSpacing: 0.5, + textStyleYearButton: STextStyles.datePicker600(context).copyWith( color: Theme.of(context).extension()!.textWhite, - fontSize: 16, - fontWeight: FontWeight.w600, ), - textStyleButtonAction: GoogleFonts.inter(), + // textStyleButtonAction: GoogleFonts.inter(), ); } MaterialRoundedYearPickerStyle _buildYearPickerStyle() { return MaterialRoundedYearPickerStyle( backgroundPicker: Theme.of(context).extension()!.popupBG, - textStyleYear: GoogleFonts.inter( - letterSpacing: 0.5, + textStyleYear: STextStyles.datePicker600(context).copyWith( color: Theme.of(context).extension()!.textSubtitle2, - fontWeight: FontWeight.w600, fontSize: 16, ), - textStyleYearSelected: GoogleFonts.inter( - letterSpacing: 0.5, - color: Theme.of(context).extension()!.accentColorDark, - fontWeight: FontWeight.w600, + textStyleYearSelected: STextStyles.datePicker600(context).copyWith( fontSize: 18, ), ); diff --git a/lib/utilities/text_styles.dart b/lib/utilities/text_styles.dart index 272fd675a..7c6aa2aaf 100644 --- a/lib/utilities/text_styles.dart +++ b/lib/utilities/text_styles.dart @@ -1,300 +1,848 @@ import 'package:flutter/material.dart'; import 'package:google_fonts/google_fonts.dart'; +import 'package:stackwallet/utilities/theme/color_theme.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart'; class STextStyles { - static TextStyle pageTitleH1(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w600, - fontSize: 20, - ); + static StackColors _theme(BuildContext context) => + Theme.of(context).extension()!; - static TextStyle pageTitleH2(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w600, - fontSize: 18, - ); + static TextStyle pageTitleH1(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 20, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 20, + ); + } + } - static TextStyle navBarTitle(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w600, - fontSize: 16, - ); + static TextStyle pageTitleH2(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 18, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 18, + ); + } + } - static TextStyle titleBold12(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w600, - fontSize: 16, - ); + static TextStyle navBarTitle(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 16, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 16, + ); + } + } - static TextStyle titleBold12_400(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w400, - fontSize: 16, - ); + static TextStyle titleBold12(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 16, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 16, + ); + } + } - static TextStyle subtitle(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w400, - fontSize: 16, - ); + static TextStyle titleBold12_400(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w400, + fontSize: 16, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w400, + fontSize: 16, + ); + } + } - static TextStyle subtitle500(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w500, - fontSize: 16, - ); + static TextStyle subtitle(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w400, + fontSize: 16, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w400, + fontSize: 16, + ); + } + } - static TextStyle subtitle600(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w600, - fontSize: 16, - ); + static TextStyle subtitle500(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 16, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 16, + ); + } + } - static TextStyle button(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.buttonTextPrimary, - fontWeight: FontWeight.w500, - fontSize: 16, - ); + static TextStyle subtitle600(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 16, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 16, + ); + } + } - static TextStyle largeMedium14(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w500, - fontSize: 16, - ); + static TextStyle button(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).buttonTextPrimary, + fontWeight: FontWeight.w500, + fontSize: 16, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).buttonTextPrimary, + fontWeight: FontWeight.w500, + fontSize: 16, + ); + } + } - static TextStyle smallMed14(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark3, - fontWeight: FontWeight.w500, - fontSize: 16, - ); + static TextStyle largeMedium14(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 16, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 16, + ); + } + } - static TextStyle smallMed12(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark3, - fontWeight: FontWeight.w500, - fontSize: 14, - ); + static TextStyle smallMed14(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark3, + fontWeight: FontWeight.w500, + fontSize: 16, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark3, + fontWeight: FontWeight.w500, + fontSize: 16, + ); + } + } - static TextStyle label(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textSubtitle1, - fontWeight: FontWeight.w500, - fontSize: 12, - ); + static TextStyle smallMed12(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark3, + fontWeight: FontWeight.w500, + fontSize: 14, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark3, + fontWeight: FontWeight.w500, + fontSize: 14, + ); + } + } - static TextStyle label700(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textSubtitle1, - fontWeight: FontWeight.w700, - fontSize: 12, - ); + static TextStyle label(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textSubtitle1, + fontWeight: FontWeight.w500, + fontSize: 12, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textSubtitle1, + fontWeight: FontWeight.w500, + fontSize: 12, + ); + } + } - static TextStyle itemSubtitle(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.infoItemLabel, - fontWeight: FontWeight.w500, - fontSize: 14, - ); + static TextStyle label700(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textSubtitle1, + fontWeight: FontWeight.w700, + fontSize: 12, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textSubtitle1, + fontWeight: FontWeight.w700, + fontSize: 12, + ); + } + } - static TextStyle itemSubtitle12(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w500, - fontSize: 14, - ); + static TextStyle itemSubtitle(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).infoItemLabel, + fontWeight: FontWeight.w500, + fontSize: 14, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).infoItemLabel, + fontWeight: FontWeight.w500, + fontSize: 14, + ); + } + } - static TextStyle itemSubtitle12_600(BuildContext context) => - GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w500, - fontSize: 14, - ); + static TextStyle itemSubtitle12(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 14, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 14, + ); + } + } - static TextStyle fieldLabel(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textSubtitle2, - fontWeight: FontWeight.w500, - fontSize: 14, - height: 1.5, - ); + static TextStyle itemSubtitle12_600(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 14, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 14, + ); + } + } - static TextStyle field(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w500, - fontSize: 14, - height: 1.5, - ); + static TextStyle fieldLabel(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textSubtitle2, + fontWeight: FontWeight.w500, + fontSize: 14, + height: 1.5, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textSubtitle2, + fontWeight: FontWeight.w500, + fontSize: 14, + height: 1.5, + ); + } + } - static TextStyle baseXS(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w400, - fontSize: 14, - ); + static TextStyle field(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 14, + height: 1.5, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 14, + height: 1.5, + ); + } + } - static TextStyle link(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.accentColorRed, - fontWeight: FontWeight.w500, - fontSize: 14, - ); + static TextStyle baseXS(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w400, + fontSize: 14, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w400, + fontSize: 14, + ); + } + } - static TextStyle link2(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.infoItemIcons, - fontWeight: FontWeight.w500, - fontSize: 14, - ); + static TextStyle link(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).accentColorRed, + fontWeight: FontWeight.w500, + fontSize: 14, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).accentColorRed, + fontWeight: FontWeight.w500, + fontSize: 14, + ); + } + } - static TextStyle richLink(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.accentColorBlue, - fontWeight: FontWeight.w500, - fontSize: 12, - ); + static TextStyle link2(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).infoItemIcons, + fontWeight: FontWeight.w500, + fontSize: 14, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).infoItemIcons, + fontWeight: FontWeight.w500, + fontSize: 14, + ); + } + } - static TextStyle w600_10(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w600, - fontSize: 12, - ); + static TextStyle richLink(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).accentColorBlue, + fontWeight: FontWeight.w500, + fontSize: 12, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).accentColorBlue, + fontWeight: FontWeight.w500, + fontSize: 12, + ); + } + } - static TextStyle syncPercent(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w500, - fontSize: 12, - ); + static TextStyle w600_10(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 12, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 12, + ); + } + } - static TextStyle buttonSmall(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w500, - fontSize: 12, - ); + static TextStyle syncPercent(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 12, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 12, + ); + } + } - static TextStyle errorSmall(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textError, - fontWeight: FontWeight.w500, - fontSize: 10, - ); + static TextStyle buttonSmall(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 12, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 12, + ); + } + } - static TextStyle infoSmall(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textSubtitle1, - fontWeight: FontWeight.w500, - fontSize: 10, - ); + static TextStyle errorSmall(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textError, + fontWeight: FontWeight.w500, + fontSize: 10, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textError, + fontWeight: FontWeight.w500, + fontSize: 10, + ); + } + } + + static TextStyle infoSmall(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textSubtitle1, + fontWeight: FontWeight.w500, + fontSize: 10, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textSubtitle1, + fontWeight: FontWeight.w500, + fontSize: 10, + ); + } + } // Desktop - static TextStyle desktopH2(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w600, - fontSize: 32, - height: 32 / 32, - ); + static TextStyle desktopH2(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 32, + height: 32 / 32, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 32, + height: 32 / 32, + ); + } + } - static TextStyle desktopH3(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w600, - fontSize: 24, - height: 24 / 24, - ); + static TextStyle desktopH3(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 24, + height: 24 / 24, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 24, + height: 24 / 24, + ); + } + } - static TextStyle desktopTextMedium(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w500, - fontSize: 20, - height: 30 / 20, - ); + static TextStyle desktopTextMedium(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 30 / 20, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 30 / 20, + ); + } + } - static TextStyle desktopTextMediumRegular(BuildContext context) => - GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w400, - fontSize: 20, - height: 30 / 20, - ); + static TextStyle desktopTextMediumRegular(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w400, + fontSize: 20, + height: 30 / 20, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w400, + fontSize: 20, + height: 30 / 20, + ); + } + } - static TextStyle desktopSubtitleH2(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w400, - fontSize: 20, - height: 28 / 20, - ); + static TextStyle desktopSubtitleH2(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w400, + fontSize: 20, + height: 28 / 20, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w400, + fontSize: 20, + height: 28 / 20, + ); + } + } - static TextStyle desktopSubtitleH1(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w400, - fontSize: 24, - height: 33 / 24, - ); + static TextStyle desktopSubtitleH1(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w400, + fontSize: 24, + height: 33 / 24, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w400, + fontSize: 24, + height: 33 / 24, + ); + } + } - static TextStyle desktopButtonEnabled(BuildContext context) => - GoogleFonts.inter( - color: Theme.of(context).extension()!.buttonTextPrimary, - fontWeight: FontWeight.w500, - fontSize: 20, - height: 26 / 20, - ); + static TextStyle desktopButtonEnabled(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).buttonTextPrimary, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 26 / 20, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).buttonTextPrimary, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 26 / 20, + ); + } + } - static TextStyle desktopButtonDisabled(BuildContext context) => - GoogleFonts.inter( - color: Theme.of(context) - .extension()! - .buttonTextPrimaryDisabled, - fontWeight: FontWeight.w500, - fontSize: 20, - height: 26 / 20, - ); + static TextStyle desktopButtonDisabled(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).buttonTextPrimaryDisabled, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 26 / 20, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).buttonTextPrimaryDisabled, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 26 / 20, + ); + } + } - static TextStyle desktopButtonSecondaryEnabled(BuildContext context) => - GoogleFonts.inter( - color: Theme.of(context).extension()!.buttonTextSecondary, - fontWeight: FontWeight.w500, - fontSize: 20, - height: 26 / 20, - ); + static TextStyle desktopButtonSecondaryEnabled(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).buttonTextSecondary, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 26 / 20, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).buttonTextSecondary, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 26 / 20, + ); + } + } - static TextStyle desktopButtonSecondaryDisabled(BuildContext context) => - GoogleFonts.inter( - color: Theme.of(context) - .extension()! - .buttonTextSecondaryDisabled, - fontWeight: FontWeight.w500, - fontSize: 20, - height: 26 / 20, - ); + static TextStyle desktopButtonSecondaryDisabled(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).buttonTextSecondaryDisabled, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 26 / 20, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).buttonTextSecondaryDisabled, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 26 / 20, + ); + } + } - static TextStyle desktopTextExtraSmall(BuildContext context) => - GoogleFonts.inter( - color: Theme.of(context) - .extension()! - .buttonTextPrimaryDisabled, - fontWeight: FontWeight.w500, - fontSize: 16, - height: 24 / 16, - ); + static TextStyle desktopTextExtraSmall(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).buttonTextPrimaryDisabled, + fontWeight: FontWeight.w500, + fontSize: 16, + height: 24 / 16, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).buttonTextPrimaryDisabled, + fontWeight: FontWeight.w500, + fontSize: 16, + height: 24 / 16, + ); + } + } - static TextStyle desktopButtonSmallSecondaryEnabled(BuildContext context) => - GoogleFonts.inter( - color: Theme.of(context).extension()!.buttonTextSecondary, - fontWeight: FontWeight.w500, - fontSize: 16, - height: 24 / 16, - ); + static TextStyle desktopButtonSmallSecondaryEnabled(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).buttonTextSecondary, + fontWeight: FontWeight.w500, + fontSize: 16, + height: 24 / 16, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).buttonTextSecondary, + fontWeight: FontWeight.w500, + fontSize: 16, + height: 24 / 16, + ); + } + } - static TextStyle desktopTextFieldLabel(BuildContext context) => - GoogleFonts.inter( - color: Theme.of(context).extension()!.textSubtitle2, - fontWeight: FontWeight.w500, - fontSize: 20, - height: 30 / 20, - ); + static TextStyle desktopTextFieldLabel(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textSubtitle2, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 30 / 20, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textSubtitle2, + fontWeight: FontWeight.w500, + fontSize: 20, + height: 30 / 20, + ); + } + } - static TextStyle desktopMenuItem(BuildContext context) => GoogleFonts.inter( - color: Theme.of(context) - .extension()! - .textDark - .withOpacity(0.8), - fontWeight: FontWeight.w500, - fontSize: 16, - height: 20.8 / 16, - ); - static TextStyle desktopMenuItemSelected(BuildContext context) => - GoogleFonts.inter( - color: Theme.of(context).extension()!.textDark, - fontWeight: FontWeight.w500, - fontSize: 16, - height: 20.8 / 16, - ); + static TextStyle desktopMenuItem(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark.withOpacity(0.8), + fontWeight: FontWeight.w500, + fontSize: 16, + height: 20.8 / 16, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark.withOpacity(0.8), + fontWeight: FontWeight.w500, + fontSize: 16, + height: 20.8 / 16, + ); + } + } + + static TextStyle desktopMenuItemSelected(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 16, + height: 20.8 / 16, + ); + case ThemeType.dark: + return GoogleFonts.inter( + color: _theme(context).textDark, + fontWeight: FontWeight.w500, + fontSize: 16, + height: 20.8 / 16, + ); + } + } + + static TextStyle stepIndicator(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.roboto( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 8, + ); + case ThemeType.dark: + return GoogleFonts.roboto( + color: _theme(context).textDark, + fontWeight: FontWeight.w600, + fontSize: 8, + ); + } + } + + static TextStyle numberDefault(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.roboto( + color: _theme(context).numberTextDefault, + fontWeight: FontWeight.w400, + fontSize: 26, + ); + case ThemeType.dark: + return GoogleFonts.roboto( + color: _theme(context).numberTextDefault, + fontWeight: FontWeight.w400, + fontSize: 26, + ); + } + } + + static TextStyle datePicker400(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + letterSpacing: 0.5, + color: _theme(context).accentColorDark, + fontWeight: FontWeight.w400, + fontSize: 12, + ); + case ThemeType.dark: + return GoogleFonts.inter( + letterSpacing: 0.5, + color: _theme(context).accentColorDark, + fontWeight: FontWeight.w400, + fontSize: 12, + ); + } + } + + static TextStyle datePicker600(BuildContext context) { + switch (_theme(context).themeType) { + case ThemeType.light: + return GoogleFonts.inter( + letterSpacing: 0.5, + color: _theme(context).accentColorDark, + fontWeight: FontWeight.w600, + fontSize: 16, + ); + case ThemeType.dark: + return GoogleFonts.inter( + letterSpacing: 0.5, + color: _theme(context).accentColorDark, + fontWeight: FontWeight.w600, + fontSize: 16, + ); + } + } } diff --git a/lib/widgets/custom_pin_put/pin_keyboard.dart b/lib/widgets/custom_pin_put/pin_keyboard.dart index 6c1f50d78..1dcac4d4c 100644 --- a/lib/widgets/custom_pin_put/pin_keyboard.dart +++ b/lib/widgets/custom_pin_put/pin_keyboard.dart @@ -1,7 +1,7 @@ import 'package:flutter/material.dart'; import 'package:flutter_svg/flutter_svg.dart'; -import 'package:google_fonts/google_fonts.dart'; import 'package:stackwallet/utilities/assets.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart'; class NumberKey extends StatefulWidget { @@ -72,12 +72,7 @@ class _NumberKeyState extends State { child: Center( child: Text( number, - style: GoogleFonts.roboto( - color: - Theme.of(context).extension()!.numberTextDefault, - fontWeight: FontWeight.w400, - fontSize: 26, - ), + style: STextStyles.numberDefault(context), ), ), ),