WIP Themes: Make all fonts depend on theme

lib/cards/card_widget.dart

@@ -198,9 +198,6 @@ class CardWidget extends StatelessWidget {
     body.add(CardHeader(
       name: card.name ?? "",
       subtitle: Text("${card.linkedEntityWrapper.entity.displayState}",
-        style: TextStyle(
-            color: Colors.grey
-        ),
       ),
       trailing: Row(
           mainAxisSize: MainAxisSize.min,

lib/entities/alarm_control_panel/widgets/alarm_control_panel_controls.widget.dart

@@ -248,7 +248,9 @@ class _AlarmControlPanelControlsWidgetWidgetState extends State<AlarmControlPane
         FlatButton(
           child: Text(
             "TRIGGER",
-            style: TextStyle(color: Colors.redAccent)
+            style: Theme.of(context).textTheme.subhead.copyWith(
+              color: Colors.redAccent
+            )
           ),
           onPressed: () => _askToTrigger(entity),
         )

lib/entities/badge.widget.dart

@@ -64,7 +64,6 @@ class BadgeWidget extends StatelessWidget {
               overflow: TextOverflow.fade,
               softWrap: false,
               textAlign: TextAlign.center,
-              style: TextStyle(fontSize: stateFontSize),
             ),
           );
           break;
@@ -77,7 +76,9 @@ class BadgeWidget extends StatelessWidget {
       onBadgeText = Container(
           padding: EdgeInsets.fromLTRB(6.0, 2.0, 6.0, 2.0),
           child: Text("$onBadgeTextValue",
-              style: TextStyle(fontSize: 12.0, color: Colors.white),
+              style: Theme.of(context).textTheme.overline.copyWith(
+                color: Colors.white
+              ),
               textAlign: TextAlign.center,
               softWrap: false,
               overflow: TextOverflow.fade),
@@ -131,7 +132,7 @@ class BadgeWidget extends StatelessWidget {
               child: Text(
                 "${entityModel.entityWrapper.displayName}",
                 textAlign: TextAlign.center,
-                style: TextStyle(fontSize: 12.0),
+                style: Theme.of(context).textTheme.caption,
                 softWrap: true,
                 maxLines: 3,
                 overflow: TextOverflow.ellipsis,

lib/entities/default_entity_container.widget.dart

@@ -29,7 +29,9 @@ class DefaultEntityContainer extends StatelessWidget {
           ),
           Text(
               "${entityModel.entityWrapper.entity.displayName}",
-            style: TextStyle(color: Colors.blue),
+            style: Theme.of(context).textTheme.body1.copyWith(
+              color: Colors.blue
+            ),
           )
         ],
       );

lib/entities/entity_page_layout.widget.dart

@@ -25,10 +25,8 @@ class EntityPageLayout extends StatelessWidget {
                       padding: EdgeInsets.only(left: 8),
                       child: Text(
                         entity.displayName,
-                        style: TextStyle(
+                        style: Theme.of(context).textTheme.headline.copyWith(
-                            fontWeight: FontWeight.bold,
+                          color: Colors.white
-                            color: Colors.white,
-                            fontSize: 22
                         ),
                       ),
                     ),

lib/entities/light/widgets/light_controls.dart

@@ -183,7 +183,7 @@ class _LightControlsWidgetState extends State<LightControlsWidget> {
       }
       return UniversalSlider(
         title: "Color temperature",
-        leading: Text("Cold", style: TextStyle(color: Colors.lightBlue),),
+        leading: Text("Cold", style: Theme.of(context).textTheme.body1.copyWith(color: Colors.lightBlue)),
         value:  val,
         onChangeEnd: (value) => _setColorTemp(entity, value),
         max: entity.maxMireds,
@@ -194,7 +194,7 @@ class _LightControlsWidgetState extends State<LightControlsWidget> {
             _tmpColorTemp = value.round();
           });
         },
-        closing: Text("Warm", style: TextStyle(color: Colors.amberAccent),),
+        closing: Text("Warm", style: Theme.of(context).textTheme.body1.copyWith(color: Colors.amberAccent),),
       );
     } else {
       return Container(width: 0.0, height: 0.0);

lib/entities/media_player/widgets/media_player_seek_bar.widget.dart

@@ -13,12 +13,6 @@ class _MediaPlayerSeekBarState extends State<MediaPlayerSeekBar> {
   double _currentPosition = 0;
   int _savedPosition = 0;
 
-  final TextStyle _seekTextStyle = TextStyle(
-      fontSize: 20,
-      color: Colors.blue,
-      fontWeight: FontWeight.bold
-  );
-
   @override
   initState() {
     super.initState();
@@ -79,7 +73,13 @@ class _MediaPlayerSeekBarState extends State<MediaPlayerSeekBar> {
               children: <Widget>[
                 Text("00:00"),
                 Expanded(
-                  child: Text("${Duration(seconds: _currentPosition.toInt()).toString().split(".")[0]}",textAlign: TextAlign.center, style: _seekTextStyle),
+                  child: Text(
+                    "${Duration(seconds: _currentPosition.toInt()).toString().split(".")[0]}",
+                    textAlign: TextAlign.center,
+                    style: Theme.of(context).textTheme.title.copyWith(
+                      color: Colors.blue
+                    )
+                  ),
                 ),
                 Text("${Duration(seconds: entity.durationSeconds).toString().split(".")[0]}")
               ],

lib/entities/media_player/widgets/media_player_widgets.dart

@@ -19,7 +19,7 @@ class MediaPlayerWidget extends StatelessWidget {
               right: 0.0,
               child: Container(
                 color: Colors.black45,
-                child: _buildState(entity),
+                child: _buildState(entity, context),
               ),
             ),
             Positioned(
@@ -35,12 +35,9 @@ class MediaPlayerWidget extends StatelessWidget {
     );
   }
 
-  Widget _buildState(MediaPlayerEntity entity) {
+  Widget _buildState(MediaPlayerEntity entity, BuildContext context) {
-    TextStyle style = TextStyle(
+    TextStyle style = Theme.of(context).textTheme.body1.copyWith(
-        fontSize: 14.0,
+      color: Colors.white
-        color: Colors.white,
-        fontWeight: FontWeight.normal,
-        height: 1.2
     );
     List<Widget> states = [];
     states.add(Text("${entity.displayName}", style: style));

lib/entities/vacuum/widgets/vacuum_state_button.dart

@@ -27,10 +27,7 @@ class VacuumStateButton extends StatelessWidget {
           text: "RETURN TO DOCK"
       );
     } else {
-      result = Text(entity.state.toUpperCase(), style: TextStyle(
+      result = Text(entity.state.toUpperCase(), style: Theme.of(context).textTheme.subhead);
-          fontSize: 16,
-          color: Colors.grey
-      ));
     }
     return Padding(
       padding: EdgeInsets.only(right: 15),

lib/main.dart

@@ -262,7 +262,9 @@ class _HAClientAppState extends State<HAClientApp> {
             title: new Text("Login with HA"),
             actions: <Widget>[
               FlatButton(
-                child: Text("Manual", style: TextStyle(color: Colors.white)),
+                child: Text("Manual", style: Theme.of(context).textTheme.button.copyWith(
+                  decoration: TextDecoration.underline
+                )),
                 onPressed: () {
                   eventBus.fire(ShowPageEvent(path: "/connection-settings", goBackFirst: true));
                 },

lib/managers/theme_manager.dart

@@ -14,7 +14,7 @@ class HAClientTheme {
   HAClientTheme._internal();
 
   final ThemeData lightTheme = ThemeData.light().copyWith(
-    primaryColor: Colors.blue,
+    //primaryColor: Colors.blue,
     textTheme: ThemeData.light().textTheme.copyWith(
       display1: TextStyle(fontSize: 34, fontWeight: FontWeight.normal, color: Colors.black54),
       display2: TextStyle(fontSize: 34, fontWeight: FontWeight.normal, color: Colors.redAccent),
@@ -24,8 +24,14 @@ class HAClientTheme {
       body1: TextStyle(fontSize: 15, fontWeight: FontWeight.normal, color: defaultFontColor),
       body2: TextStyle(fontSize: 15, fontWeight: FontWeight.w500, color: defaultFontColor),
       subtitle: TextStyle(fontSize: 15, fontWeight: FontWeight.w500, color: Colors.black45),
-      caption: TextStyle(fontSize: 14, fontWeight: FontWeight.normal, color: Colors.black26),
+      caption: TextStyle(fontSize: 12, fontWeight: FontWeight.normal, color: Colors.black45),
-      overline: TextStyle(fontSize: 10, fontWeight: FontWeight.normal, color: Colors.black26),
+      overline: TextStyle(
+        fontSize: 10,
+        fontWeight: FontWeight.normal,
+        color: Colors.black26,
+        letterSpacing: 1,
+      ),
+      button: TextStyle(fontSize: 14, fontWeight: FontWeight.w500, color: Colors.white),
     )
   );
 

lib/pages/integration_settings.page.dart

@@ -121,9 +121,8 @@ class _IntegrationSettingsPageState extends State<IntegrationSettingsPage> {
                   onTap: () => Launcher.launchURLInCustomTab(context: context, url: "http://ha-client.app/docs#location-tracking"),
                   child: Text(
                     "Please read documentation!",
-                    style: TextStyle(
+                    style: Theme.of(context).textTheme.subhead.copyWith(
                       color: Colors.blue,
-                      fontSize: 16,
                       decoration: TextDecoration.underline
                     )
                   ),
@@ -180,13 +179,13 @@ class _IntegrationSettingsPageState extends State<IntegrationSettingsPage> {
                     RaisedButton(
                         color: Colors.blue,
                         onPressed: () => updateRegistration(),
-                        child: Text("Check integration", style: TextStyle(color: Colors.white))
+                        child: Text("Check integration", style: Theme.of(context).textTheme.button)
                     ),
                     Container(width: 10.0,),
                     RaisedButton(
                         color: Colors.redAccent,
                         onPressed: () => resetRegistration(),
-                        child: Text("Reset integration", style: TextStyle(color: Colors.white))
+                        child: Text("Reset integration", style: Theme.of(context).textTheme.button)
                     )
                   ],
                 ),

lib/pages/main/main.page.dart

@@ -347,11 +347,10 @@ class _MainPageState extends State<MainPage> with WidgetsBindingObserver, Ticker
           accountName: Text(HomeAssistant().userName),
           accountEmail: Text(HomeAssistant().locationName ?? ""),
           currentAccountPicture: CircleAvatar(
+            backgroundColor: Theme.of(context).backgroundColor,
             child: Text(
               HomeAssistant().userAvatarText,
-              style: TextStyle(
+              style: Theme.of(context).textTheme.display1
-                  fontSize: 32.0
-              ),
             ),
           ),
         )
@@ -360,21 +359,7 @@ class _MainPageState extends State<MainPage> with WidgetsBindingObserver, Ticker
       HomeAssistant().panels.forEach((Panel panel) {
         if (!panel.isHidden) {
           menuItems.add(
-              new ListTile(
+              panel.getMenuItemWidget(context)
-                  leading: Icon(MaterialDesignIcons.getIconDataFromIconName(panel.icon)),
-                  title: Row(
-                    crossAxisAlignment: CrossAxisAlignment.start,
-                    children: <Widget>[
-                      Text("${panel.title}"),
-                      Container(width: 4.0,),
-                      panel.isWebView ? Text("webview", style: TextStyle(fontSize: 8.0, color: Colors.black45),) : Container(width: 1.0,)
-                    ],
-                  ),
-                  onTap: () {
-                    Navigator.of(context).pop();
-                    panel.handleOpen(context);
-                  }
-              )
           );
         }
       });
@@ -458,9 +443,9 @@ class _MainPageState extends State<MainPage> with WidgetsBindingObserver, Ticker
               },
               child: Text(
                 "ha-client.app",
-                style: TextStyle(
+                style: Theme.of(context).textTheme.body1.copyWith(
                   color: Colors.blue,
-                    decoration: TextDecoration.underline
+                  decoration: TextDecoration.underline,
                 ),
               ),
             ),
@@ -474,9 +459,9 @@ class _MainPageState extends State<MainPage> with WidgetsBindingObserver, Ticker
               },
               child: Text(
                 "Terms and Conditions",
-                style: TextStyle(
+                style: Theme.of(context).textTheme.body1.copyWith(
                   color: Colors.blue,
-                    decoration: TextDecoration.underline
+                  decoration: TextDecoration.underline,
                 ),
               ),
             ),
@@ -490,9 +475,9 @@ class _MainPageState extends State<MainPage> with WidgetsBindingObserver, Ticker
               },
               child: Text(
                 "Privacy Policy",
-                style: TextStyle(
+                style: Theme.of(context).textTheme.body1.copyWith(
                   color: Colors.blue,
-                    decoration: TextDecoration.underline
+                  decoration: TextDecoration.underline,
                 ),
               ),
             )
@@ -648,9 +633,9 @@ class _MainPageState extends State<MainPage> with WidgetsBindingObserver, Ticker
           activePlayers.map((entity) => PopupMenuItem<String>(
             child: Text(
                 "${entity.displayName}",
-              style: TextStyle(
+              style: Theme.of(context).textTheme.body1.copyWith(
                 color: EntityColor.stateColor(entity.state)
-              ),
+              )
             ),
             value: "${entity.entityId}",
           )).toList()
@@ -679,7 +664,12 @@ class _MainPageState extends State<MainPage> with WidgetsBindingObserver, Ticker
                 shape: BoxShape.circle,
               ),
               child: Center(
-                child: Text("$playersCount", style: TextStyle(fontSize: 12)),
+                child: Text(
+                  "$playersCount",
+                  style: Theme.of(context).textTheme.caption.copyWith(
+                    color: Colors.white
+                  )
+                ),
               ),
             ),
           )
@@ -697,7 +687,7 @@ class _MainPageState extends State<MainPage> with WidgetsBindingObserver, Ticker
                 mainAxisAlignment: MainAxisAlignment.center,
                 children: <Widget>[
                   FlatButton(
-                    child: Text("Login with Home Assistant", style: TextStyle(fontSize: 16.0, color: Colors.white)),
+                    child: Text("Login with Home Assistant", style: Theme.of(context).textTheme.button),
                     color: Colors.blue,
                     onPressed: () => _fullLoad(),
                   )

lib/pages/play_media.page.dart

@@ -135,7 +135,9 @@ class _PlayMediaPageState extends State<PlayMediaPage> {
       if (_validationMessage.isNotEmpty) {
         children.add(Text(
           "$_validationMessage",
-          style: TextStyle(color: Colors.red)
+          style: Theme.of(context).textTheme.body1.copyWith(
+            color: Theme.of(context).errorColor
+          )
         ));
       }
       children.addAll(<Widget>[
@@ -193,7 +195,7 @@ class _PlayMediaPageState extends State<PlayMediaPage> {
                 },
                 child: Text(
                   "How?",
-                  style: TextStyle(
+                  style: Theme.of(context).textTheme.body1.copyWith(
                     color: Colors.blue,
                     decoration: TextDecoration.underline
                   ),

lib/pages/settings.page.dart

@@ -138,10 +138,7 @@ class _ConnectionSettingsPageState extends State<ConnectionSettingsPage> {
         children: <Widget>[
           Text(
               "Connection settings",
-              style: TextStyle(
+              style: Theme.of(context).textTheme.headline,
-                color: Colors.black45,
-                fontSize: 20.0
-              ),
           ),
           new Row(
             children: [
@@ -176,16 +173,13 @@ class _ConnectionSettingsPageState extends State<ConnectionSettingsPage> {
           ),
           new Text(
             "Try ports 80 and 443 if default is not working and you don't know why.",
-            style: TextStyle(color: Colors.grey),
+            style: Theme.of(context).textTheme.caption,
           ),
           Padding(
             padding: EdgeInsets.only(top: 20.0),
             child: Text(
               "UI",
-              style: TextStyle(
+              style: Theme.of(context).textTheme.headline,
-                  color: Colors.black45,
-                  fontSize: 20.0
-              ),
             ),
           ),
           new Row(
@@ -203,15 +197,14 @@ class _ConnectionSettingsPageState extends State<ConnectionSettingsPage> {
           ),
           Text(
             "Authentication settings",
-            style: TextStyle(
+            style: Theme.of(context).textTheme.headline,
-                color: Colors.black45,
-                fontSize: 20.0
-            ),
           ),
           Container(height: 10.0,),
           Text(
             "You can leave this field blank to make app generate new long-lived token automatically by asking you to login to your Home Assistant. Use this field only if you still want to use manually generated long-lived token. Leave it blank if you don't understand what we are talking about.",
-            style: TextStyle(color: Colors.redAccent),
+            style: Theme.of(context).textTheme.body1.copyWith(
+              color: Colors.redAccent
+            ),
           ),
           new TextField(
               decoration: InputDecoration(

lib/pages/widgets/page_loading_error.dart

@@ -23,7 +23,7 @@ class PageLoadingError extends StatelessWidget {
                     size: 48.0
                 )
             ),
-            Text(this.errorText, style: TextStyle(color: Colors.black45))
+            Text(this.errorText, style: Theme.of(context).textTheme.subtitle)
           ],
         )
       ],

lib/pages/widgets/page_loading_indicator.dart

@@ -14,7 +14,7 @@ class PageLoadingIndicator extends StatelessWidget {
                 padding: EdgeInsets.only(top: 40.0, bottom: 20.0),
                 child: CircularProgressIndicator()
             ),
-            Text("Loading...", style: TextStyle(color: Colors.black45))
+            Text("Loading...", style: Theme.of(context).textTheme.subtitle)
           ],
         )
       ],

lib/pages/widgets/product_purchase.widget.dart

@@ -40,10 +40,7 @@ class ProductPurchase extends StatelessWidget {
                       children: <Widget>[
                         Text(
                           "${product.title}",
-                          style: TextStyle(
+                          style: Theme.of(context).textTheme.body2,
-                              fontWeight: FontWeight.bold,
-                              fontSize: 16.0
-                          ),
                         ),
                         Container(height: Sizes.rowPadding,),
                         Text(
@@ -53,7 +50,9 @@ class ProductPurchase extends StatelessWidget {
                           softWrap: true,
                         ),
                         Container(height: Sizes.rowPadding,),
-                        Text("${product.price} $period", style: TextStyle(color: priceColor)),
+                        Text("${product.price} $period", style: Theme.of(context).textTheme.body1.copyWith(
+                          color: priceColor
+                        )),
                       ],
                     )
                 ),
@@ -61,7 +60,7 @@ class ProductPurchase extends StatelessWidget {
               Expanded(
                 flex: 2,
                 child: RaisedButton(
-                  child: Text(this.purchased ? buttonTextInactive : buttonText, style: TextStyle(color: Colors.white)),
+                  child: Text(this.purchased ? buttonTextInactive : buttonText, style: Theme.of(context).textTheme.button),
                   color: Colors.blue,
                   onPressed: this.purchased ? null : () => this.onBuy(this.product),
                 ),

lib/panels/panel_class.dart

@@ -56,7 +56,7 @@ class Panel {
           children: <Widget>[
             Text("${this.title}"),
             Container(width: 4.0,),
-            isWebView ? Text("webview", style: TextStyle(fontSize: 8.0, color: Colors.black45),) : Container(width: 1.0,)
+            isWebView ? Text("webview", style: Theme.of(context).textTheme.overline) : Container(width: 1.0,)
           ],
         ),
         onTap: () {

lib/plugins/history_chart/history_control_widget.dart

@@ -28,7 +28,7 @@ class HistoryControlWidget extends StatelessWidget {
             Expanded(
               child: Padding(
                 padding: EdgeInsets.only(right: 10.0),
-                child: _buildStates(),
+                child: _buildStates(context),
               ),
             ),
             _buildTime(),
@@ -46,18 +46,16 @@ class HistoryControlWidget extends StatelessWidget {
     }
   }
 
-  Widget _buildStates() {
+  Widget _buildStates(BuildContext context) {
     List<Widget> children = [];
     for (int i = 0; i < selectedStates.length; i++) {
       children.add(
           Text(
             "${selectedStates[i] ?? '-'}",
             textAlign: TextAlign.right,
-            style: TextStyle(
+            style: Theme.of(context).textTheme.title.copyWith(
-                fontWeight: FontWeight.bold,
+              color: EntityColor.historyStateColor(selectedStates[i], colorIndexes[i])
-                color: EntityColor.historyStateColor(selectedStates[i], colorIndexes[i]),
+            )
-                fontSize: 22.0
-            ),
           )
       );
     }