import 'package:flutter/material.dart'; /// Svrnty Typography System /// Extended text styles and typography utilities beyond Material Design 3 class AppTypography { // Prevent instantiation AppTypography._(); // ============================================ // FONT FAMILIES // ============================================ /// Primary font family (Montserrat) static const String fontFamilyPrimary = 'Montserrat'; /// Monospace font family (IBM Plex Mono) static const String fontFamilyMono = 'IBMPlexMono'; // ============================================ // FONT WEIGHTS // ============================================ /// Light font weight (300) static const FontWeight weightLight = FontWeight.w300; /// Regular font weight (400) static const FontWeight weightRegular = FontWeight.w400; /// Medium font weight (500) static const FontWeight weightMedium = FontWeight.w500; /// Semi-bold font weight (600) static const FontWeight weightSemiBold = FontWeight.w600; /// Bold font weight (700) static const FontWeight weightBold = FontWeight.w700; // ============================================ // FONT SIZES // ============================================ /// Display Large font size (57px) static const double sizeDisplayLarge = 57.0; /// Display Medium font size (45px) static const double sizeDisplayMedium = 45.0; /// Display Small font size (36px) static const double sizeDisplaySmall = 36.0; /// Headline Large font size (32px) static const double sizeHeadlineLarge = 32.0; /// Headline Medium font size (28px) static const double sizeHeadlineMedium = 28.0; /// Headline Small font size (24px) static const double sizeHeadlineSmall = 24.0; /// Title Large font size (22px) static const double sizeTitleLarge = 22.0; /// Title Medium font size (16px) static const double sizeTitleMedium = 16.0; /// Title Small font size (14px) static const double sizeTitleSmall = 14.0; /// Body Large font size (16px) static const double sizeBodyLarge = 16.0; /// Body Medium font size (14px) static const double sizeBodyMedium = 14.0; /// Body Small font size (12px) static const double sizeBodySmall = 12.0; /// Label Large font size (14px) static const double sizeLabelLarge = 14.0; /// Label Medium font size (12px) static const double sizeLabelMedium = 12.0; /// Label Small font size (11px) static const double sizeLabelSmall = 11.0; // ============================================ // LINE HEIGHTS // ============================================ /// Display Large line height (1.12 = 64px) static const double lineHeightDisplayLarge = 1.12; /// Display Medium line height (1.16 = 52px) static const double lineHeightDisplayMedium = 1.16; /// Display Small line height (1.22 = 44px) static const double lineHeightDisplaySmall = 1.22; /// Headline Large line height (1.25 = 40px) static const double lineHeightHeadlineLarge = 1.25; /// Headline Medium line height (1.29 = 36px) static const double lineHeightHeadlineMedium = 1.29; /// Headline Small line height (1.33 = 32px) static const double lineHeightHeadlineSmall = 1.33; /// Title Large line height (1.27 = 28px) static const double lineHeightTitleLarge = 1.27; /// Title Medium line height (1.5 = 24px) static const double lineHeightTitleMedium = 1.5; /// Title Small line height (1.43 = 20px) static const double lineHeightTitleSmall = 1.43; /// Body Large line height (1.5 = 24px) static const double lineHeightBodyLarge = 1.5; /// Body Medium line height (1.43 = 20px) static const double lineHeightBodyMedium = 1.43; /// Body Small line height (1.33 = 16px) static const double lineHeightBodySmall = 1.33; /// Label Large line height (1.43 = 20px) static const double lineHeightLabelLarge = 1.43; /// Label Medium line height (1.33 = 16px) static const double lineHeightLabelMedium = 1.33; /// Label Small line height (1.45 = 16px) static const double lineHeightLabelSmall = 1.45; // ============================================ // LETTER SPACING // ============================================ /// Display Large letter spacing (-0.5px) static const double letterSpacingDisplayLarge = -0.5; /// Display Medium letter spacing (-0.5px) static const double letterSpacingDisplayMedium = -0.5; /// Display Small letter spacing (-0.25px) static const double letterSpacingDisplaySmall = -0.25; /// Headline Large letter spacing (-0.25px) static const double letterSpacingHeadlineLarge = -0.25; /// Headline Medium letter spacing (0px) static const double letterSpacingHeadlineMedium = 0.0; /// Headline Small letter spacing (0px) static const double letterSpacingHeadlineSmall = 0.0; /// Title Large letter spacing (0px) static const double letterSpacingTitleLarge = 0.0; /// Title Medium letter spacing (0.15px) static const double letterSpacingTitleMedium = 0.15; /// Title Small letter spacing (0.1px) static const double letterSpacingTitleSmall = 0.1; /// Body Large letter spacing (0.5px) static const double letterSpacingBodyLarge = 0.5; /// Body Medium letter spacing (0.25px) static const double letterSpacingBodyMedium = 0.25; /// Body Small letter spacing (0.4px) static const double letterSpacingBodySmall = 0.4; /// Label Large letter spacing (0.1px) static const double letterSpacingLabelLarge = 0.1; /// Label Medium letter spacing (0.5px) static const double letterSpacingLabelMedium = 0.5; /// Label Small letter spacing (0.5px) static const double letterSpacingLabelSmall = 0.5; // ============================================ // CUSTOM TEXT STYLES // ============================================ /// Monospace small text style static const TextStyle monoSmall = TextStyle( fontFamily: fontFamilyMono, fontSize: sizeBodySmall, fontWeight: weightRegular, ); /// Monospace medium text style static const TextStyle monoMedium = TextStyle( fontFamily: fontFamilyMono, fontSize: sizeBodyMedium, fontWeight: weightRegular, ); /// Monospace large text style static const TextStyle monoLarge = TextStyle( fontFamily: fontFamilyMono, fontSize: sizeBodyLarge, fontWeight: weightRegular, ); /// Monospace bold text style static const TextStyle monoBold = TextStyle( fontFamily: fontFamilyMono, fontSize: sizeBodyMedium, fontWeight: weightBold, ); /// Code snippet text style static const TextStyle codeStyle = TextStyle( fontFamily: fontFamilyMono, fontSize: sizeBodySmall, fontWeight: weightRegular, backgroundColor: Color(0xFFF5F5F5), ); // ============================================ // TEXT STYLE EXTENSIONS // ============================================ /// Create a text style with color override static TextStyle withColor( TextStyle baseStyle, Color color, ) { return baseStyle.copyWith(color: color); } /// Create a text style with size override static TextStyle withSize( TextStyle baseStyle, double fontSize, ) { return baseStyle.copyWith(fontSize: fontSize); } /// Create a text style with weight override static TextStyle withWeight( TextStyle baseStyle, FontWeight fontWeight, ) { return baseStyle.copyWith(fontWeight: fontWeight); } /// Create a text style with opacity static TextStyle withOpacity( TextStyle baseStyle, double opacity, ) { final color = baseStyle.color ?? Colors.black; return baseStyle.copyWith( color: color.withOpacity(opacity), ); } /// Create a text style with letter spacing override static TextStyle withLetterSpacing( TextStyle baseStyle, double letterSpacing, ) { return baseStyle.copyWith(letterSpacing: letterSpacing); } /// Create a text style with line height override static TextStyle withLineHeight( TextStyle baseStyle, double height, ) { return baseStyle.copyWith(height: height); } /// Create a monospace version of a text style static TextStyle toMonospace(TextStyle baseStyle) { return baseStyle.copyWith( fontFamily: fontFamilyMono, ); } /// Create an italic version of a text style static TextStyle toItalic(TextStyle baseStyle) { return baseStyle.copyWith( fontStyle: FontStyle.italic, ); } /// Create a strikethrough version of a text style static TextStyle withStrikethrough(TextStyle baseStyle) { return baseStyle.copyWith( decoration: TextDecoration.lineThrough, ); } /// Create an underlined version of a text style static TextStyle withUnderline(TextStyle baseStyle) { return baseStyle.copyWith( decoration: TextDecoration.underline, ); } /// Create a text style with multiple modifications static TextStyle merge( TextStyle baseStyle, { Color? color, double? fontSize, FontWeight? fontWeight, double? letterSpacing, double? height, String? fontFamily, FontStyle? fontStyle, TextDecoration? decoration, }) { return baseStyle.copyWith( color: color, fontSize: fontSize, fontWeight: fontWeight, letterSpacing: letterSpacing, height: height, fontFamily: fontFamily, fontStyle: fontStyle, decoration: decoration, ); } }