Forgot to update my local copy lol (#268)

* Light theme

* Add theme selector, fix bad theming in logs

* Rename layout listtile to layout & theme

lib/components/AlbumScreen/ItemInfo.dart

@@ -24,52 +24,78 @@ class ItemInfo extends StatelessWidget {
       crossAxisAlignment: CrossAxisAlignment.start,
       mainAxisAlignment: MainAxisAlignment.spaceBetween,
       children: [
-        if (item.type != "Playlist") _artistIconAndText(item, context),
-        _iconAndText(Icons.music_note, "${itemSongs.toString()} Songs"),
-        _iconAndText(
-            Icons.timer,
-            printDuration(Duration(
+        if (item.type != "Playlist") _ArtistIconAndText(album: item),
+        _IconAndText(
+            iconData: Icons.music_note, text: "${itemSongs.toString()} Songs"),
+        _IconAndText(
+            iconData: Icons.timer,
+            text: printDuration(Duration(
                 microseconds:
                     item.runTimeTicks == null ? 0 : item.runTimeTicks! ~/ 10))),
         if (item.type != "Playlist")
-          _iconAndText(Icons.event, item.productionYearString)
+          _IconAndText(iconData: Icons.event, text: item.productionYearString)
       ],
     );
   }
 }
 
-// TODO: Make this an actual widget instead of a function
-Widget _iconAndText(IconData iconData, String text) {
-  return Padding(
-    padding: const EdgeInsets.symmetric(vertical: 2),
-    child: Row(
-      mainAxisSize: MainAxisSize.min,
-      children: [
-        Icon(
-          iconData,
-          // Inactive icons have an opacity of 50%
-          // https://material.io/design/iconography/system-icons.html#color
-          color: Colors.white.withOpacity(0.5),
-        ),
-        const Padding(padding: EdgeInsets.symmetric(horizontal: 2)),
-        Expanded(
-          child: Text(
-            text,
-            maxLines: 1,
-            overflow: TextOverflow.ellipsis,
+class _IconAndText extends StatelessWidget {
+  const _IconAndText({
+    Key? key,
+    required this.iconData,
+    required this.text,
+  }) : super(key: key);
+
+  final IconData iconData;
+  final String text;
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.symmetric(vertical: 2),
+      child: Row(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          Icon(
+            iconData,
+            // Inactive icons have an opacity of 50% with dark theme and 38%
+            // with bright theme
+            // https://material.io/design/iconography/system-icons.html#color
+            color: Theme.of(context).iconTheme.color?.withOpacity(
+                Theme.of(context).brightness == Brightness.light ? 0.38 : 0.5),
           ),
-        )
-      ],
-    ),
-  );
+          const Padding(padding: EdgeInsets.symmetric(horizontal: 2)),
+          Expanded(
+            child: Text(
+              text,
+              maxLines: 1,
+              overflow: TextOverflow.ellipsis,
+            ),
+          )
+        ],
+      ),
+    );
+  }
 }
 
-Widget _artistIconAndText(BaseItemDto album, BuildContext context) {
-  final jellyfinApiData = GetIt.instance<JellyfinApiData>();
-  return GestureDetector(
-    onTap: () => jellyfinApiData.getItemById(album.albumArtists!.first.id).then(
-        (artist) => Navigator.of(context)
-            .pushNamed(ArtistScreen.routeName, arguments: artist)),
-    child: _iconAndText(Icons.person, processArtist(album.albumArtist)),
-  );
+class _ArtistIconAndText extends StatelessWidget {
+  const _ArtistIconAndText({Key? key, required this.album}) : super(key: key);
+
+  final BaseItemDto album;
+
+  @override
+  Widget build(BuildContext context) {
+    final jellyfinApiData = GetIt.instance<JellyfinApiData>();
+
+    return GestureDetector(
+      onTap: () => jellyfinApiData
+          .getItemById(album.albumArtists!.first.id)
+          .then((artist) => Navigator.of(context)
+              .pushNamed(ArtistScreen.routeName, arguments: artist)),
+      child: _IconAndText(
+        iconData: Icons.person,
+        text: processArtist(album.albumArtist),
+      ),
+    );
+  }
 }

lib/components/AlbumScreen/SongListTile.dart

@@ -73,27 +73,30 @@ class _SongListTileState extends State<SongListTile> {
         stream: _audioHandler.mediaItem,
         builder: (context, snapshot) {
           return RichText(
-            text: TextSpan(children: [
-              // third condition checks if the item is viewed from its album (instead of e.g. a playlist)
-              // same horrible check as in canGoToAlbum in GestureDetector below
-              if (mutableItem.indexNumber != null &&
-                  !widget.isSong &&
-                  mutableItem.albumId == widget.parentId)
+            text: TextSpan(
+              children: [
+                // third condition checks if the item is viewed from its album (instead of e.g. a playlist)
+                // same horrible check as in canGoToAlbum in GestureDetector below
+                if (mutableItem.indexNumber != null &&
+                    !widget.isSong &&
+                    mutableItem.albumId == widget.parentId)
+                  TextSpan(
+                      text: mutableItem.indexNumber.toString() + ". ",
+                      style: TextStyle(color: Theme.of(context).disabledColor)),
                 TextSpan(
-                    text: mutableItem.indexNumber.toString() + ". ",
-                    style: TextStyle(color: Theme.of(context).disabledColor)),
-              TextSpan(
-                text: mutableItem.name ?? "Unknown Name",
-                style: TextStyle(
-                  color: snapshot.data?.extras?["itemJson"]["Id"] ==
-                              mutableItem.id &&
-                          snapshot.data?.extras?["itemJson"]["AlbumId"] ==
-                              widget.parentId
-                      ? Theme.of(context).colorScheme.secondary
-                      : null,
+                  text: mutableItem.name ?? "Unknown Name",
+                  style: TextStyle(
+                    color: snapshot.data?.extras?["itemJson"]["Id"] ==
+                                mutableItem.id &&
+                            snapshot.data?.extras?["itemJson"]["AlbumId"] ==
+                                widget.parentId
+                        ? Theme.of(context).colorScheme.secondary
+                        : null,
+                  ),
                 ),
-              ),
-            ], style: const TextStyle(fontSize: 16.0)),
+              ],
+              style: Theme.of(context).textTheme.subtitle1,
+            ),
           );
         },
       ),
@@ -225,8 +228,8 @@ class _SongListTileState extends State<SongListTile> {
 
           case SongListTileMenuItems.InstantMix:
             await _audioServiceHelper.startInstantMixForItem(mutableItem);
-            ScaffoldMessenger.of(context)
-                .showSnackBar(const SnackBar(content: Text("Starting Instant Mix.")));
+            ScaffoldMessenger.of(context).showSnackBar(
+                const SnackBar(content: Text("Starting Instant Mix.")));
             break;
           case SongListTileMenuItems.GoToAlbum:
             late BaseItemDto album;

lib/components/LayoutSettingsScreen/ThemeSelector.dart

@@ -0,0 +1,39 @@
+import 'package:flutter/material.dart';
+import 'package:hive/hive.dart';
+
+import '../../services/ThemeModeHelper.dart';
+
+class ThemeSelector extends StatelessWidget {
+  const ThemeSelector({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return ValueListenableBuilder<Box<ThemeMode>>(
+      valueListenable: ThemeModeHelper.themeModeListener,
+      builder: (_, box, __) {
+        return ListTile(
+          title: const Text("Theme"),
+          trailing: DropdownButton<ThemeMode>(
+            value: box.get("ThemeMode"),
+            items: ThemeMode.values
+                .map((e) => DropdownMenuItem<ThemeMode>(
+                      child: Text(
+                        e.name.replaceFirst(
+                          e.name.characters.first,
+                          e.name.characters.first.toUpperCase(),
+                        ),
+                      ),
+                      value: e,
+                    ))
+                .toList(),
+            onChanged: (value) {
+              if (value != null) {
+                ThemeModeHelper.setThemeMode(value);
+              }
+            },
+          ),
+        );
+      },
+    );
+  }
+}

lib/components/LogsScreen/LogTile.dart

@@ -28,7 +28,7 @@ class LogTile extends StatelessWidget {
       child: Card(
         color: _logColor(logRecord.level, context),
         child: ExpansionTile(
-          leading: _logIcon(logRecord.level, context),
+          leading: _LogIcon(level: logRecord.level),
           key: PageStorageKey(logRecord.time),
           title: RichText(
             maxLines: 3,
@@ -55,54 +55,66 @@ class LogTile extends StatelessWidget {
           children: [
             Text(
               "Message",
-              style: Theme.of(context).textTheme.headline5,
+              style: Theme.of(context).primaryTextTheme.headline5,
             ),
-            Text(logRecord.message),
-            // This empty bit of text adds some space between the message and trace
-            const Text(""),
-            Text("Stack Trace", style: Theme.of(context).textTheme.headline5),
-            Text(logRecord.stackTrace.toString())
+            Text(
+              logRecord.message + "\n",
+              style: Theme.of(context).primaryTextTheme.bodyText2,
+            ),
+            Text(
+              "Stack Trace",
+              style: Theme.of(context).primaryTextTheme.headline5,
+            ),
+            Text(
+              logRecord.stackTrace.toString(),
+              style: Theme.of(context).primaryTextTheme.bodyText2,
+            )
           ],
         ),
       ),
     );
   }
 
-  Icon _logIcon(FinampLevel level, BuildContext context) {
-    Color? iconColor = Theme.of(context).iconTheme.color;
+  Color _logColor(FinampLevel level, BuildContext context) {
+    if (level == FinampLevel.WARNING) {
+      return Colors.orange;
+    } else if (level == FinampLevel.SEVERE) {
+      return Colors.red;
+    }
+
+    return Theme.of(context).colorScheme.secondary;
+  }
+}
+
+class _LogIcon extends StatelessWidget {
+  const _LogIcon({Key? key, required this.level}) : super(key: key);
+
+  final FinampLevel level;
+
+  @override
+  Widget build(BuildContext context) {
+    final color = Theme.of(context).primaryIconTheme.color;
 
     if (level == FinampLevel.INFO) {
       return Icon(
         Icons.info,
-        color: iconColor,
+        color: color,
       );
     } else if (level == FinampLevel.WARNING) {
       return Icon(
         Icons.warning,
-        color: iconColor,
+        color: color,
       );
     } else if (level == FinampLevel.SEVERE) {
       return Icon(
         Icons.error,
-        color: iconColor,
-      );
-    } else {
-      return Icon(
-        Icons.info,
-        color: iconColor,
+        color: color,
       );
     }
-  }
 
-  Color _logColor(FinampLevel level, BuildContext context) {
-    if (level == FinampLevel.INFO) {
-      return Colors.blue;
-    } else if (level == FinampLevel.WARNING) {
-      return Colors.orange;
-    } else if (level == FinampLevel.SEVERE) {
-      return Colors.red;
-    } else {
-      return Theme.of(context).cardColor;
-    }
+    return Icon(
+      Icons.info,
+      color: color,
+    );
   }
 }