Skip to content

Commit 380dee4

Browse files
committed
refactor: migrate theme to shared package
- Moved theme to shared package - Added spacing constants - Created theme customization
1 parent 9718541 commit 380dee4

File tree

7 files changed

+176
-16
lines changed

7 files changed

+176
-16
lines changed

lib/app/view/app.dart

Lines changed: 3 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,19 @@
33

44
import 'dart:async';
55
import 'package:firebase_dynamic_links/firebase_dynamic_links.dart'; // For dynamic links
6-
import 'package:flex_color_scheme/flex_color_scheme.dart';
6+
// Removed: import 'package:flex_color_scheme/flex_color_scheme.dart';
77
import 'package:flutter/material.dart';
88
import 'package:flutter_bloc/flutter_bloc.dart';
99
import 'package:go_router/go_router.dart';
10-
import 'package:google_fonts/google_fonts.dart';
10+
// Removed: import 'package:google_fonts/google_fonts.dart';
1111
import 'package:ht_authentication_repository/ht_authentication_repository.dart';
1212
import 'package:ht_headlines_repository/ht_headlines_repository.dart';
1313
import 'package:ht_kv_storage_service/ht_kv_storage_service.dart'; // Import storage service
1414
import 'package:ht_main/app/bloc/app_bloc.dart';
1515
import 'package:ht_main/authentication/bloc/authentication_bloc.dart'; // Import AuthBloc
1616
import 'package:ht_main/l10n/l10n.dart';
1717
import 'package:ht_main/router/router.dart';
18+
import 'package:ht_main/shared/theme/app_theme.dart'; // Import the new theme file
1819

