Initial commit
This commit is contained in:
jahongireshonqulov
121
lib/core/theme/app_text_styles.dart
Normal file
121
lib/core/theme/app_text_styles.dart
Normal file
@@ -0,0 +1,121 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'colors/app_colors.dart';
|
||||
|
||||
class AppTextStyles {
|
||||
AppTextStyles._();
|
||||
|
||||
static const profileCategory = TextStyle(
|
||||
color: LightThemeColors.textColor,
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w500,
|
||||
);
|
||||
static const titleBig = TextStyle(
|
||||
color: LightThemeColors.textColor,
|
||||
fontSize: 24,
|
||||
fontWeight: FontWeight.w700,
|
||||
);
|
||||
static const authTitle = TextStyle(
|
||||
color: LightThemeColors.textColor,
|
||||
fontSize: 20,
|
||||
fontWeight: FontWeight.w700,
|
||||
);
|
||||
static const timer = TextStyle(
|
||||
color: ThemeColors.timerRed,
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w400,
|
||||
);
|
||||
static const categoryName = TextStyle(
|
||||
color: LightThemeColors.textColor,
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
height: 1,
|
||||
letterSpacing: 0,
|
||||
);
|
||||
static const bigTitle = TextStyle(
|
||||
color: LightThemeColors.textColor,
|
||||
fontSize: 20,
|
||||
fontWeight: FontWeight.w600,
|
||||
);
|
||||
static const orderTimer = TextStyle(
|
||||
color: ThemeColors.timerRed,
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w400,
|
||||
);
|
||||
static const timerStyle = TextStyle(
|
||||
color: ThemeColors.timerRed,
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w400,
|
||||
);
|
||||
static const saleRed = TextStyle(
|
||||
color: ThemeColors.timerRed,
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w700,
|
||||
);
|
||||
static const timerDesc = TextStyle(
|
||||
color: ThemeColors.timerRed,
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w600,
|
||||
);
|
||||
static const statusText = TextStyle(
|
||||
color: LightThemeColors.buttonColorText,
|
||||
fontSize: 13,
|
||||
fontWeight: FontWeight.w600,
|
||||
);
|
||||
|
||||
static const language = TextStyle(
|
||||
color: LightThemeColors.textColor,
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w400,
|
||||
);
|
||||
static const languageBig = TextStyle(
|
||||
color: LightThemeColors.white,
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w500,
|
||||
letterSpacing: 0,
|
||||
);
|
||||
|
||||
static const authDesc = TextStyle(
|
||||
color: LightThemeColors.secondaryText,
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w400,
|
||||
);
|
||||
static const timerBlue = TextStyle(
|
||||
color: LightThemeColors.primaryColor,
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
);
|
||||
static const orderListTitle = TextStyle(
|
||||
color: LightThemeColors.black40Transparent,
|
||||
fontSize: 10,
|
||||
fontWeight: FontWeight.w500,
|
||||
height: 1,
|
||||
);
|
||||
static const status = TextStyle(
|
||||
color: ThemeColors.green173text,
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w600,
|
||||
height: 1,
|
||||
letterSpacing: 0,
|
||||
);
|
||||
static const orderTitle = TextStyle(
|
||||
color: LightThemeColors.textColor,
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w700,
|
||||
);
|
||||
static const statusNumber = TextStyle(
|
||||
color: LightThemeColors.statusNumber,
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w400,
|
||||
);
|
||||
static const statusDesc = TextStyle(
|
||||
color: LightThemeColors.textColor,
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w600,
|
||||
);
|
||||
static const secondaryText14 = TextStyle(
|
||||
color: LightThemeColors.lightSecondary,
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
);
|
||||
}
|
||||
14
lib/core/theme/app_theme.dart
Normal file
14
lib/core/theme/app_theme.dart
Normal file
@@ -0,0 +1,14 @@
|
||||
import 'package:cargocalculaterapp/core/theme/theme_data.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
enum LightThemes { violetTheme }
|
||||
|
||||
enum DarkThemes { violetTheme }
|
||||
|
||||
Map<LightThemes, ThemeData> lightThemes = {
|
||||
LightThemes.violetTheme: lightTheme,
|
||||
};
|
||||
|
||||
Map<DarkThemes, ThemeData> darkThemes = {
|
||||
DarkThemes.violetTheme: darkTheme,
|
||||
};
|
||||
273
lib/core/theme/colors/app_colors.dart
Normal file
273
lib/core/theme/colors/app_colors.dart
Normal file
@@ -0,0 +1,273 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class ThemeColors {
|
||||
static const timerRed = Color(0xFFCF0000);
|
||||
static const successInputSMS = Color(0xFF36B82C);
|
||||
static const warningSurface = Color(0xFFFFEFE4);
|
||||
static const green173Light = Color(0xFFC7FCF6);
|
||||
static const green191Light = Color(0xFFE9FBFF);
|
||||
static const warning = Color(0xFFEE5800);
|
||||
static const green173text = Color(0xFF02685E);
|
||||
static const green191text = Color(0xFF00668F);
|
||||
}
|
||||
|
||||
class LightThemeColors extends ThemeColors {
|
||||
static const dividerColor = Color(0x0dFFFFFF);
|
||||
static const accentColor = Color(0xFF4275ba); // Neon Yellow
|
||||
static const darkBackground = Color(0xFF171717); // Dark Grey
|
||||
static const grey = Color(0xFF242424); // Grey
|
||||
static const midGrey = Color(0xFF474747); // Mid Grey
|
||||
static const lightGrey = Color(0xFF747474); // Light Grey
|
||||
static const white = Color(0xFFffffff);
|
||||
static const white60Transparent = Color(0x99FFFFFF);
|
||||
static const white30Transparent = Color(0x4dFFFFFF);
|
||||
static const white10Transparent = Color(0x1aFFFFFF);
|
||||
static const white20Transparent = Color(0x33FFFFFF);
|
||||
static const white40Transparent = Color(0x66FFFFFF);
|
||||
static const errorColor = Color(0xFFCF0000);
|
||||
|
||||
///shimmer
|
||||
static const backgroundGray = Color(0x80FFFFFF);
|
||||
static const shimmerHighlight = Color(0xffffffff);
|
||||
static const statusNumber = Color(0xff495057);
|
||||
|
||||
///new colors
|
||||
static const primaryColor = Color(0xff0074B0);
|
||||
static const textColor = Color(0xFF0C0C0C);
|
||||
static const secondaryText = Color(0xFF85938E);
|
||||
static const scaffoldBackgroundColor = Color(0xFFffffff);
|
||||
static const borderColor = Color(0xFF707479);
|
||||
static const edittextBackground = Color(0xFFF8FBFC);
|
||||
static const buttonColorText = Color(0xffffffff);
|
||||
static const disabledColor = Color(0x331783B2);
|
||||
static const iconBackground = Color(0xffE3F3F6);
|
||||
static const lightSecondary = Color(0xff858D93);
|
||||
static const grayBackground = Color(0xffF8FBFC);
|
||||
static const statusBackground = Color(0xffffffff);
|
||||
static const lightBorder = Color(0xffE3E3E3);
|
||||
static const black40Transparent = Color(0x66000000);
|
||||
static const statusIconBackground = Color(0xffF1F3F5);
|
||||
}
|
||||
|
||||
class DarkThemeColors {
|
||||
static const dividerColor = Color(0x0dFFFFFF);
|
||||
static const accentColor = Color(0xFF4275ba); // Neon Yellow
|
||||
static const darkBackground = Color(0xFF171717); // Dark Grey
|
||||
static const grey = Color(0xFF242424); // Grey
|
||||
static const midGrey = Color(0xFF474747); // Mid Grey
|
||||
static const lightGrey = Color(0xFF747474); // Light Grey
|
||||
static const white = Colors.white;
|
||||
static const white60Transparent = Color(0x99FFFFFF);
|
||||
static const white30Transparent = Color(0x4dFFFFFF);
|
||||
static const white10Transparent = Color(0x1aFFFFFF);
|
||||
static const errorColor = Color(0xFFCF0000);
|
||||
|
||||
///new colors
|
||||
static const primaryColor = Color(0xff1783B2);
|
||||
static const textColor = Color(0xFFFFFFFF);
|
||||
static const secondaryText = Color(0xFFC7C7C7);
|
||||
static const scaffoldBackgroundColor = Color(0xFF171717);
|
||||
static const borderColor = Color(0xFF707479);
|
||||
static const edittextBackground = Color(0xFF000000);
|
||||
static const buttonColorText = Color(0xffffffff);
|
||||
static const disabledColor = Color(0x331783B2);
|
||||
static const iconBackground = Color(0xff1A272D);
|
||||
static const lightSecondary = Color(0xffc7c7c7);
|
||||
static const grayBackground = Color(0xff000000);
|
||||
static const statusBackground = Color(0xff1A272D);
|
||||
static const lightBorder = Color(0xff252525);
|
||||
static const statusIconBackground = Color(0xff000000);
|
||||
}
|
||||
|
||||
@immutable
|
||||
class AppThemeColors extends ThemeExtension<AppThemeColors> {
|
||||
final Color scaffoldBackgroundColor;
|
||||
final Color textColor;
|
||||
final Color dividerColor;
|
||||
final Color accentColor;
|
||||
final Color darkBackground;
|
||||
final Color grey;
|
||||
final Color midGrey;
|
||||
final Color lightGrey;
|
||||
final Color white;
|
||||
final Color white60Transparent;
|
||||
final Color white30Transparent;
|
||||
final Color white10Transparent;
|
||||
final Color buttonColorText;
|
||||
|
||||
///newcolors
|
||||
final Color primaryColor;
|
||||
final Color secondaryText;
|
||||
final Color borderColor;
|
||||
final Color edittextBackground;
|
||||
final Color iconBackground;
|
||||
final Color lightSecondary;
|
||||
final Color grayBackground;
|
||||
final Color statusBackground;
|
||||
final Color lightBorder;
|
||||
final Color statusIconBackground;
|
||||
|
||||
const AppThemeColors({
|
||||
required this.scaffoldBackgroundColor,
|
||||
required this.textColor,
|
||||
required this.dividerColor,
|
||||
required this.accentColor,
|
||||
required this.darkBackground,
|
||||
required this.grey,
|
||||
required this.midGrey,
|
||||
required this.lightGrey,
|
||||
required this.white,
|
||||
required this.white60Transparent,
|
||||
required this.white30Transparent,
|
||||
required this.white10Transparent,
|
||||
required this.buttonColorText,
|
||||
required this.primaryColor,
|
||||
required this.secondaryText,
|
||||
required this.borderColor,
|
||||
required this.edittextBackground,
|
||||
required this.iconBackground,
|
||||
required this.lightSecondary,
|
||||
required this.grayBackground,
|
||||
required this.statusBackground,
|
||||
required this.lightBorder,
|
||||
required this.statusIconBackground,
|
||||
});
|
||||
|
||||
@override
|
||||
ThemeExtension<AppThemeColors> copyWith({
|
||||
Color? scaffoldBackgroundColor,
|
||||
Color? textColor,
|
||||
Color? dividerColor,
|
||||
Color? accentColor,
|
||||
Color? darkBackground,
|
||||
Color? grey,
|
||||
Color? midGrey,
|
||||
Color? lightGrey,
|
||||
Color? white,
|
||||
Color? white60Transparent,
|
||||
Color? white30Transparent,
|
||||
Color? white10Transparent,
|
||||
Color? buttonColorText,
|
||||
Color? primaryColor,
|
||||
Color? secondaryText,
|
||||
Color? borderColor,
|
||||
Color? edittextBackground,
|
||||
Color? iconBackground,
|
||||
Color? lightSecondary,
|
||||
Color? grayBackground,
|
||||
Color? statusBackground,
|
||||
Color? lightBorder,
|
||||
Color? statusIconBackground,
|
||||
}) {
|
||||
return AppThemeColors(
|
||||
scaffoldBackgroundColor:
|
||||
scaffoldBackgroundColor ?? this.scaffoldBackgroundColor,
|
||||
textColor: textColor ?? this.textColor,
|
||||
dividerColor: dividerColor ?? this.dividerColor,
|
||||
accentColor: accentColor ?? this.accentColor,
|
||||
darkBackground: darkBackground ?? this.darkBackground,
|
||||
grey: grey ?? this.grey,
|
||||
midGrey: midGrey ?? this.midGrey,
|
||||
lightGrey: lightGrey ?? this.lightGrey,
|
||||
white: white ?? this.white,
|
||||
white60Transparent: white60Transparent ?? this.white60Transparent,
|
||||
white30Transparent: white30Transparent ?? this.white30Transparent,
|
||||
white10Transparent: white10Transparent ?? this.white10Transparent,
|
||||
buttonColorText: buttonColorText ?? this.buttonColorText,
|
||||
primaryColor: primaryColor ?? this.primaryColor,
|
||||
secondaryText: secondaryText ?? this.secondaryText,
|
||||
borderColor: borderColor ?? this.borderColor,
|
||||
edittextBackground: edittextBackground ?? this.edittextBackground,
|
||||
iconBackground: iconBackground ?? this.iconBackground,
|
||||
lightSecondary: lightSecondary ?? this.lightSecondary,
|
||||
grayBackground: grayBackground ?? this.grayBackground,
|
||||
statusBackground: statusBackground ?? this.statusBackground,
|
||||
lightBorder: lightBorder ?? this.lightBorder,
|
||||
statusIconBackground: statusIconBackground ?? this.statusIconBackground,
|
||||
);
|
||||
}
|
||||
|
||||
@override
|
||||
AppThemeColors lerp(ThemeExtension<AppThemeColors>? other, double t) {
|
||||
if (other is! AppThemeColors) return this;
|
||||
|
||||
return AppThemeColors(
|
||||
scaffoldBackgroundColor: Color.lerp(scaffoldBackgroundColor, other.scaffoldBackgroundColor, t)!,
|
||||
textColor: Color.lerp(textColor, other.textColor, t)!,
|
||||
dividerColor: Color.lerp(dividerColor, other.dividerColor, t)!,
|
||||
accentColor: Color.lerp(accentColor, other.accentColor, t)!,
|
||||
darkBackground: Color.lerp(darkBackground, other.darkBackground, t)!,
|
||||
grey: Color.lerp(grey, other.grey, t)!,
|
||||
midGrey: Color.lerp(midGrey, other.midGrey, t)!,
|
||||
lightGrey: Color.lerp(lightGrey, other.lightGrey, t)!,
|
||||
white: Color.lerp(white, other.white, t)!,
|
||||
white60Transparent: Color.lerp(white60Transparent, other.white60Transparent, t)!,
|
||||
white30Transparent: Color.lerp(white30Transparent, other.white30Transparent, t)!,
|
||||
white10Transparent: Color.lerp(white10Transparent, other.white10Transparent, t)!,
|
||||
buttonColorText: Color.lerp(buttonColorText, other.buttonColorText, t)!,
|
||||
primaryColor: Color.lerp(primaryColor, other.primaryColor, t)!,
|
||||
secondaryText: Color.lerp(secondaryText, other.secondaryText, t)!,
|
||||
borderColor: Color.lerp(borderColor, other.borderColor, t)!,
|
||||
edittextBackground: Color.lerp(edittextBackground, other.edittextBackground, t)!,
|
||||
iconBackground: Color.lerp(iconBackground, other.iconBackground, t)!,
|
||||
lightSecondary: Color.lerp(lightSecondary, other.lightSecondary, t)!,
|
||||
grayBackground: Color.lerp(grayBackground, other.grayBackground, t)!,
|
||||
statusBackground: Color.lerp(statusBackground, other.statusBackground, t)!,
|
||||
lightBorder: Color.lerp(lightBorder, other.lightBorder, t)!,
|
||||
statusIconBackground: Color.lerp(statusIconBackground, other.statusIconBackground, t)!,
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
static get light => const AppThemeColors(
|
||||
scaffoldBackgroundColor: LightThemeColors.scaffoldBackgroundColor,
|
||||
textColor: LightThemeColors.textColor,
|
||||
dividerColor: LightThemeColors.dividerColor,
|
||||
accentColor: LightThemeColors.accentColor,
|
||||
darkBackground: LightThemeColors.darkBackground,
|
||||
grey: LightThemeColors.grey,
|
||||
midGrey: LightThemeColors.midGrey,
|
||||
lightGrey: LightThemeColors.lightGrey,
|
||||
white: LightThemeColors.white,
|
||||
white60Transparent: LightThemeColors.white60Transparent,
|
||||
white30Transparent: LightThemeColors.white30Transparent,
|
||||
white10Transparent: LightThemeColors.white10Transparent,
|
||||
buttonColorText: LightThemeColors.buttonColorText,
|
||||
primaryColor: LightThemeColors.primaryColor,
|
||||
secondaryText: LightThemeColors.secondaryText,
|
||||
borderColor: LightThemeColors.borderColor,
|
||||
edittextBackground: LightThemeColors.edittextBackground,
|
||||
iconBackground: LightThemeColors.iconBackground,
|
||||
lightSecondary: LightThemeColors.lightSecondary,
|
||||
grayBackground: LightThemeColors.grayBackground,
|
||||
statusBackground: LightThemeColors.statusBackground,
|
||||
lightBorder: LightThemeColors.lightBorder,
|
||||
statusIconBackground: LightThemeColors.statusIconBackground,
|
||||
);
|
||||
|
||||
static get dark => const AppThemeColors(
|
||||
scaffoldBackgroundColor: DarkThemeColors.scaffoldBackgroundColor,
|
||||
textColor: DarkThemeColors.textColor,
|
||||
dividerColor: DarkThemeColors.dividerColor,
|
||||
accentColor: DarkThemeColors.accentColor,
|
||||
darkBackground: DarkThemeColors.darkBackground,
|
||||
grey: DarkThemeColors.grey,
|
||||
midGrey: DarkThemeColors.midGrey,
|
||||
lightGrey: DarkThemeColors.lightGrey,
|
||||
white: DarkThemeColors.white,
|
||||
white60Transparent: DarkThemeColors.white60Transparent,
|
||||
white30Transparent: DarkThemeColors.white30Transparent,
|
||||
white10Transparent: DarkThemeColors.white10Transparent,
|
||||
buttonColorText: DarkThemeColors.buttonColorText,
|
||||
primaryColor: DarkThemeColors.primaryColor,
|
||||
secondaryText: DarkThemeColors.secondaryText,
|
||||
borderColor: DarkThemeColors.borderColor,
|
||||
edittextBackground: DarkThemeColors.edittextBackground,
|
||||
iconBackground: DarkThemeColors.iconBackground,
|
||||
lightSecondary: DarkThemeColors.lightSecondary,
|
||||
grayBackground: DarkThemeColors.grayBackground,
|
||||
statusBackground: DarkThemeColors.statusBackground,
|
||||
lightBorder: DarkThemeColors.lightBorder,
|
||||
statusIconBackground: DarkThemeColors.statusIconBackground,
|
||||
);
|
||||
}
|
||||
434
lib/core/theme/theme_data.dart
Normal file
434
lib/core/theme/theme_data.dart
Normal file
@@ -0,0 +1,434 @@
|
||||
import 'package:cargocalculaterapp/core/theme/theme_text_style.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'colors/app_colors.dart';
|
||||
|
||||
final appTheme = ThemeData(
|
||||
fontFamily: "Inter",
|
||||
extensions: <ThemeExtension<dynamic>>[
|
||||
AppThemeColors.light,
|
||||
AppThemeColors.dark,
|
||||
ThemeTextStyles.light,
|
||||
ThemeTextStyles.dark,
|
||||
],
|
||||
useMaterial3: true,
|
||||
applyElevationOverlayColor: true,
|
||||
// disabledColor: ThemeColors.disabledColor,
|
||||
// splashColor: ThemeColors.primary1Transparent,
|
||||
// focusColor: ThemeColors.primaryColor,
|
||||
// colorSchemeSeed: ThemeColors.primaryColor,
|
||||
visualDensity: VisualDensity.standard,
|
||||
materialTapTargetSize: MaterialTapTargetSize.padded,
|
||||
pageTransitionsTheme: const PageTransitionsTheme(
|
||||
builders: {
|
||||
TargetPlatform.android: CupertinoPageTransitionsBuilder(),
|
||||
TargetPlatform.iOS: CupertinoPageTransitionsBuilder(),
|
||||
},
|
||||
),
|
||||
// textButtonTheme: TextButtonThemeData(
|
||||
// style: ButtonStyle(
|
||||
// padding: MaterialStateProperty.all<EdgeInsetsGeometry>(
|
||||
// EdgeInsets.zero,
|
||||
// ),
|
||||
// ),
|
||||
// ),
|
||||
dividerTheme: const DividerThemeData(thickness: 1),
|
||||
);
|
||||
|
||||
final lightTheme = appTheme.copyWith(
|
||||
extensions: <ThemeExtension<dynamic>>[
|
||||
AppThemeColors.light,
|
||||
ThemeTextStyles.light,
|
||||
],
|
||||
scaffoldBackgroundColor: LightThemeColors.scaffoldBackgroundColor,
|
||||
brightness: Brightness.light,
|
||||
dividerTheme: appTheme.dividerTheme.copyWith(
|
||||
color: LightThemeColors.dividerColor,
|
||||
),
|
||||
colorScheme: const ColorScheme.light(
|
||||
secondary: LightThemeColors.white,
|
||||
primary: LightThemeColors.accentColor,
|
||||
),
|
||||
// listTileTheme: const ListTileThemeData(
|
||||
// minVerticalPadding: 14,
|
||||
// minLeadingWidth: 16,
|
||||
// horizontalTitleGap: 12,
|
||||
// tileColor: LightThemeColors.textFieldBackGround,
|
||||
// selectedColor: LightThemeColors.backgroundColor,
|
||||
// selectedTileColor: LightThemeColors.backgroundColor,
|
||||
// shape: RoundedRectangleBorder(
|
||||
// borderRadius: AppUtils.kBorderRadius4,
|
||||
// ),
|
||||
// ),
|
||||
tabBarTheme: TabBarThemeData(
|
||||
labelColor: LightThemeColors.accentColor,
|
||||
unselectedLabelColor: LightThemeColors.grey,
|
||||
labelPadding: EdgeInsets.zero,
|
||||
labelStyle: const TextStyle(fontSize: 11, fontWeight: FontWeight.w400),
|
||||
unselectedLabelStyle: const TextStyle(
|
||||
fontSize: 11,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
indicator: const UnderlineTabIndicator(
|
||||
borderSide: BorderSide(color: LightThemeColors.accentColor, width: 2.0),
|
||||
),
|
||||
overlayColor: WidgetStateProperty.resolveWith<Color>((states) {
|
||||
return LightThemeColors.lightGrey;
|
||||
}),
|
||||
),
|
||||
appBarTheme: const AppBarTheme(
|
||||
elevation: 0,
|
||||
centerTitle: true,
|
||||
scrolledUnderElevation: 0,
|
||||
foregroundColor: LightThemeColors.scaffoldBackgroundColor,
|
||||
backgroundColor: LightThemeColors.white,
|
||||
surfaceTintColor: LightThemeColors.scaffoldBackgroundColor,
|
||||
shadowColor: Colors.black,
|
||||
titleTextStyle: TextStyle(
|
||||
fontSize: 20,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: LightThemeColors.textColor,
|
||||
),
|
||||
toolbarHeight: 56,
|
||||
iconTheme: IconThemeData(color: LightThemeColors.primaryColor),
|
||||
),
|
||||
inputDecorationTheme: const InputDecorationTheme(
|
||||
contentPadding: EdgeInsets.all(16),
|
||||
alignLabelWithHint: true,
|
||||
labelStyle: TextStyle(
|
||||
color: LightThemeColors.white,
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
hintStyle: TextStyle(
|
||||
color: LightThemeColors.secondaryText,
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
errorBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(16)),
|
||||
borderSide: BorderSide(color: LightThemeColors.errorColor),
|
||||
),
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(16)),
|
||||
borderSide: BorderSide(color: LightThemeColors.borderColor),
|
||||
),
|
||||
enabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(16)),
|
||||
borderSide: BorderSide(color: LightThemeColors.borderColor),
|
||||
),
|
||||
focusedBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(16)),
|
||||
borderSide: BorderSide(color: LightThemeColors.primaryColor),
|
||||
),
|
||||
disabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(16)),
|
||||
borderSide: BorderSide(color: LightThemeColors.white10Transparent),
|
||||
),
|
||||
focusedErrorBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(16)),
|
||||
borderSide: BorderSide(color: LightThemeColors.errorColor),
|
||||
),
|
||||
filled: true,
|
||||
isDense: true,
|
||||
fillColor: LightThemeColors.edittextBackground,
|
||||
floatingLabelAlignment: FloatingLabelAlignment.start,
|
||||
floatingLabelBehavior: FloatingLabelBehavior.always,
|
||||
),
|
||||
elevatedButtonTheme: ElevatedButtonThemeData(
|
||||
style: ButtonStyle(
|
||||
overlayColor: WidgetStateProperty.resolveWith<Color?>((
|
||||
Set<WidgetState> states,
|
||||
) {
|
||||
if (states.contains(WidgetState.hovered)) {
|
||||
return LightThemeColors.errorColor;
|
||||
}
|
||||
return null;
|
||||
}),
|
||||
elevation: WidgetStateProperty.all<double>(0),
|
||||
textStyle: WidgetStateProperty.all<TextStyle>(
|
||||
const TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: LightThemeColors.textColor,
|
||||
),
|
||||
),
|
||||
foregroundColor: WidgetStateProperty.resolveWith<Color>((states) {
|
||||
if (states.contains(WidgetState.disabled)) {
|
||||
return LightThemeColors.white;
|
||||
} else {
|
||||
return LightThemeColors.white;
|
||||
}
|
||||
}),
|
||||
backgroundColor: WidgetStateProperty.resolveWith<Color>((states) {
|
||||
if (states.contains(WidgetState.disabled)) {
|
||||
return LightThemeColors.disabledColor;
|
||||
} else {
|
||||
return LightThemeColors.primaryColor;
|
||||
}
|
||||
}),
|
||||
maximumSize: WidgetStateProperty.all<Size>(
|
||||
const Size(double.infinity, 56),
|
||||
),
|
||||
minimumSize: WidgetStateProperty.all<Size>(
|
||||
const Size(double.infinity, 56),
|
||||
),
|
||||
shape: WidgetStateProperty.all<RoundedRectangleBorder>(
|
||||
const RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(24)),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
bottomNavigationBarTheme: const BottomNavigationBarThemeData(
|
||||
backgroundColor: LightThemeColors.scaffoldBackgroundColor,
|
||||
type: BottomNavigationBarType.fixed,
|
||||
showSelectedLabels: true,
|
||||
selectedLabelStyle: TextStyle(fontSize: 12, fontWeight: FontWeight.w500),
|
||||
unselectedLabelStyle: TextStyle(fontSize: 12, fontWeight: FontWeight.w500),
|
||||
unselectedItemColor: LightThemeColors.lightSecondary,
|
||||
selectedItemColor: LightThemeColors.primaryColor,
|
||||
selectedIconTheme: IconThemeData(size: 25),
|
||||
unselectedIconTheme: IconThemeData(size: 25),
|
||||
elevation: 2,
|
||||
),
|
||||
textButtonTheme: TextButtonThemeData(
|
||||
style: ButtonStyle(
|
||||
padding: WidgetStateProperty.all(
|
||||
const EdgeInsets.symmetric(horizontal: 8, vertical: 8),
|
||||
),
|
||||
tapTargetSize: MaterialTapTargetSize.shrinkWrap,
|
||||
elevation: WidgetStateProperty.all<double>(2),
|
||||
foregroundColor: WidgetStateProperty.resolveWith<Color>((states) {
|
||||
return LightThemeColors.scaffoldBackgroundColor;
|
||||
}),
|
||||
backgroundColor: WidgetStateProperty.resolveWith<Color>((states) {
|
||||
if (states.contains(WidgetState.disabled)) {
|
||||
return Colors.transparent;
|
||||
} else {
|
||||
return Colors.transparent;
|
||||
}
|
||||
}),
|
||||
maximumSize: WidgetStateProperty.all<Size>(
|
||||
const Size(double.infinity, double.infinity),
|
||||
),
|
||||
minimumSize: WidgetStateProperty.all<Size>(
|
||||
const Size(double.minPositive, double.minPositive),
|
||||
),
|
||||
shape: WidgetStateProperty.all<RoundedRectangleBorder>(
|
||||
const RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(4)),
|
||||
),
|
||||
),
|
||||
textStyle: WidgetStateProperty.all<TextStyle>(
|
||||
const TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: LightThemeColors.accentColor,
|
||||
),
|
||||
),
|
||||
// overlayColor: WidgetStateProperty.resolveWith<Color>((states) {
|
||||
// return LightThemeColors.lightGrey;
|
||||
// }),
|
||||
),
|
||||
),
|
||||
bottomSheetTheme: const BottomSheetThemeData(
|
||||
backgroundColor: Colors.transparent,
|
||||
// surfaceTintColor: Colors.transparent,
|
||||
modalBackgroundColor: Colors.transparent,
|
||||
modalElevation: 0,
|
||||
elevation: 0,
|
||||
),
|
||||
);
|
||||
|
||||
final darkTheme = appTheme.copyWith(
|
||||
extensions: <ThemeExtension<dynamic>>[
|
||||
AppThemeColors.dark,
|
||||
ThemeTextStyles.dark,
|
||||
],
|
||||
scaffoldBackgroundColor: DarkThemeColors.scaffoldBackgroundColor,
|
||||
brightness: Brightness.dark,
|
||||
dividerTheme: appTheme.dividerTheme.copyWith(
|
||||
color: DarkThemeColors.dividerColor,
|
||||
),
|
||||
colorScheme: const ColorScheme.dark(secondary: Colors.white),
|
||||
tabBarTheme: TabBarThemeData(
|
||||
labelColor: DarkThemeColors.accentColor,
|
||||
unselectedLabelColor: DarkThemeColors.grey,
|
||||
labelPadding: EdgeInsets.zero,
|
||||
labelStyle: const TextStyle(fontSize: 11, fontWeight: FontWeight.w400),
|
||||
unselectedLabelStyle: const TextStyle(
|
||||
fontSize: 11,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
indicator: const UnderlineTabIndicator(
|
||||
borderSide: BorderSide(color: DarkThemeColors.accentColor, width: 2.0),
|
||||
),
|
||||
overlayColor: WidgetStateProperty.resolveWith<Color>((states) {
|
||||
return DarkThemeColors.lightGrey;
|
||||
}),
|
||||
),
|
||||
appBarTheme: const AppBarTheme(
|
||||
elevation: 0,
|
||||
centerTitle: true,
|
||||
scrolledUnderElevation: 0,
|
||||
foregroundColor: DarkThemeColors.scaffoldBackgroundColor,
|
||||
backgroundColor: DarkThemeColors.scaffoldBackgroundColor,
|
||||
surfaceTintColor: DarkThemeColors.scaffoldBackgroundColor,
|
||||
shadowColor: Colors.black,
|
||||
titleTextStyle: TextStyle(
|
||||
fontSize: 20,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: DarkThemeColors.textColor,
|
||||
),
|
||||
toolbarHeight: 56,
|
||||
iconTheme: IconThemeData(color: DarkThemeColors.primaryColor),
|
||||
),
|
||||
inputDecorationTheme: const InputDecorationTheme(
|
||||
alignLabelWithHint: true,
|
||||
contentPadding: EdgeInsets.all(16),
|
||||
labelStyle: TextStyle(
|
||||
color: DarkThemeColors.textColor,
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
hintStyle: TextStyle(
|
||||
color: DarkThemeColors.secondaryText,
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
|
||||
errorBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(16)),
|
||||
borderSide: BorderSide(color: DarkThemeColors.errorColor),
|
||||
),
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(16)),
|
||||
borderSide: BorderSide(color: DarkThemeColors.borderColor),
|
||||
),
|
||||
enabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(16)),
|
||||
borderSide: BorderSide(color: DarkThemeColors.borderColor),
|
||||
),
|
||||
focusedBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(16)),
|
||||
borderSide: BorderSide(color: DarkThemeColors.primaryColor),
|
||||
),
|
||||
disabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(16)),
|
||||
borderSide: BorderSide(color: DarkThemeColors.white10Transparent),
|
||||
),
|
||||
focusedErrorBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(16)),
|
||||
borderSide: BorderSide(color: DarkThemeColors.errorColor),
|
||||
),
|
||||
filled: true,
|
||||
isDense: true,
|
||||
fillColor: DarkThemeColors.edittextBackground,
|
||||
floatingLabelAlignment: FloatingLabelAlignment.start,
|
||||
floatingLabelBehavior: FloatingLabelBehavior.always,
|
||||
),
|
||||
elevatedButtonTheme: ElevatedButtonThemeData(
|
||||
style: ButtonStyle(
|
||||
overlayColor: WidgetStateProperty.resolveWith<Color?>((
|
||||
Set<WidgetState> states,
|
||||
) {
|
||||
if (states.contains(WidgetState.hovered)) {
|
||||
return DarkThemeColors.errorColor;
|
||||
}
|
||||
return null;
|
||||
}),
|
||||
elevation: WidgetStateProperty.all<double>(0),
|
||||
textStyle: WidgetStateProperty.all<TextStyle>(
|
||||
const TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w700,
|
||||
color: DarkThemeColors.buttonColorText,
|
||||
),
|
||||
),
|
||||
foregroundColor: WidgetStateProperty.resolveWith<Color>((states) {
|
||||
if (states.contains(WidgetState.disabled)) {
|
||||
return DarkThemeColors.white60Transparent;
|
||||
} else {
|
||||
return DarkThemeColors.buttonColorText;
|
||||
}
|
||||
}),
|
||||
backgroundColor: WidgetStateProperty.resolveWith<Color>((states) {
|
||||
if (states.contains(WidgetState.disabled)) {
|
||||
return DarkThemeColors.disabledColor;
|
||||
} else {
|
||||
return DarkThemeColors.primaryColor;
|
||||
}
|
||||
}),
|
||||
maximumSize: WidgetStateProperty.all<Size>(
|
||||
const Size(double.infinity, 56),
|
||||
),
|
||||
minimumSize: WidgetStateProperty.all<Size>(
|
||||
const Size(double.infinity, 56),
|
||||
),
|
||||
shape: WidgetStateProperty.all<RoundedRectangleBorder>(
|
||||
const RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(24)),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
bottomNavigationBarTheme: const BottomNavigationBarThemeData(
|
||||
backgroundColor: DarkThemeColors.scaffoldBackgroundColor,
|
||||
type: BottomNavigationBarType.fixed,
|
||||
showSelectedLabels: true,
|
||||
selectedLabelStyle: TextStyle(fontSize: 12, fontWeight: FontWeight.w500),
|
||||
unselectedLabelStyle: TextStyle(fontSize: 12, fontWeight: FontWeight.w500),
|
||||
unselectedItemColor: DarkThemeColors.lightSecondary,
|
||||
selectedItemColor: DarkThemeColors.primaryColor,
|
||||
selectedIconTheme: IconThemeData(size: 25),
|
||||
unselectedIconTheme: IconThemeData(size: 25),
|
||||
elevation: 2,
|
||||
),
|
||||
textButtonTheme: TextButtonThemeData(
|
||||
style: ButtonStyle(
|
||||
padding: WidgetStateProperty.all(
|
||||
const EdgeInsets.symmetric(horizontal: 8, vertical: 8),
|
||||
),
|
||||
tapTargetSize: MaterialTapTargetSize.shrinkWrap,
|
||||
elevation: WidgetStateProperty.all<double>(2),
|
||||
foregroundColor: WidgetStateProperty.resolveWith<Color>((states) {
|
||||
return DarkThemeColors.scaffoldBackgroundColor;
|
||||
}),
|
||||
backgroundColor: WidgetStateProperty.resolveWith<Color>((states) {
|
||||
if (states.contains(WidgetState.disabled)) {
|
||||
return Colors.transparent;
|
||||
} else {
|
||||
return Colors.transparent;
|
||||
}
|
||||
}),
|
||||
maximumSize: WidgetStateProperty.all<Size>(
|
||||
const Size(double.infinity, double.infinity),
|
||||
),
|
||||
minimumSize: WidgetStateProperty.all<Size>(
|
||||
const Size(double.minPositive, double.minPositive),
|
||||
),
|
||||
shape: WidgetStateProperty.all<RoundedRectangleBorder>(
|
||||
const RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(4)),
|
||||
),
|
||||
),
|
||||
textStyle: WidgetStateProperty.all<TextStyle>(
|
||||
const TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: DarkThemeColors.accentColor,
|
||||
),
|
||||
),
|
||||
// overlayColor: WidgetStateProperty.resolveWith<Color>((states) {
|
||||
// return DarkThemeColors.lightGrey;
|
||||
// }),
|
||||
),
|
||||
),
|
||||
bottomSheetTheme: const BottomSheetThemeData(
|
||||
backgroundColor: Colors.transparent,
|
||||
// surfaceTintColor: Colors.transparent,
|
||||
modalBackgroundColor: Colors.transparent,
|
||||
modalElevation: 0,
|
||||
elevation: 0,
|
||||
),
|
||||
);
|
||||
118
lib/core/theme/theme_text_style.dart
Normal file
118
lib/core/theme/theme_text_style.dart
Normal file
@@ -0,0 +1,118 @@
|
||||
import 'package:cargocalculaterapp/core/theme/colors/app_colors.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'app_text_styles.dart';
|
||||
|
||||
@immutable
|
||||
class ThemeTextStyles extends ThemeExtension<ThemeTextStyles> {
|
||||
final TextStyle profileCategory;
|
||||
final TextStyle titleBig;
|
||||
final TextStyle authTitle;
|
||||
final TextStyle categoryName;
|
||||
final TextStyle bigTitle;
|
||||
final TextStyle statusText;
|
||||
final TextStyle authDesc;
|
||||
final TextStyle orderListTitle;
|
||||
final TextStyle orderTitle;
|
||||
final TextStyle statusNumber;
|
||||
final TextStyle statusDesc;
|
||||
final TextStyle secondaryText14;
|
||||
|
||||
@override
|
||||
ThemeExtension<ThemeTextStyles> copyWith({
|
||||
TextStyle? profileCategory,
|
||||
TextStyle? titleBig,
|
||||
TextStyle? authTitle,
|
||||
TextStyle? categoryName,
|
||||
TextStyle? bigTitle,
|
||||
TextStyle? statusText,
|
||||
TextStyle? authDesc,
|
||||
TextStyle? orderListTitle,
|
||||
TextStyle? orderTitle,
|
||||
TextStyle? statusNumber,
|
||||
TextStyle? statusDesc,
|
||||
TextStyle? secondaryText14,
|
||||
}) {
|
||||
return ThemeTextStyles(
|
||||
profileCategory: profileCategory ?? this.profileCategory,
|
||||
titleBig: titleBig ?? this.titleBig,
|
||||
authTitle: authTitle ?? this.authTitle,
|
||||
categoryName: categoryName ?? this.categoryName,
|
||||
bigTitle: bigTitle ?? this.bigTitle,
|
||||
statusText: statusText ?? this.statusText,
|
||||
authDesc: authDesc ?? this.authDesc,
|
||||
orderListTitle: orderListTitle ?? this.orderListTitle,
|
||||
orderTitle: orderTitle ?? this.orderTitle,
|
||||
statusNumber: statusNumber ?? this.statusNumber,
|
||||
statusDesc: statusDesc ?? this.statusDesc,
|
||||
secondaryText14: secondaryText14 ?? this.secondaryText14,
|
||||
);
|
||||
}
|
||||
|
||||
const ThemeTextStyles({
|
||||
required this.profileCategory,
|
||||
required this.titleBig,
|
||||
required this.authTitle,
|
||||
required this.categoryName,
|
||||
required this.bigTitle,
|
||||
required this.statusText,
|
||||
required this.authDesc,
|
||||
required this.orderListTitle,
|
||||
required this.orderTitle,
|
||||
required this.statusNumber,
|
||||
required this.statusDesc,
|
||||
required this.secondaryText14,
|
||||
});
|
||||
|
||||
static get light => const ThemeTextStyles(
|
||||
profileCategory: AppTextStyles.profileCategory,
|
||||
titleBig: AppTextStyles.titleBig,
|
||||
authTitle: AppTextStyles.authTitle,
|
||||
categoryName: AppTextStyles.categoryName,
|
||||
bigTitle: AppTextStyles.bigTitle,
|
||||
statusText: AppTextStyles.statusText,
|
||||
authDesc: AppTextStyles.authDesc,
|
||||
orderListTitle: AppTextStyles.orderListTitle,
|
||||
orderTitle: AppTextStyles.orderTitle,
|
||||
statusNumber: AppTextStyles.statusNumber,
|
||||
statusDesc: AppTextStyles.statusDesc,
|
||||
secondaryText14: AppTextStyles.secondaryText14,
|
||||
);
|
||||
|
||||
static get dark => ThemeTextStyles(
|
||||
profileCategory: AppTextStyles.profileCategory.copyWith(
|
||||
color: DarkThemeColors.textColor,
|
||||
),
|
||||
titleBig: AppTextStyles.titleBig.copyWith(color: DarkThemeColors.textColor),
|
||||
authTitle: AppTextStyles.authTitle.copyWith(color: DarkThemeColors.textColor),
|
||||
categoryName: AppTextStyles.categoryName.copyWith(color: DarkThemeColors.textColor),
|
||||
bigTitle: AppTextStyles.bigTitle.copyWith(color: DarkThemeColors.textColor),
|
||||
statusText: AppTextStyles.statusText.copyWith(color: DarkThemeColors.buttonColorText),
|
||||
authDesc: AppTextStyles.authDesc.copyWith(color: DarkThemeColors.secondaryText),
|
||||
orderListTitle: AppTextStyles.orderListTitle.copyWith(color: DarkThemeColors.secondaryText),
|
||||
orderTitle: AppTextStyles.orderTitle.copyWith(color: DarkThemeColors.textColor),
|
||||
statusNumber: AppTextStyles.statusNumber.copyWith(color: DarkThemeColors.secondaryText),
|
||||
statusDesc: AppTextStyles.statusDesc.copyWith(color: DarkThemeColors.textColor),
|
||||
secondaryText14: AppTextStyles.secondaryText14.copyWith(color: DarkThemeColors.lightSecondary),
|
||||
);
|
||||
|
||||
@override
|
||||
ThemeTextStyles lerp(ThemeExtension<ThemeTextStyles>? other, double t) {
|
||||
if (other is! ThemeTextStyles) return this;
|
||||
|
||||
return ThemeTextStyles(
|
||||
profileCategory: TextStyle.lerp(profileCategory, other.profileCategory, t)!,
|
||||
titleBig: TextStyle.lerp(titleBig, other.titleBig, t)!,
|
||||
authTitle: TextStyle.lerp(authTitle, other.authTitle, t)!,
|
||||
categoryName: TextStyle.lerp(categoryName, other.categoryName, t)!,
|
||||
bigTitle: TextStyle.lerp(bigTitle, other.bigTitle, t)!,
|
||||
statusText: TextStyle.lerp(statusText, other.statusText, t)!,
|
||||
authDesc: TextStyle.lerp(authDesc, other.authDesc, t)!,
|
||||
orderListTitle: TextStyle.lerp(orderListTitle, other.orderListTitle, t)!,
|
||||
orderTitle: TextStyle.lerp(orderTitle, other.orderTitle, t)!,
|
||||
statusNumber: TextStyle.lerp(statusNumber, other.statusNumber, t)!,
|
||||
statusDesc: TextStyle.lerp(statusDesc, other.statusDesc, t)!,
|
||||
secondaryText14: TextStyle.lerp(secondaryText14, other.secondaryText14, t)!,
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user