[VeggieSeasons] Fix dark mode problems (#395)

veggieseasons/lib/main.dart

@@ -8,7 +8,6 @@ import 'package:scoped_model/scoped_model.dart';
 import 'package:veggieseasons/data/app_state.dart';
 import 'package:veggieseasons/data/preferences.dart';
 import 'package:veggieseasons/screens/home.dart';
-import 'package:veggieseasons/styles.dart';
 
 void main() {
   WidgetsFlutterBinding.ensureInitialized();
@@ -23,11 +22,7 @@ void main() {
       child: ScopedModel<Preferences>(
         model: Preferences()..load(),
         child: CupertinoApp(
-          theme: CupertinoThemeData(
-            brightness: Brightness.light,
-          ),
           debugShowCheckedModeBanner: false,
-          color: Styles.appBackground,
           home: HomeScreen(),
         ),
       ),

veggieseasons/lib/screens/details.dart

@@ -28,11 +28,12 @@ class ServingInfoChart extends StatelessWidget {
       builder: (context, snapshot) {
         final target = snapshot?.data ?? 2000;
         final percent = standardPercentage * 2000 ~/ target;
+        final CupertinoThemeData themeData = CupertinoTheme.of(context);
 
         return Text(
           '$percent% DV',
           textAlign: TextAlign.end,
-          style: Styles.detailsServingValueText,
+          style: Styles.detailsServingValueText(themeData),
         );
       },
     );
@@ -40,6 +41,7 @@ class ServingInfoChart extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final CupertinoThemeData themeData = CupertinoTheme.of(context);
     return Column(
       children: [
         SizedBox(height: 16),
@@ -70,14 +72,14 @@ class ServingInfoChart extends StatelessWidget {
                       TableCell(
                         child: Text(
                           'Serving size:',
-                          style: Styles.detailsServingLabelText,
+                          style: Styles.detailsServingLabelText(themeData),
                         ),
                       ),
                       TableCell(
                         child: Text(
                           veggie.servingSize,
                           textAlign: TextAlign.end,
-                          style: Styles.detailsServingValueText,
+                          style: Styles.detailsServingValueText(themeData),
                         ),
                       ),
                     ],
@@ -87,14 +89,14 @@ class ServingInfoChart extends StatelessWidget {
                       TableCell(
                         child: Text(
                           'Calories:',
-                          style: Styles.detailsServingLabelText,
+                          style: Styles.detailsServingLabelText(themeData),
                         ),
                       ),
                       TableCell(
                         child: Text(
                           '${veggie.caloriesPerServing} kCal',
                           textAlign: TextAlign.end,
-                          style: Styles.detailsServingValueText,
+                          style: Styles.detailsServingValueText(themeData),
                         ),
                       ),
                     ],
@@ -104,7 +106,7 @@ class ServingInfoChart extends StatelessWidget {
                       TableCell(
                         child: Text(
                           'Vitamin A:',
-                          style: Styles.detailsServingLabelText,
+                          style: Styles.detailsServingLabelText(themeData),
                         ),
                       ),
                       TableCell(
@@ -120,7 +122,7 @@ class ServingInfoChart extends StatelessWidget {
                       TableCell(
                         child: Text(
                           'Vitamin C:',
-                          style: Styles.detailsServingLabelText,
+                          style: Styles.detailsServingLabelText(themeData),
                         ),
                       ),
                       TableCell(
@@ -141,7 +143,7 @@ class ServingInfoChart extends StatelessWidget {
                     return Text(
                       'Percent daily values based on a diet of ' +
                           '${snapshot?.data ?? '2,000'} calories.',
-                      style: Styles.detailsServingNoteText,
+                      style: Styles.detailsServingNoteText(themeData),
                     );
                   },
                 ),
@@ -163,6 +165,7 @@ class InfoView extends StatelessWidget {
     final appState = ScopedModel.of<AppState>(context, rebuildOnChange: true);
     final prefs = ScopedModel.of<Preferences>(context, rebuildOnChange: true);
     final veggie = appState.getVeggie(id);
+    final CupertinoThemeData themeData = CupertinoTheme.of(context);
 
     return Padding(
       padding: const EdgeInsets.all(24),
@@ -179,8 +182,8 @@ class InfoView extends StatelessWidget {
                     veggie.categoryName.toUpperCase(),
                     style: (snapshot.hasData &&
                             snapshot.data.contains(veggie.category))
-                        ? Styles.detailsPreferredCategoryText
-                        : Styles.detailsCategoryText,
+                        ? Styles.detailsPreferredCategoryText(themeData)
+                        : Styles.detailsCategoryText(themeData),
                   );
                 },
               ),
@@ -201,12 +204,12 @@ class InfoView extends StatelessWidget {
           SizedBox(height: 8),
           Text(
             veggie.name,
-            style: Styles.detailsTitleText,
+            style: Styles.detailsTitleText(themeData),
           ),
           SizedBox(height: 8),
           Text(
             veggie.shortDescription,
-            style: Styles.detailsDescriptionText,
+            style: Styles.detailsDescriptionText(themeData),
           ),
           ServingInfoChart(veggie, prefs),
           SizedBox(height: 24),
@@ -220,7 +223,10 @@ class InfoView extends StatelessWidget {
                 },
               ),
               SizedBox(width: 8),
-              Text('Save to Garden'),
+              Text(
+                'Save to Garden',
+                style: CupertinoTheme.of(context).textTheme.textStyle,
+              ),
             ],
           ),
         ],

veggieseasons/lib/screens/favorites.dart

@@ -27,7 +27,8 @@ class FavoritesScreen extends StatelessWidget {
                     padding: const EdgeInsets.symmetric(horizontal: 24),
                     child: Text(
                       'You haven\'t added any favorite veggies to your garden yet.',
-                      style: Styles.headlineDescription,
+                      style: Styles.headlineDescription(
+                          CupertinoTheme.of(context)),
                     ),
                   )
                 : ListView(

veggieseasons/lib/screens/list.dart

@@ -36,10 +36,8 @@ class ListScreen extends StatelessWidget {
             ScopedModel.of<AppState>(context, rebuildOnChange: true);
         final prefs =
             ScopedModel.of<Preferences>(context, rebuildOnChange: true);
-
-        return DecoratedBox(
-          decoration: BoxDecoration(color: Color(0xffffffff)),
-          child: SafeArea(
+        final CupertinoThemeData themeData = CupertinoTheme.of(context);
+        return SafeArea(
           bottom: false,
           child: ListView.builder(
             itemCount: appState.allVeggies.length + 2,
@@ -51,7 +49,8 @@ class ListScreen extends StatelessWidget {
                     crossAxisAlignment: CrossAxisAlignment.start,
                     children: [
                       Text(dateString.toUpperCase(), style: Styles.minorText),
-                        Text('In season today', style: Styles.headlineText),
+                      Text('In season today',
+                          style: Styles.headlineText(themeData)),
                     ],
                   ),
                 );
@@ -63,7 +62,8 @@ class ListScreen extends StatelessWidget {
               } else if (index <= appState.availableVeggies.length + 1) {
                 return Padding(
                   padding: const EdgeInsets.fromLTRB(16, 24, 16, 16),
-                    child: Text('Not in season', style: Styles.headlineText),
+                  child: Text('Not in season',
+                      style: Styles.headlineText(themeData)),
                 );
               } else {
                 int relativeIndex =
@@ -74,7 +74,6 @@ class ListScreen extends StatelessWidget {
               }
             },
           ),
-          ),
         );
       },
     );

veggieseasons/lib/screens/search.dart

@@ -54,7 +54,7 @@ class _SearchScreenState extends State<SearchScreen> {
           padding: const EdgeInsets.symmetric(horizontal: 24),
           child: Text(
             'No veggies matching your search terms were found.',
-            style: Styles.headlineDescription,
+            style: Styles.headlineDescription(CupertinoTheme.of(context)),
           ),
         ),
       );
@@ -77,11 +77,7 @@ class _SearchScreenState extends State<SearchScreen> {
 
     return CupertinoTabView(
       builder: (context) {
-        return DecoratedBox(
-          decoration: BoxDecoration(
-            color: Styles.scaffoldBackground,
-          ),
-          child: SafeArea(
+        return SafeArea(
           bottom: false,
           child: Column(
             children: [
@@ -91,7 +87,6 @@ class _SearchScreenState extends State<SearchScreen> {
               ),
             ],
           ),
-          ),
         );
       },
     );

veggieseasons/lib/screens/settings.dart

@@ -17,13 +17,13 @@ class VeggieCategorySettingsScreen extends StatelessWidget {
   Widget build(BuildContext context) {
     final model = ScopedModel.of<Preferences>(context, rebuildOnChange: true);
     final currentPrefs = model.preferredCategories;
-
+    Brightness brightness = CupertinoTheme.brightnessOf(context);
     return CupertinoPageScaffold(
       navigationBar: CupertinoNavigationBar(
         middle: Text('Preferred Categories'),
         previousPageTitle: 'Settings',
       ),
-      backgroundColor: Styles.scaffoldBackground,
+      backgroundColor: Styles.scaffoldBackground(brightness),
       child: FutureBuilder<Set<VeggieCategory>>(
         future: currentPrefs,
         builder: (context, snapshot) {
@@ -80,12 +80,12 @@ class CalorieSettingsScreen extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final model = ScopedModel.of<Preferences>(context, rebuildOnChange: true);
-
+    Brightness brightness = CupertinoTheme.brightnessOf(context);
     return CupertinoPageScaffold(
       navigationBar: CupertinoNavigationBar(
         previousPageTitle: 'Settings',
       ),
-      backgroundColor: Styles.scaffoldBackground,
+      backgroundColor: Styles.scaffoldBackground(brightness),
       child: ListView(
         children: [
           FutureBuilder<int>(
@@ -138,7 +138,10 @@ class SettingsScreen extends StatelessWidget {
         builder: (context, snapshot) {
           return Row(
             children: [
-              Text(snapshot.data?.toString() ?? ''),
+              Text(
+                snapshot.data?.toString() ?? '',
+                style: CupertinoTheme.of(context).textTheme.textStyle,
+              ),
               SizedBox(width: 8),
               SettingsNavigationIndicator(),
             ],
@@ -182,7 +185,7 @@ class SettingsScreen extends StatelessWidget {
 
     return CupertinoPageScaffold(
       child: Container(
-        color: Styles.scaffoldBackground,
+        color: Styles.scaffoldBackground(CupertinoTheme.brightnessOf(context)),
         child: CustomScrollView(
           slivers: <Widget>[
             CupertinoSliverNavigationBar(

veggieseasons/lib/styles.dart

@@ -8,8 +8,8 @@ import 'package:font_awesome_flutter/font_awesome_flutter.dart';
 import 'package:veggieseasons/data/veggie.dart';
 
 abstract class Styles {
-  static const headlineText = TextStyle(
-    color: Color.fromRGBO(0, 0, 0, 0.8),
+  static TextStyle headlineText(CupertinoThemeData themeData) => TextStyle(
+        color: themeData.textTheme.textStyle.color,
         fontFamily: 'NotoSans',
         fontSize: 32,
         fontStyle: FontStyle.normal,
@@ -24,16 +24,17 @@ abstract class Styles {
     fontWeight: FontWeight.normal,
   );
 
-  static const headlineName = TextStyle(
-    color: Color.fromRGBO(0, 0, 0, 0.9),
+  static TextStyle headlineName(CupertinoThemeData themeData) => TextStyle(
+        color: themeData.textTheme.textStyle.color,
         fontFamily: 'NotoSans',
         fontSize: 24,
         fontStyle: FontStyle.normal,
         fontWeight: FontWeight.bold,
       );
 
-  static const headlineDescription = TextStyle(
-    color: Color.fromRGBO(0, 0, 0, 0.8),
+  static TextStyle headlineDescription(CupertinoThemeData themeData) =>
+      TextStyle(
+        color: themeData.textTheme.textStyle.color,
         fontFamily: 'NotoSans',
         fontSize: 16,
         fontStyle: FontStyle.normal,
@@ -64,32 +65,35 @@ abstract class Styles {
     fontWeight: FontWeight.normal,
   );
 
-  static const detailsTitleText = TextStyle(
-    color: Color.fromRGBO(0, 0, 0, 0.9),
+  static TextStyle detailsTitleText(CupertinoThemeData themeData) => TextStyle(
+        color: themeData.textTheme.textStyle.color,
         fontFamily: 'NotoSans',
         fontSize: 30,
         fontStyle: FontStyle.normal,
         fontWeight: FontWeight.bold,
       );
 
-  static const detailsPreferredCategoryText = TextStyle(
-    color: Color.fromRGBO(0, 80, 0, 0.7),
+  static TextStyle detailsPreferredCategoryText(CupertinoThemeData themeData) =>
+      TextStyle(
+        color: themeData.textTheme.textStyle.color,
         fontFamily: 'NotoSans',
         fontSize: 16,
         fontStyle: FontStyle.normal,
         fontWeight: FontWeight.bold,
       );
 
-  static const detailsCategoryText = TextStyle(
-    color: Color.fromRGBO(0, 0, 0, 0.7),
+  static TextStyle detailsCategoryText(CupertinoThemeData themeData) =>
+      TextStyle(
+        color: themeData.textTheme.textStyle.color,
         fontFamily: 'NotoSans',
         fontSize: 16,
         fontStyle: FontStyle.normal,
         fontWeight: FontWeight.normal,
       );
 
-  static const detailsDescriptionText = TextStyle(
-    color: Color.fromRGBO(0, 0, 0, 0.9),
+  static TextStyle detailsDescriptionText(CupertinoThemeData themeData) =>
+      TextStyle(
+        color: themeData.textTheme.textStyle.color,
         fontFamily: 'NotoSans',
         fontSize: 16,
         fontStyle: FontStyle.normal,
@@ -112,48 +116,54 @@ abstract class Styles {
     fontWeight: FontWeight.bold,
   );
 
-  static const detailsServingLabelText = TextStyle(
-    color: Color.fromRGBO(0, 0, 0, 0.9),
+  static TextStyle detailsServingLabelText(CupertinoThemeData themeData) =>
+      TextStyle(
+        color: themeData.textTheme.textStyle.color,
         fontFamily: 'NotoSans',
         fontSize: 16,
         fontStyle: FontStyle.normal,
         fontWeight: FontWeight.bold,
       );
 
-  static const detailsServingValueText = TextStyle(
-    color: Color.fromRGBO(0, 0, 0, 0.9),
+  static TextStyle detailsServingValueText(CupertinoThemeData themeData) =>
+      TextStyle(
+        color: themeData.textTheme.textStyle.color,
         fontFamily: 'NotoSans',
         fontSize: 16,
         fontStyle: FontStyle.normal,
         fontWeight: FontWeight.normal,
       );
 
-  static const detailsServingNoteText = TextStyle(
-    color: Color.fromRGBO(0, 0, 0, 0.9),
+  static TextStyle detailsServingNoteText(CupertinoThemeData themeData) =>
+      TextStyle(
+        color: themeData.textTheme.textStyle.color,
         fontFamily: 'NotoSans',
         fontSize: 16,
         fontStyle: FontStyle.italic,
         fontWeight: FontWeight.normal,
       );
 
-  static const triviaFinishedTitleText = TextStyle(
-    color: Color.fromRGBO(0, 0, 0, 0.9),
+  static TextStyle triviaFinishedTitleText(CupertinoThemeData themeData) =>
+      TextStyle(
+        color: themeData.textTheme.textStyle.color,
         fontFamily: 'NotoSans',
         fontSize: 32,
         fontStyle: FontStyle.normal,
         fontWeight: FontWeight.normal,
       );
 
-  static const triviaFinishedText = TextStyle(
-    color: Color.fromRGBO(0, 0, 0, 0.9),
+  static TextStyle triviaFinishedText(CupertinoThemeData themeData) =>
+      TextStyle(
+        color: themeData.textTheme.textStyle.color,
         fontFamily: 'NotoSans',
         fontSize: 16,
         fontStyle: FontStyle.normal,
         fontWeight: FontWeight.normal,
       );
 
-  static const triviaFinishedBigText = TextStyle(
-    color: Color.fromRGBO(0, 0, 0, 0.9),
+  static TextStyle triviaFinishedBigText(CupertinoThemeData themeData) =>
+      TextStyle(
+        color: themeData.textTheme.textStyle.color,
         fontFamily: 'NotoSans',
         fontSize: 48,
         fontStyle: FontStyle.normal,
@@ -162,9 +172,13 @@ abstract class Styles {
 
   static const appBackground = Color(0xffd0d0d0);
 
-  static const scaffoldBackground = Color(0xfff0f0f0);
+  static Color scaffoldBackground(Brightness brightness) =>
+      brightness == Brightness.light
+          ? CupertinoColors.lightBackgroundGray
+          : null;
 
-  static const searchBackground = Color(0xffe0e0e0);
+  static Color searchBackground(CupertinoThemeData themeData) =>
+      themeData.barBackgroundColor;
 
   static const frostedBackground = Color(0xccf8f8f8);
 
@@ -172,14 +186,24 @@ abstract class Styles {
 
   static const closeButtonPressed = Color(0xff808080);
 
-  static const TextStyle searchText = TextStyle(
-    color: Color.fromRGBO(0, 0, 0, 1),
+  static TextStyle searchText(CupertinoThemeData themeData) => TextStyle(
+        color: themeData.textTheme.textStyle.color,
         fontFamily: 'NotoSans',
         fontSize: 14,
         fontStyle: FontStyle.normal,
         fontWeight: FontWeight.normal,
       );
 
+  static TextStyle settingsItemText(CupertinoThemeData themeData) =>
+      themeData.textTheme.textStyle;
+
+  static TextStyle settingsItemSubtitleText(CupertinoThemeData themeData) =>
+      TextStyle(
+        fontSize: 12,
+        letterSpacing: -0.2,
+        color: themeData.textTheme.textStyle.color,
+      );
+
   static const Color searchCursorColor = Color.fromRGBO(0, 122, 255, 1);
 
   static const Color searchIconColor = Color.fromRGBO(128, 128, 128, 1);
@@ -240,7 +264,13 @@ abstract class Styles {
 
   static const Color settingsItemPressed = Color(0xffd9d9d9);
 
-  static const Color settingsLineation = Color(0xffbcbbc1);
+  static Color settingsItemColor(Brightness brightness) =>
+      brightness == Brightness.light
+          ? CupertinoColors.tertiarySystemBackground
+          : CupertinoColors.darkBackgroundGray;
+
+  static Color settingsLineation(Brightness brightness) =>
+      brightness == Brightness.light ? Color(0xffbcbbc1) : Color(0xFF4C4B4B);
 
   static const Color settingsBackground = Color(0xffefeff4);
 

veggieseasons/lib/widgets/search_bar.dart

@@ -17,9 +17,11 @@ class SearchBar extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final CupertinoThemeData themeData = CupertinoTheme.of(context);
+
     return DecoratedBox(
       decoration: BoxDecoration(
-        color: Styles.searchBackground,
+        color: Styles.searchBackground(themeData),
         borderRadius: BorderRadius.circular(10),
       ),
       child: Padding(
@@ -40,7 +42,7 @@ class SearchBar extends StatelessWidget {
                 controller: controller,
                 focusNode: focusNode,
                 decoration: null,
-                style: Styles.searchText,
+                style: Styles.searchText(themeData),
                 cursorColor: Styles.searchCursorColor,
               ),
             ),

veggieseasons/lib/widgets/settings_group.dart

@@ -74,14 +74,13 @@ class SettingsGroup extends StatelessWidget {
   final List<SettingsItem> items;
   final Widget header;
   final Widget footer;
-
   @override
   Widget build(BuildContext context) {
+    Brightness brightness = CupertinoTheme.brightnessOf(context);
     final dividedItems = <Widget>[items[0]];
-
     for (int i = 1; i < items.length; i++) {
       dividedItems.add(Container(
-        color: Styles.settingsLineation,
+        color: Styles.settingsLineation(brightness),
         height: 0.3,
       ));
       dividedItems.add(items[i]);
@@ -99,12 +98,12 @@ class SettingsGroup extends StatelessWidget {
             decoration: BoxDecoration(
               color: CupertinoColors.white,
               border: Border(
-                top: const BorderSide(
-                  color: Styles.settingsLineation,
+                top: BorderSide(
+                  color: Styles.settingsLineation(brightness),
                   width: 0,
                 ),
-                bottom: const BorderSide(
-                  color: Styles.settingsLineation,
+                bottom: BorderSide(
+                  color: Styles.settingsLineation(brightness),
                   width: 0,
                 ),
               ),

veggieseasons/lib/widgets/settings_item.dart

@@ -85,9 +85,11 @@ class SettingsItemState extends State<SettingsItem> {
 
   @override
   Widget build(BuildContext context) {
+    CupertinoThemeData themeData = CupertinoTheme.of(context);
+    Brightness brightness = CupertinoTheme.brightnessOf(context);
     return AnimatedContainer(
       duration: const Duration(milliseconds: 200),
-      color: pressed ? Styles.settingsItemPressed : Styles.transparentColor,
+      color: Styles.settingsItemColor(brightness),
       child: GestureDetector(
         behavior: HitTestBehavior.opaque,
         onTap: () async {
@@ -132,20 +134,23 @@ class SettingsItemState extends State<SettingsItem> {
                           crossAxisAlignment: CrossAxisAlignment.start,
                           children: <Widget>[
                             SizedBox(height: 8.5),
-                            Text(widget.label),
+                            Text(
+                              widget.label,
+                              style: Styles.settingsItemText(themeData),
+                            ),
                             SizedBox(height: 4),
                             Text(
                               widget.subtitle,
-                              style: TextStyle(
-                                fontSize: 12,
-                                letterSpacing: -0.2,
-                              ),
+                              style: Styles.settingsItemSubtitleText(themeData),
                             ),
                           ],
                         )
                       : Padding(
                           padding: EdgeInsets.only(top: 1.5),
-                          child: Text(widget.label),
+                          child: Text(
+                            widget.label,
+                            style: Styles.settingsItemText(themeData),
+                          ),
                         ),
                 ),
               ),

veggieseasons/lib/widgets/trivia.dart

@@ -106,18 +106,20 @@ class _TriviaViewState extends State<TriviaView> {
   // Widget shown when the game is over. It includes the score and a button to
   // restart everything.
   Widget _buildFinishedView() {
+    final CupertinoThemeData themeData = CupertinoTheme.of(context);
+
     return Padding(
       padding: const EdgeInsets.all(32),
       child: Column(
         children: [
           Text(
             'All done!',
-            style: Styles.triviaFinishedTitleText,
+            style: Styles.triviaFinishedTitleText(themeData),
           ),
           SizedBox(height: 16),
           Text(
             'You answered',
-            style: Styles.triviaFinishedText,
+            style: Styles.triviaFinishedText(themeData),
           ),
           Row(
             mainAxisSize: MainAxisSize.min,
@@ -126,24 +128,24 @@ class _TriviaViewState extends State<TriviaView> {
             children: [
               Text(
                 '$score',
-                style: Styles.triviaFinishedBigText,
+                style: Styles.triviaFinishedBigText(themeData),
               ),
               Padding(
                 padding: const EdgeInsets.symmetric(horizontal: 16),
                 child: Text(
                   ' of ',
-                  style: Styles.triviaFinishedText,
+                  style: Styles.triviaFinishedText(themeData),
                 ),
               ),
               Text(
                 '${veggie.trivia.length}',
-                style: Styles.triviaFinishedBigText,
+                style: Styles.triviaFinishedBigText(themeData),
               ),
             ],
           ),
           Text(
             'questions correctly!',
-            style: Styles.triviaFinishedText,
+            style: Styles.triviaFinishedText(themeData),
           ),
           SizedBox(height: 16),
           CupertinoButton(
@@ -162,7 +164,10 @@ class _TriviaViewState extends State<TriviaView> {
       child: Column(
         children: [
           SizedBox(height: 16),
-          Text(currentTrivia.question),
+          Text(
+            currentTrivia.question,
+            style: CupertinoTheme.of(context).textTheme.textStyle,
+          ),
           SizedBox(height: 32),
           for (int i = 0; i < currentTrivia.answers.length; i++)
             Padding(
@@ -188,9 +193,12 @@ class _TriviaViewState extends State<TriviaView> {
       padding: const EdgeInsets.all(32),
       child: Column(
         children: [
-          Text(status == PlayerStatus.wasCorrect
+          Text(
+            status == PlayerStatus.wasCorrect
                 ? 'That\'s right!'
-              : 'Sorry, that wasn\'t the right answer.'),
+                : 'Sorry, that wasn\'t the right answer.',
+            style: CupertinoTheme.of(context).textTheme.textStyle,
+          ),
           SizedBox(height: 16),
           CupertinoButton(
             child: Text('Next Question'),

veggieseasons/lib/widgets/veggie_headline.dart

@@ -67,6 +67,8 @@ class VeggieHeadline extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final CupertinoThemeData themeData = CupertinoTheme.of(context);
+
     return GestureDetector(
       onTap: () => Navigator.of(context).push<void>(CupertinoPageRoute(
         builder: (context) => DetailsScreen(veggie.id),
@@ -89,13 +91,16 @@ class VeggieHeadline extends StatelessWidget {
               children: [
                 Row(
                   children: [
-                    Text(veggie.name, style: Styles.headlineName),
+                    Text(
+                      veggie.name,
+                      style: Styles.headlineName(themeData),
+                    ),
                     ..._buildSeasonDots(veggie.seasons),
                   ],
                 ),
                 Text(
                   veggie.shortDescription,
-                  style: Styles.headlineDescription,
+                  style: Styles.headlineDescription(themeData),
                 ),
               ],
             ),