1920
class App extends StatelessWidget {
2021
const App({
@@ -204,17 +205,3 @@ class _AppViewState extends State<_AppView> {
204205
);
205206
}
206207
}
207-
208-
ThemeData lightTheme() {
209-
return FlexThemeData.light(
210-
scheme: FlexScheme.material,
211-
fontFamily: GoogleFonts.notoSans().fontFamily,
212-
);
213-
}
214-
215-
ThemeData darkTheme() {
216-
return FlexThemeData.dark(
217-
scheme: FlexScheme.material,
218-
fontFamily: GoogleFonts.notoSans().fontFamily,
219-
);
220-
}

lib/shared/constants/app_spacing.dart

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
/// Defines standard spacing constants used throughout the application.
2+
///
3+
/// Consistent spacing is crucial for a clean and professional UI.
4+
/// Using these constants ensures uniformity and makes global
5+
/// adjustments easier.
6+
abstract final class AppSpacing {
7+
/// Extra small spacing value (e.g., 4.0).
8+
static const double xs = 4;
9+
10+
/// Small spacing value (e.g., 8.0).
11+
static const double sm = 8;
12+
13+
/// Medium spacing value (e.g., 12.0).
14+
static const double md = 12;
15+
16+
/// Large spacing value (e.g., 16.0).
17+
static const double lg = 16;
18+
19+
/// Extra large spacing value (e.g., 24.0).
20+
static const double xl = 24;
21+
22+
/// Extra extra large spacing value (e.g., 32.0).
23+
static const double xxl = 32;
24+
25+
// --- Padding Specific ---
26+
// While the above can be used for padding, specific names can
27+
// improve clarity.
28+
29+
/// Small padding value (equivalent to sm).
30+
static const double paddingSmall = sm;
31+
32+
/// Medium padding value (equivalent to md).
33+
static const double paddingMedium = md;
34+
35+
/// Large padding value (equivalent to lg).
36+
static const double paddingLarge = lg;
37+
38+
/// Extra large padding value (equivalent to xl).
39+
static const double paddingExtraLarge = xl;
40+
}

lib/shared/constants/constants.dart

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
/// Barrel file for shared constants.
2+
/// Exports application-wide constant definitions.
3+
library;
4+
5+
export 'app_spacing.dart';

lib/shared/shared.dart

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
/// Barrel file for the shared library.
2+
///
3+
/// Exports common constants, theme elements, and widgets used across
4+
/// the application to promote consistency and maintainability.
5+
library;
6+
7+
export 'constants/constants.dart';
8+
export 'theme/theme.dart';
9+
export 'widgets/widgets.dart';

lib/shared/theme/app_theme.dart

Lines changed: 107 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,107 @@
1+
//
2+
// ignore_for_file: lines_longer_than_80_chars
3+
4+
import 'package:flex_color_scheme/flex_color_scheme.dart';
5+
import 'package:flutter/material.dart';
6+
import 'package:google_fonts/google_fonts.dart';
7+
8+
// --- Common Sub-theme Settings ---
9+
// Defines customizations for various components, shared between light/dark themes.
10+
const FlexSubThemesData _commonSubThemesData = FlexSubThemesData(
11+
// --- Card Theme ---
12+
// Slightly rounded corners for cards (headline items)
13+
cardRadius: 8,
14+
// Use default elevation or specify if needed: cardElevation: 2.0,
15+
16+
// --- AppBar Theme ---
17+
// Example: Use scheme surface color for app bar (often less distracting)
18+
appBarBackgroundSchemeColor: SchemeColor.surface,
19+
// Or keep default: appBarBackgroundSchemeColor: SchemeColor.primary,
20+
// Example: Center title? appBarCenterTitle: true,
21+
22+
// --- Input Decorator (for Search TextField) ---
23+
// Example: Add a border radius
24+
inputDecoratorRadius: 8, // Corrected parameter name
25+
// Example: Use outline border (common modern style)
26+
inputDecoratorIsFilled: false, // Set to false if using outline border
27+
inputDecoratorBorderType: FlexInputBorderType.outline,
28+
29+
// Add other component themes as needed (Buttons, Dialogs, etc.)
30+
);
31+
32+
// Helper function to apply common text theme customizations
33+
TextTheme _customizeTextTheme(TextTheme baseTextTheme) {
34+
return baseTextTheme.copyWith(
35+
// --- Headline/Title Styles ---
36+
headlineLarge: baseTextTheme.headlineLarge?.copyWith(
37+
fontSize: 28, // Example size for main article title on details page
38+
fontWeight: FontWeight.bold,
39+
),
40+
headlineMedium: baseTextTheme.headlineMedium?.copyWith(
41+
fontSize: 24, // Slightly smaller alternative for details page title
42+
fontWeight: FontWeight.bold,
43+
),
44+
titleLarge: baseTextTheme.titleLarge?.copyWith(
45+
fontSize: 18, // For Headline.title in lists (Feed, Search)
46+
fontWeight: FontWeight.w600, // Semi-bold
47+
),
48+
titleMedium: baseTextTheme.titleMedium?.copyWith(
49+
fontSize: 16, // Alternative for list titles
50+
fontWeight: FontWeight.w600,
51+
),
52+
53+
// --- Body/Content Styles ---
54+
bodyLarge: baseTextTheme.bodyLarge?.copyWith(
55+
fontSize: 16, // For main article content paragraphs
56+
height: 1.5, // Improve readability with line height
57+
),
58+
bodyMedium: baseTextTheme.bodyMedium?.copyWith(
59+
fontSize: 14, // For Headline.description in lists
60+
height: 1.4,
61+
),
62+
63+
// --- Metadata/Caption Styles ---
64+
labelSmall: baseTextTheme.labelSmall?.copyWith(
65+
fontSize: 12, // For metadata (date, source, category)
66+
fontWeight: FontWeight.normal,
67+
// Consider a slightly muted color via ColorScheme if needed
68+
),
69+
// caption: baseTextTheme.caption?.copyWith(...), // Removed: caption is deprecated, use labelSmall
70+
71+
// --- Button Style (Usually default is fine) ---
72+
// labelLarge: baseTextTheme.labelLarge?.copyWith(fontSize: 14, fontWeight: FontWeight.bold),
73+
);
74+
}
75+
76+
/// Defines the application's light theme using FlexColorScheme.
77+
ThemeData lightTheme() {
78+
// Generate base text theme using GoogleFonts
79+
final baseTextTheme = GoogleFonts.notoSansTextTheme();
80+
81+
return FlexThemeData.light(
82+
scheme: FlexScheme.material,
83+
// Use Noto Sans font from Google Fonts.
84+
fontFamily:
85+
baseTextTheme.bodyLarge?.fontFamily, // Use font family from base
86+
textTheme: _customizeTextTheme(baseTextTheme), // Use helper function
87+
subThemesData: _commonSubThemesData, // Use the common sub-theme data
88+
);
89+
}
90+
91+
/// Defines the application's dark theme using FlexColorScheme.
92+
ThemeData darkTheme() {
93+
// Generate base text theme using GoogleFonts
94+
final baseTextTheme = GoogleFonts.notoSansTextTheme(
95+
// Ensure dark theme uses appropriate brightness for text colors
96+
ThemeData(brightness: Brightness.dark).textTheme,
97+
);
98+
99+
return FlexThemeData.dark(
100+
scheme: FlexScheme.material,
101+
// Use Noto Sans font from Google Fonts.
102+
fontFamily:
103+
baseTextTheme.bodyLarge?.fontFamily, // Use font family from base
104+
textTheme: _customizeTextTheme(baseTextTheme), // Use helper function
105+
subThemesData: _commonSubThemesData, // Use the common sub-theme data
106+
);
107+
}

lib/shared/theme/theme.dart

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
/// Barrel file for shared theme elements.
2+
/// Exports application-wide theme definitions like colors and theme data.
3+
library;
4+
5+
export 'app_theme.dart'; // Export the theme definitions

lib/shared/widgets/widgets.dart

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
/// Barrel file for shared widgets.
2+
/// Exports common, reusable UI components.
3+
library;
4+
5+
export 'failure_state_widget.dart';
6+
export 'initial_state_widget.dart';
7+
export 'loading_state_widget.dart';

0 commit comments

Comments
 (0)