Skip to content

Commit 20d590b

Browse files
GuldemGuldem
authored
Merge pull request #41 from DutchCodingCompany/feature/katja_stuff
Katjas boekwerk
2 parents bf7ea35 + 48ba504 commit 20d590b

13 files changed

Lines changed: 751 additions & 143 deletions

‎lib/common/extensions/build_context.dart‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import 'package:dcc_toolkit/style/kleurplaat/katjas_kleurplaat.dart';
2-
import 'package:dcc_toolkit/style/text_style/text_themes_decorator.dart';
1+
import 'package:dcc_toolkit/dcc_toolkit.dart';
2+
import 'package:dcc_toolkit/style/text_style/katjas_boekwerk.dart';
33
import 'package:flutter/material.dart';
44

55
/// Extension for [BuildContext] to get theme related data.
@@ -10,11 +10,11 @@ extension ThemingExtensions on BuildContext {
1010
/// Get Theme [ColorScheme] from [BuildContext].
1111
ColorScheme get colors => theme.colorScheme;
1212

13-
/// Get Theme [TextTheme] from [BuildContext].
14-
TextTheme get textThemes => theme.textTheme;
13+
/// Get Theme [KatjasBoekwerk] from [BuildContext].
14+
KatjasBoekwerk get katjasBoekwerk => theme.extension<KatjasBoekwerk>()!;
1515

16-
/// Get [TextThemesDecorator] from [BuildContext].
17-
TextThemesDecorator get textThemesDecorator => TextThemesDecorator(textThemes, katjasKleurPlaat);
16+
/// Get [BoekwerkDecorator] from [BuildContext].
17+
BoekwerkDecorator get textThemesDecorator => BoekwerkDecorator(katjasBoekwerk, katjasKleurPlaat);
1818

1919
/// Get [KatjasKleurplaat] from [BuildContext].
2020
KatjasKleurplaat get katjasKleurPlaat => theme.extension<KatjasKleurplaat>()!;

‎lib/common/extensions/text_style.dart‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import 'package:dcc_toolkit/style/text_style/handschrift.dart';
2+
import 'package:flutter/material.dart';
3+
4+
/// Extensions for [TextStyle].
5+
extension TextStyleX on TextStyle {
6+
/// Converts this [TextStyle] to a [Handschrift].
7+
///
8+
/// Provide additional [boldStyle] and [linkStyle] for [Handschrift].
9+
Handschrift toHandschrift({TextStyle? boldStyle, TextStyle? linkStyle}) {
10+
return Handschrift.fromTextStyle(this, boldStyle: boldStyle, linkStyle: linkStyle);
11+
}
12+
}

‎lib/dcc_toolkit.dart‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ export 'common/dimensions.dart';
33
export 'common/extensions/build_context.dart';
44
export 'common/extensions/color.dart';
55
export 'common/extensions/iterable.dart';
6+
export 'common/extensions/text_style.dart';
67
export 'common/extensions/text_theme.dart';
78
export 'common/mixins/refresh_stream_mixin.dart';
89
export 'common/result/result.dart';

‎lib/style/interface/boekwerk_interface.dart‎

Lines changed: 130 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,130 @@
1+
import 'package:dcc_toolkit/style/text_style/handschrift.dart';
2+
import 'package:flutter/material.dart';
3+
4+
/// An abstract interface that defines a typography scale contract.
5+
///
6+
/// This interface provides a standardized set of text style getters following
7+
/// a hierarchical typography system. Implementations can use any type [T] to
8+
/// represent text styles (e.g., [TextStyle], [Handschrift], or custom types).
9+
///
10+
/// The naming follows Material Design typography conventions with additional
11+
/// custom categories like [navbar] and [subtitleLarge]/[subtitleMedium]/[subtitleSmall] variants.
12+
///
13+
/// ## Typography Categories
14+
///
15+
/// - **Display**: Largest text styles, used for hero sections or prominent headings
16+
/// - **Subtitle**: Secondary text styles for subtitles and supporting content
17+
/// - **Headline**: Section headers and important callouts
18+
/// - **Title**: Component titles and smaller headers
19+
/// - **Body**: Main content text for paragraphs and descriptions
20+
/// - **Label**: Small text for buttons, tabs, and form labels
21+
/// - **Navbar**: Navigation bar specific styling
22+
///
23+
/// ## Example
24+
///
25+
/// ```dart
26+
/// class MyTypography implements BoekwerkInterface<TextStyle> {
27+
/// @override
28+
/// TextStyle? get displayLarge => TextStyle(fontSize: 57);
29+
/// // ... other implementations
30+
/// }
31+
/// ```
32+
abstract interface class BoekwerkInterface<T> {
33+
/// Creates a new [BoekwerkInterface] instance.
34+
BoekwerkInterface();
35+
36+
/// The largest display text style.
37+
///
38+
/// Typically used for short, important text like hero headers.
39+
T? get displayLarge;
40+
41+
/// The medium display text style.
42+
///
43+
/// Used for prominent text that is slightly smaller than [displayLarge].
44+
T? get displayMedium;
45+
46+
/// The smallest display text style.
47+
///
48+
/// Used for emphasized text that still needs to stand out.
49+
T? get displaySmall;
50+
51+
/// The largest subtitle text style.
52+
///
53+
/// Used for prominent secondary text or large subtitles.
54+
T? get subtitleLarge;
55+
56+
/// The medium subtitle text style.
57+
///
58+
/// Used for standard secondary text and subtitles.
59+
T? get subtitleMedium;
60+
61+
/// The smallest subtitle text style.
62+
///
63+
/// Used for compact secondary text.
64+
T? get subtitleSmall;
65+
66+
/// The largest headline text style.
67+
///
68+
/// Used for section headers and important callouts.
69+
T? get headlineLarge;
70+
71+
/// The medium headline text style.
72+
///
73+
/// Used for sub-section headers.
74+
T? get headlineMedium;
75+
76+
/// The smallest headline text style.
77+
///
78+
/// Used for smaller section divisions.
79+
T? get headlineSmall;
80+
81+
/// The largest title text style.
82+
///
83+
/// Used for component titles and card headers.
84+
T? get titleLarge;
85+
86+
/// The medium title text style.
87+
///
88+
/// Used for list item titles and smaller component headers.
89+
T? get titleMedium;
90+
91+
/// The smallest title text style.
92+
///
93+
/// Used for compact titles and inline headers.
94+
T? get titleSmall;
95+
96+
/// The largest body text style.
97+
///
98+
/// Used for emphasized paragraph text.
99+
T? get bodyLarge;
100+
101+
/// The medium body text style.
102+
///
103+
/// The default text style for most content.
104+
T? get bodyMedium;
105+
106+
/// The smallest body text style.
107+
///
108+
/// Used for secondary or less important content.
109+
T? get bodySmall;
110+
111+
/// The largest label text style.
112+
///
113+
/// Used for prominent buttons and action items.
114+
T? get labelLarge;
115+
116+
/// The medium label text style.
117+
///
118+
/// Used for standard buttons, tabs, and form labels.
119+
T? get labelMedium;
120+
121+
/// The smallest label text style.
122+
///
123+
/// Used for compact labels and captions.
124+
T? get labelSmall;
125+
126+
/// The navigation bar text style.
127+
///
128+
/// Used specifically for navigation bar items and labels.
129+
T? get navbar;
130+
}

‎lib/style/style.dart‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
export 'kleurplaat/color_group.dart';
22
export 'kleurplaat/katjas_kleurplaat.dart';
33
export 'kleurplaat/surface_group.dart';
4-
export 'text_style/text_style_color_group.dart';
5-
export 'text_style/text_style_decorator.dart';
6-
export 'text_style/text_style_surface_group.dart';
7-
export 'text_style/text_themes_decorator.dart';
4+
export 'text_style/boekwerk_decorator.dart';
5+
export 'text_style/handschrift_color_group.dart';
6+
export 'text_style/handschrift_decorator.dart';
7+
export 'text_style/handschrift_surface_group.dart';

‎lib/style/text_style/boekwerk_decorator.dart‎

Lines changed: 125 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,125 @@
1+
import 'package:dcc_toolkit/style/interface/boekwerk_interface.dart';
2+
import 'package:dcc_toolkit/style/kleurplaat/katjas_kleurplaat.dart';
3+
import 'package:dcc_toolkit/style/text_style/handschrift.dart';
4+
import 'package:dcc_toolkit/style/text_style/handschrift_decorator.dart';
5+
import 'package:dcc_toolkit/style/text_style/katjas_boekwerk.dart';
6+
7+
/// {@template boekwerk_decorator}
8+
/// Decorates a [KatjasBoekwerk] with [KatjasKleurplaat] colors.
9+
///
10+
/// This class wraps a [KatjasBoekwerk] typography scale and applies color
11+
/// information from a [KatjasKleurplaat] color palette, producing
12+
/// [HandschriftDecorator] instances that combine both style and color.
13+
///
14+
/// Each getter returns a [HandschriftDecorator] that wraps the corresponding
15+
/// [Handschrift] from the underlying [KatjasBoekwerk], or `null` if the
16+
/// source style is not defined.
17+
/// {@endtemplate}
18+
class BoekwerkDecorator implements BoekwerkInterface<HandschriftDecorator> {
19+
/// {@macro boekwerk_decorator}
20+
const BoekwerkDecorator(this._katjasBoekwerk, this._katjasKleurplaat);
21+
22+
/// The underlying typography scale to decorate.
23+
final KatjasBoekwerk _katjasBoekwerk;
24+
25+
/// The color palette to apply to the typography.
26+
final KatjasKleurplaat _katjasKleurplaat;
27+
28+
@override
29+
HandschriftDecorator? get displayLarge =>
30+
_katjasBoekwerk.displayLarge != null
31+
? HandschriftDecorator(_katjasBoekwerk.displayLarge!, _katjasKleurplaat)
32+
: null;
33+
34+
@override
35+
HandschriftDecorator? get displayMedium =>
36+
_katjasBoekwerk.displayMedium != null
37+
? HandschriftDecorator(_katjasBoekwerk.displayMedium!, _katjasKleurplaat)
38+
: null;
39+
40+
@override
41+
HandschriftDecorator? get displaySmall =>
42+
_katjasBoekwerk.displaySmall != null
43+
? HandschriftDecorator(_katjasBoekwerk.displaySmall!, _katjasKleurplaat)
44+
: null;
45+
46+
@override
47+
HandschriftDecorator? get subtitleLarge =>
48+
_katjasBoekwerk.subtitleLarge != null
49+
? HandschriftDecorator(_katjasBoekwerk.subtitleLarge!, _katjasKleurplaat)
50+
: null;
51+
52+
@override
53+
HandschriftDecorator? get subtitleMedium =>
54+
_katjasBoekwerk.subtitleMedium != null
55+
? HandschriftDecorator(_katjasBoekwerk.subtitleMedium!, _katjasKleurplaat)
56+
: null;
57+
58+
@override
59+
HandschriftDecorator? get subtitleSmall =>
60+
_katjasBoekwerk.subtitleSmall != null
61+
? HandschriftDecorator(_katjasBoekwerk.subtitleSmall!, _katjasKleurplaat)
62+
: null;
63+
64+
@override
65+
HandschriftDecorator? get headlineLarge =>
66+
_katjasBoekwerk.headlineLarge != null
67+
? HandschriftDecorator(_katjasBoekwerk.headlineLarge!, _katjasKleurplaat)
68+
: null;
69+
70+
@override
71+
HandschriftDecorator? get headlineMedium =>
72+
_katjasBoekwerk.headlineMedium != null
73+
? HandschriftDecorator(_katjasBoekwerk.headlineMedium!, _katjasKleurplaat)
74+
: null;
75+
76+
@override
77+
HandschriftDecorator? get headlineSmall =>
78+
_katjasBoekwerk.headlineSmall != null
79+
? HandschriftDecorator(_katjasBoekwerk.headlineSmall!, _katjasKleurplaat)
80+
: null;
81+
82+
@override
83+
HandschriftDecorator? get titleLarge =>
84+
_katjasBoekwerk.titleLarge != null ? HandschriftDecorator(_katjasBoekwerk.titleLarge!, _katjasKleurplaat) : null;
85+
86+
@override
87+
HandschriftDecorator? get titleMedium =>
88+
_katjasBoekwerk.titleMedium != null
89+
? HandschriftDecorator(_katjasBoekwerk.titleMedium!, _katjasKleurplaat)
90+
: null;
91+
92+
@override
93+
HandschriftDecorator? get titleSmall =>
94+
_katjasBoekwerk.titleSmall != null ? HandschriftDecorator(_katjasBoekwerk.titleSmall!, _katjasKleurplaat) : null;
95+
96+
@override
97+
HandschriftDecorator? get bodyLarge =>
98+
_katjasBoekwerk.bodyLarge != null ? HandschriftDecorator(_katjasBoekwerk.bodyLarge!, _katjasKleurplaat) : null;
99+
100+
@override
101+
HandschriftDecorator? get bodyMedium =>
102+
_katjasBoekwerk.bodyMedium != null ? HandschriftDecorator(_katjasBoekwerk.bodyMedium!, _katjasKleurplaat) : null;
103+
104+
@override
105+
HandschriftDecorator? get bodySmall =>
106+
_katjasBoekwerk.bodySmall != null ? HandschriftDecorator(_katjasBoekwerk.bodySmall!, _katjasKleurplaat) : null;
107+
108+
@override
109+
HandschriftDecorator? get labelLarge =>
110+
_katjasBoekwerk.labelLarge != null ? HandschriftDecorator(_katjasBoekwerk.labelLarge!, _katjasKleurplaat) : null;
111+
112+
@override
113+
HandschriftDecorator? get labelMedium =>
114+
_katjasBoekwerk.labelMedium != null
115+
? HandschriftDecorator(_katjasBoekwerk.labelMedium!, _katjasKleurplaat)
116+
: null;
117+
118+
@override
119+
HandschriftDecorator? get labelSmall =>
120+
_katjasBoekwerk.labelSmall != null ? HandschriftDecorator(_katjasBoekwerk.labelSmall!, _katjasKleurplaat) : null;
121+
122+
@override
123+
HandschriftDecorator? get navbar =>
124+
_katjasBoekwerk.navbar != null ? HandschriftDecorator(_katjasBoekwerk.navbar!, _katjasKleurplaat) : null;
125+
}

0 commit comments

Comments
 (0)