text styles font based on theme

This commit is contained in:
julian 2022-09-26 11:34:41 -06:00
parent fb0908840d
commit 944bee890e
7 changed files with 839 additions and 366 deletions

View file

@ -80,59 +80,30 @@ class _RestoreOptionsViewState extends ConsumerState<RestoreOptionsView> {
colorArrowNext: Theme.of(context).extension<StackColors>()!.textSubtitle1, colorArrowNext: Theme.of(context).extension<StackColors>()!.textSubtitle1,
colorArrowPrevious: colorArrowPrevious:
Theme.of(context).extension<StackColors>()!.textSubtitle1, Theme.of(context).extension<StackColors>()!.textSubtitle1,
textStyleButtonNegative: GoogleFonts.inter( textStyleButtonNegative: STextStyles.datePicker600(context).copyWith(
color: baseColor, color: baseColor,
letterSpacing: 0.5,
fontSize: 16,
fontWeight: FontWeight.w600,
), ),
textStyleButtonPositive: GoogleFonts.inter( textStyleButtonPositive: STextStyles.datePicker600(context).copyWith(
color: baseColor, color: baseColor,
letterSpacing: 0.5,
fontSize: 16,
fontWeight: FontWeight.w600,
), ),
textStyleCurrentDayOnCalendar: GoogleFonts.inter( textStyleCurrentDayOnCalendar: STextStyles.datePicker400(context),
fontSize: 12, textStyleDayHeader: STextStyles.datePicker600(context),
fontWeight: FontWeight.w400, textStyleDayOnCalendar: STextStyles.datePicker400(context).copyWith(
letterSpacing: 0.5,
color: Theme.of(context).extension<StackColors>()!.accentColorDark,
),
textStyleDayHeader: GoogleFonts.inter(
letterSpacing: 0.5,
color: Theme.of(context).extension<StackColors>()!.accentColorDark,
fontSize: 16,
fontWeight: FontWeight.w600,
),
textStyleDayOnCalendar: GoogleFonts.inter(
color: baseColor, color: baseColor,
fontSize: 12,
fontWeight: FontWeight.w400,
letterSpacing: 0.5,
), ),
textStyleDayOnCalendarDisabled: GoogleFonts.inter( textStyleDayOnCalendarDisabled:
fontSize: 12, STextStyles.datePicker400(context).copyWith(
fontWeight: FontWeight.w400,
letterSpacing: 0.5,
color: Theme.of(context).extension<StackColors>()!.textSubtitle3, color: Theme.of(context).extension<StackColors>()!.textSubtitle3,
), ),
textStyleDayOnCalendarSelected: GoogleFonts.inter( textStyleDayOnCalendarSelected:
fontSize: 12, STextStyles.datePicker400(context).copyWith(
fontWeight: FontWeight.w400,
letterSpacing: 0.5,
color: Theme.of(context).extension<StackColors>()!.popupBG, color: Theme.of(context).extension<StackColors>()!.popupBG,
), ),
textStyleMonthYearHeader: GoogleFonts.inter( textStyleMonthYearHeader: STextStyles.datePicker600(context).copyWith(
letterSpacing: 0.5,
color: Theme.of(context).extension<StackColors>()!.textSubtitle1, color: Theme.of(context).extension<StackColors>()!.textSubtitle1,
fontSize: 16,
fontWeight: FontWeight.w600,
), ),
textStyleYearButton: GoogleFonts.inter( textStyleYearButton: STextStyles.datePicker600(context).copyWith(
letterSpacing: 0.5,
color: Theme.of(context).extension<StackColors>()!.textWhite, color: Theme.of(context).extension<StackColors>()!.textWhite,
fontSize: 16,
fontWeight: FontWeight.w600,
), ),
textStyleButtonAction: GoogleFonts.inter(), textStyleButtonAction: GoogleFonts.inter(),
); );
@ -140,16 +111,10 @@ class _RestoreOptionsViewState extends ConsumerState<RestoreOptionsView> {
MaterialRoundedYearPickerStyle _buildYearPickerStyle() { MaterialRoundedYearPickerStyle _buildYearPickerStyle() {
return MaterialRoundedYearPickerStyle( return MaterialRoundedYearPickerStyle(
textStyleYear: GoogleFonts.inter( textStyleYear: STextStyles.datePicker600(context).copyWith(
letterSpacing: 0.5,
color: Theme.of(context).extension<StackColors>()!.textSubtitle2, color: Theme.of(context).extension<StackColors>()!.textSubtitle2,
fontWeight: FontWeight.w600,
fontSize: 16,
), ),
textStyleYearSelected: GoogleFonts.inter( textStyleYearSelected: STextStyles.datePicker600(context).copyWith(
letterSpacing: 0.5,
color: Theme.of(context).extension<StackColors>()!.accentColorDark,
fontWeight: FontWeight.w600,
fontSize: 18, fontSize: 18,
), ),
); );

View file

@ -1,7 +1,7 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart'; import 'package:flutter_svg/svg.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart';
enum StepIndicatorStatus { current, completed, incomplete } enum StepIndicatorStatus { current, completed, incomplete }
@ -39,9 +39,7 @@ class StepIndicator extends StatelessWidget {
case StepIndicatorStatus.current: case StepIndicatorStatus.current:
return Text( return Text(
step.toString(), step.toString(),
style: GoogleFonts.roboto( style: STextStyles.stepIndicator(context).copyWith(
fontWeight: FontWeight.w600,
fontSize: 8,
color: Theme.of(context) color: Theme.of(context)
.extension<StackColors>()! .extension<StackColors>()!
.stepIndicatorIconNumber, .stepIndicatorIconNumber,
@ -57,9 +55,7 @@ class StepIndicator extends StatelessWidget {
case StepIndicatorStatus.incomplete: case StepIndicatorStatus.incomplete:
return Text( return Text(
step.toString(), step.toString(),
style: GoogleFonts.roboto( style: STextStyles.stepIndicator(context).copyWith(
fontWeight: FontWeight.w600,
fontSize: 8,
color: Theme.of(context) color: Theme.of(context)
.extension<StackColors>()! .extension<StackColors>()!
.stepIndicatorIconInactive, .stepIndicatorIconInactive,

View file

@ -3,7 +3,6 @@ import 'dart:io';
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';
import 'package:google_fonts/google_fonts.dart';
import 'package:stackwallet/notifications/show_flush_bar.dart'; import 'package:stackwallet/notifications/show_flush_bar.dart';
import 'package:stackwallet/pages/home_view/home_view.dart'; 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';
@ -188,7 +187,10 @@ class _CreatePinViewState extends ConsumerState<CreatePinView> {
fieldsCount: Constants.pinLength, fieldsCount: Constants.pinLength,
eachFieldHeight: 12, eachFieldHeight: 12,
eachFieldWidth: 12, eachFieldWidth: 12,
textStyle: GoogleFonts.workSans( textStyle: STextStyles.infoSmall(context).copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textSubtitle3,
fontSize: 1, fontSize: 1,
), ),
focusNode: _pinPutFocusNode2, focusNode: _pinPutFocusNode2,

View file

@ -1,6 +1,5 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_secure_storage/flutter_secure_storage.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/notifications/show_flush_bar.dart';
import 'package:stackwallet/pages/settings_views/global_settings_view/security_views/security_view.dart'; import 'package:stackwallet/pages/settings_views/global_settings_view/security_views/security_view.dart';
import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/assets.dart';
@ -168,7 +167,10 @@ class _ChangePinViewState extends State<ChangePinView> {
fieldsCount: Constants.pinLength, fieldsCount: Constants.pinLength,
eachFieldHeight: 12, eachFieldHeight: 12,
eachFieldWidth: 12, eachFieldWidth: 12,
textStyle: GoogleFonts.workSans( textStyle: STextStyles.infoSmall(context).copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textSubtitle3,
fontSize: 1, fontSize: 1,
), ),
focusNode: _pinPutFocusNode2, focusNode: _pinPutFocusNode2,

View file

@ -4,7 +4,6 @@ import 'package:flutter/services.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_rounded_date_picker/flutter_rounded_date_picker.dart'; import 'package:flutter_rounded_date_picker/flutter_rounded_date_picker.dart';
import 'package:flutter_svg/svg.dart'; import 'package:flutter_svg/svg.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:stackwallet/models/transaction_filter.dart'; import 'package:stackwallet/models/transaction_filter.dart';
import 'package:stackwallet/providers/providers.dart'; import 'package:stackwallet/providers/providers.dart';
import 'package:stackwallet/providers/ui/color_theme_provider.dart'; import 'package:stackwallet/providers/ui/color_theme_provider.dart';
@ -122,77 +121,43 @@ class _TransactionSearchViewState
colorArrowNext: Theme.of(context).extension<StackColors>()!.textSubtitle1, colorArrowNext: Theme.of(context).extension<StackColors>()!.textSubtitle1,
colorArrowPrevious: colorArrowPrevious:
Theme.of(context).extension<StackColors>()!.textSubtitle1, Theme.of(context).extension<StackColors>()!.textSubtitle1,
textStyleButtonNegative: GoogleFonts.inter( textStyleButtonNegative: STextStyles.datePicker600(context).copyWith(
letterSpacing: 0.5,
color: baseColor, color: baseColor,
fontSize: 16,
fontWeight: FontWeight.w600,
), ),
textStyleButtonPositive: GoogleFonts.inter( textStyleButtonPositive: STextStyles.datePicker600(context).copyWith(
letterSpacing: 0.5,
color: baseColor, color: baseColor,
fontSize: 16,
fontWeight: FontWeight.w600,
), ),
textStyleCurrentDayOnCalendar: GoogleFonts.inter( textStyleCurrentDayOnCalendar: STextStyles.datePicker400(context),
letterSpacing: 0.5, textStyleDayHeader: STextStyles.datePicker600(context),
color: Theme.of(context).extension<StackColors>()!.accentColorDark, textStyleDayOnCalendar: STextStyles.datePicker400(context).copyWith(
fontWeight: FontWeight.w400,
fontSize: 12,
),
textStyleDayHeader: GoogleFonts.inter(
letterSpacing: 0.5,
color: Theme.of(context).extension<StackColors>()!.accentColorDark,
fontSize: 16,
fontWeight: FontWeight.w600,
),
textStyleDayOnCalendar: GoogleFonts.inter(
letterSpacing: 0.5,
color: baseColor, color: baseColor,
fontSize: 12,
fontWeight: FontWeight.w400,
), ),
textStyleDayOnCalendarDisabled: GoogleFonts.inter( textStyleDayOnCalendarDisabled:
letterSpacing: 0.5, STextStyles.datePicker400(context).copyWith(
color: Theme.of(context).extension<StackColors>()!.textSubtitle3, color: Theme.of(context).extension<StackColors>()!.textSubtitle3,
fontWeight: FontWeight.w400,
fontSize: 12,
), ),
textStyleDayOnCalendarSelected: GoogleFonts.inter( textStyleDayOnCalendarSelected:
letterSpacing: 0.5, STextStyles.datePicker400(context).copyWith(
color: Theme.of(context).extension<StackColors>()!.textWhite, color: Theme.of(context).extension<StackColors>()!.textWhite,
fontWeight: FontWeight.w400,
fontSize: 12,
), ),
textStyleMonthYearHeader: GoogleFonts.inter( textStyleMonthYearHeader: STextStyles.datePicker600(context).copyWith(
letterSpacing: 0.5,
color: Theme.of(context).extension<StackColors>()!.textSubtitle1, color: Theme.of(context).extension<StackColors>()!.textSubtitle1,
fontSize: 16,
fontWeight: FontWeight.w600,
), ),
textStyleYearButton: GoogleFonts.inter( textStyleYearButton: STextStyles.datePicker600(context).copyWith(
letterSpacing: 0.5,
color: Theme.of(context).extension<StackColors>()!.textWhite, color: Theme.of(context).extension<StackColors>()!.textWhite,
fontSize: 16,
fontWeight: FontWeight.w600,
), ),
textStyleButtonAction: GoogleFonts.inter(), // textStyleButtonAction: GoogleFonts.inter(),
); );
} }
MaterialRoundedYearPickerStyle _buildYearPickerStyle() { MaterialRoundedYearPickerStyle _buildYearPickerStyle() {
return MaterialRoundedYearPickerStyle( return MaterialRoundedYearPickerStyle(
backgroundPicker: Theme.of(context).extension<StackColors>()!.popupBG, backgroundPicker: Theme.of(context).extension<StackColors>()!.popupBG,
textStyleYear: GoogleFonts.inter( textStyleYear: STextStyles.datePicker600(context).copyWith(
letterSpacing: 0.5,
color: Theme.of(context).extension<StackColors>()!.textSubtitle2, color: Theme.of(context).extension<StackColors>()!.textSubtitle2,
fontWeight: FontWeight.w600,
fontSize: 16, fontSize: 16,
), ),
textStyleYearSelected: GoogleFonts.inter( textStyleYearSelected: STextStyles.datePicker600(context).copyWith(
letterSpacing: 0.5,
color: Theme.of(context).extension<StackColors>()!.accentColorDark,
fontWeight: FontWeight.w600,
fontSize: 18, fontSize: 18,
), ),
); );

View file

@ -1,300 +1,848 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart'; import 'package:google_fonts/google_fonts.dart';
import 'package:stackwallet/utilities/theme/color_theme.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart';
class STextStyles { class STextStyles {
static TextStyle pageTitleH1(BuildContext context) => GoogleFonts.inter( static StackColors _theme(BuildContext context) =>
color: Theme.of(context).extension<StackColors>()!.textDark, Theme.of(context).extension<StackColors>()!;
static TextStyle pageTitleH1(BuildContext context) {
switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
fontSize: 20, fontSize: 20,
); );
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600,
fontSize: 20,
);
}
}
static TextStyle pageTitleH2(BuildContext context) => GoogleFonts.inter( static TextStyle pageTitleH2(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
fontSize: 18, fontSize: 18,
); );
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600,
fontSize: 18,
);
}
}
static TextStyle navBarTitle(BuildContext context) => GoogleFonts.inter( static TextStyle navBarTitle(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
fontSize: 16, fontSize: 16,
); );
case ThemeType.dark:
static TextStyle titleBold12(BuildContext context) => GoogleFonts.inter( return GoogleFonts.inter(
color: Theme.of(context).extension<StackColors>()!.textDark, color: _theme(context).textDark,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
fontSize: 16, fontSize: 16,
); );
}
}
static TextStyle titleBold12_400(BuildContext context) => GoogleFonts.inter( static TextStyle titleBold12(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark, 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) {
switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w400, fontWeight: FontWeight.w400,
fontSize: 16, fontSize: 16,
); );
case ThemeType.dark:
static TextStyle subtitle(BuildContext context) => GoogleFonts.inter( return GoogleFonts.inter(
color: Theme.of(context).extension<StackColors>()!.textDark, color: _theme(context).textDark,
fontWeight: FontWeight.w400, fontWeight: FontWeight.w400,
fontSize: 16, fontSize: 16,
); );
}
}
static TextStyle subtitle500(BuildContext context) => GoogleFonts.inter( static TextStyle subtitle(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark, 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) {
switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 16, fontSize: 16,
); );
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w500,
fontSize: 16,
);
}
}
static TextStyle subtitle600(BuildContext context) => GoogleFonts.inter( static TextStyle subtitle600(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
fontSize: 16, fontSize: 16,
); );
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600,
fontSize: 16,
);
}
}
static TextStyle button(BuildContext context) => GoogleFonts.inter( static TextStyle button(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.buttonTextPrimary, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).buttonTextPrimary,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 16, fontSize: 16,
); );
case ThemeType.dark:
static TextStyle largeMedium14(BuildContext context) => GoogleFonts.inter( return GoogleFonts.inter(
color: Theme.of(context).extension<StackColors>()!.textDark, color: _theme(context).buttonTextPrimary,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 16, fontSize: 16,
); );
}
}
static TextStyle smallMed14(BuildContext context) => GoogleFonts.inter( static TextStyle largeMedium14(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark3, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 16, fontSize: 16,
); );
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w500,
fontSize: 16,
);
}
}
static TextStyle smallMed12(BuildContext context) => GoogleFonts.inter( static TextStyle smallMed14(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark3, 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 smallMed12(BuildContext context) {
switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark3,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 14, fontSize: 14,
); );
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).textDark3,
fontWeight: FontWeight.w500,
fontSize: 14,
);
}
}
static TextStyle label(BuildContext context) => GoogleFonts.inter( static TextStyle label(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textSubtitle1, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textSubtitle1,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 12, fontSize: 12,
); );
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).textSubtitle1,
fontWeight: FontWeight.w500,
fontSize: 12,
);
}
}
static TextStyle label700(BuildContext context) => GoogleFonts.inter( static TextStyle label700(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textSubtitle1, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textSubtitle1,
fontWeight: FontWeight.w700, fontWeight: FontWeight.w700,
fontSize: 12, fontSize: 12,
); );
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).textSubtitle1,
fontWeight: FontWeight.w700,
fontSize: 12,
);
}
}
static TextStyle itemSubtitle(BuildContext context) => GoogleFonts.inter( static TextStyle itemSubtitle(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.infoItemLabel, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).infoItemLabel,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 14, fontSize: 14,
); );
case ThemeType.dark:
static TextStyle itemSubtitle12(BuildContext context) => GoogleFonts.inter( return GoogleFonts.inter(
color: Theme.of(context).extension<StackColors>()!.textDark, color: _theme(context).infoItemLabel,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 14, fontSize: 14,
); );
}
}
static TextStyle itemSubtitle12_600(BuildContext context) => static TextStyle itemSubtitle12(BuildContext context) {
GoogleFonts.inter( switch (_theme(context).themeType) {
color: Theme.of(context).extension<StackColors>()!.textDark, case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 14, fontSize: 14,
); );
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w500,
fontSize: 14,
);
}
}
static TextStyle fieldLabel(BuildContext context) => GoogleFonts.inter( static TextStyle itemSubtitle12_600(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textSubtitle2, 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) {
switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textSubtitle2,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 14, fontSize: 14,
height: 1.5, height: 1.5,
); );
case ThemeType.dark:
static TextStyle field(BuildContext context) => GoogleFonts.inter( return GoogleFonts.inter(
color: Theme.of(context).extension<StackColors>()!.textDark, color: _theme(context).textSubtitle2,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 14, fontSize: 14,
height: 1.5, height: 1.5,
); );
}
}
static TextStyle baseXS(BuildContext context) => GoogleFonts.inter( static TextStyle field(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark, 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 baseXS(BuildContext context) {
switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w400, fontWeight: FontWeight.w400,
fontSize: 14, fontSize: 14,
); );
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w400,
fontSize: 14,
);
}
}
static TextStyle link(BuildContext context) => GoogleFonts.inter( static TextStyle link(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.accentColorRed, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).accentColorRed,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 14, fontSize: 14,
); );
case ThemeType.dark:
static TextStyle link2(BuildContext context) => GoogleFonts.inter( return GoogleFonts.inter(
color: Theme.of(context).extension<StackColors>()!.infoItemIcons, color: _theme(context).accentColorRed,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 14, fontSize: 14,
); );
}
}
static TextStyle richLink(BuildContext context) => GoogleFonts.inter( static TextStyle link2(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.accentColorBlue, 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 richLink(BuildContext context) {
switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).accentColorBlue,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 12, fontSize: 12,
); );
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).accentColorBlue,
fontWeight: FontWeight.w500,
fontSize: 12,
);
}
}
static TextStyle w600_10(BuildContext context) => GoogleFonts.inter( static TextStyle w600_10(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
fontSize: 12, fontSize: 12,
); );
case ThemeType.dark:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600,
fontSize: 12,
);
}
}
static TextStyle syncPercent(BuildContext context) => GoogleFonts.inter( static TextStyle syncPercent(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 12, fontSize: 12,
); );
case ThemeType.dark:
static TextStyle buttonSmall(BuildContext context) => GoogleFonts.inter( return GoogleFonts.inter(
color: Theme.of(context).extension<StackColors>()!.textDark, color: _theme(context).textDark,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 12, fontSize: 12,
); );
}
}
static TextStyle errorSmall(BuildContext context) => GoogleFonts.inter( static TextStyle buttonSmall(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textError, 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) {
switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textError,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 10, fontSize: 10,
); );
case ThemeType.dark:
static TextStyle infoSmall(BuildContext context) => GoogleFonts.inter( return GoogleFonts.inter(
color: Theme.of(context).extension<StackColors>()!.textSubtitle1, color: _theme(context).textError,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 10, 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 // Desktop
static TextStyle desktopH2(BuildContext context) => GoogleFonts.inter( static TextStyle desktopH2(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
fontSize: 32, fontSize: 32,
height: 32 / 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( static TextStyle desktopH3(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
fontSize: 24, fontSize: 24,
height: 24 / 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( static TextStyle desktopTextMedium(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 20, fontSize: 20,
height: 30 / 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) => static TextStyle desktopTextMediumRegular(BuildContext context) {
GoogleFonts.inter( switch (_theme(context).themeType) {
color: Theme.of(context).extension<StackColors>()!.textDark, case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w400, fontWeight: FontWeight.w400,
fontSize: 20, fontSize: 20,
height: 30 / 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( static TextStyle desktopSubtitleH2(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w400, fontWeight: FontWeight.w400,
fontSize: 20, fontSize: 20,
height: 28 / 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( static TextStyle desktopSubtitleH1(BuildContext context) {
color: Theme.of(context).extension<StackColors>()!.textDark, switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textDark,
fontWeight: FontWeight.w400, fontWeight: FontWeight.w400,
fontSize: 24, fontSize: 24,
height: 33 / 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) => static TextStyle desktopButtonEnabled(BuildContext context) {
GoogleFonts.inter( switch (_theme(context).themeType) {
color: Theme.of(context).extension<StackColors>()!.buttonTextPrimary, case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).buttonTextPrimary,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 20, fontSize: 20,
height: 26 / 20, height: 26 / 20,
); );
case ThemeType.dark:
static TextStyle desktopButtonDisabled(BuildContext context) => return GoogleFonts.inter(
GoogleFonts.inter( color: _theme(context).buttonTextPrimary,
color: Theme.of(context)
.extension<StackColors>()!
.buttonTextPrimaryDisabled,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 20, fontSize: 20,
height: 26 / 20, height: 26 / 20,
); );
}
}
static TextStyle desktopButtonSecondaryEnabled(BuildContext context) => static TextStyle desktopButtonDisabled(BuildContext context) {
GoogleFonts.inter( switch (_theme(context).themeType) {
color: Theme.of(context).extension<StackColors>()!.buttonTextSecondary, case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).buttonTextPrimaryDisabled,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 20, fontSize: 20,
height: 26 / 20, height: 26 / 20,
); );
case ThemeType.dark:
static TextStyle desktopButtonSecondaryDisabled(BuildContext context) => return GoogleFonts.inter(
GoogleFonts.inter( color: _theme(context).buttonTextPrimaryDisabled,
color: Theme.of(context)
.extension<StackColors>()!
.buttonTextSecondaryDisabled,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 20, fontSize: 20,
height: 26 / 20, height: 26 / 20,
); );
}
}
static TextStyle desktopTextExtraSmall(BuildContext context) => static TextStyle desktopButtonSecondaryEnabled(BuildContext context) {
GoogleFonts.inter( switch (_theme(context).themeType) {
color: Theme.of(context) case ThemeType.light:
.extension<StackColors>()! return GoogleFonts.inter(
.buttonTextPrimaryDisabled, 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) {
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) {
switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).buttonTextPrimaryDisabled,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 16, fontSize: 16,
height: 24 / 16, height: 24 / 16,
); );
case ThemeType.dark:
static TextStyle desktopButtonSmallSecondaryEnabled(BuildContext context) => return GoogleFonts.inter(
GoogleFonts.inter( color: _theme(context).buttonTextPrimaryDisabled,
color: Theme.of(context).extension<StackColors>()!.buttonTextSecondary,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 16, fontSize: 16,
height: 24 / 16, height: 24 / 16,
); );
}
}
static TextStyle desktopTextFieldLabel(BuildContext context) => static TextStyle desktopButtonSmallSecondaryEnabled(BuildContext context) {
GoogleFonts.inter( switch (_theme(context).themeType) {
color: Theme.of(context).extension<StackColors>()!.textSubtitle2, 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) {
switch (_theme(context).themeType) {
case ThemeType.light:
return GoogleFonts.inter(
color: _theme(context).textSubtitle2,
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 20, fontSize: 20,
height: 30 / 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( static TextStyle desktopMenuItem(BuildContext context) {
color: Theme.of(context) switch (_theme(context).themeType) {
.extension<StackColors>()! case ThemeType.light:
.textDark return GoogleFonts.inter(
.withOpacity(0.8), color: _theme(context).textDark.withOpacity(0.8),
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 16, fontSize: 16,
height: 20.8 / 16, height: 20.8 / 16,
); );
static TextStyle desktopMenuItemSelected(BuildContext context) => case ThemeType.dark:
GoogleFonts.inter( return GoogleFonts.inter(
color: Theme.of(context).extension<StackColors>()!.textDark, color: _theme(context).textDark.withOpacity(0.8),
fontWeight: FontWeight.w500, fontWeight: FontWeight.w500,
fontSize: 16, fontSize: 16,
height: 20.8 / 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,
);
}
}
} }

View file

@ -1,7 +1,7 @@
import 'package:flutter/material.dart'; 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:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart'; import 'package:stackwallet/utilities/theme/stack_colors.dart';
class NumberKey extends StatefulWidget { class NumberKey extends StatefulWidget {
@ -72,12 +72,7 @@ class _NumberKeyState extends State<NumberKey> {
child: Center( child: Center(
child: Text( child: Text(
number, number,
style: GoogleFonts.roboto( style: STextStyles.numberDefault(context),
color:
Theme.of(context).extension<StackColors>()!.numberTextDefault,
fontWeight: FontWeight.w400,
fontSize: 26,
),
), ),
), ),
), ),