Use more consistent styles for lists and adjust alignment.

lib/app/views/app_page.dart

@@ -56,7 +56,8 @@ class AppPage extends ConsumerWidget {
                     alignment:
                         centered ? Alignment.center : Alignment.centerLeft,
                     child: Padding(
-                      padding: const EdgeInsets.all(16.0),
+                      padding: const EdgeInsets.symmetric(
+                          vertical: 16.0, horizontal: 18.0),
                       child: Wrap(
                         spacing: 4,
                         runSpacing: 4,
@@ -78,7 +79,12 @@ class AppPage extends ConsumerWidget {
         title: title,
         centerTitle: true,
         titleTextStyle: Theme.of(context).textTheme.titleLarge,
-        actions: const [DeviceButton()],
+        actions: const [
+          Padding(
+            padding: EdgeInsets.only(right: 6),
+            child: DeviceButton(),
+          ),
+        ],
       ),
       drawer: hasDrawer ? const MainPageDrawer() : null,
       body: centered ? Center(child: _buildScrollView()) : _buildScrollView(),

lib/fido/views/locked_page.dart

@@ -142,7 +142,7 @@ class _PinEntryFormState extends ConsumerState<_PinEntryForm> {
   Widget build(BuildContext context) {
     final noFingerprints = widget._state.bioEnroll == false;
     return Padding(
-      padding: const EdgeInsets.symmetric(horizontal: 16.0),
+      padding: const EdgeInsets.symmetric(horizontal: 18.0),
       child: Column(
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [

lib/fido/views/unlocked_page.dart

@@ -7,6 +7,7 @@ import '../../app/views/app_page.dart';
 import '../../app/views/graphics.dart';
 import '../../app/views/message_page.dart';
 import '../../theme.dart';
+import '../../widgets/list_title.dart';
 import '../models.dart';
 import '../state.dart';
 import 'add_fingerprint_dialog.dart';
@@ -32,7 +33,7 @@ class FidoUnlockedPage extends ConsumerWidget {
       }
       final creds = data.value;
       if (creds.isNotEmpty) {
-        children.add(const ListTile(title: Text('Credentials')));
+        children.add(const ListTitle('Credentials'));
         children.addAll(
           creds.map(
             (cred) => ListTile(
@@ -78,7 +79,7 @@ class FidoUnlockedPage extends ConsumerWidget {
       }
       final fingerprints = data.value;
       if (fingerprints.isNotEmpty) {
-        children.add(const ListTile(title: Text('Fingerprints')));
+        children.add(const ListTitle('Fingerprints'));
         children.addAll(fingerprints.map((fp) => ListTile(
               leading: CircleAvatar(
                 foregroundColor: Theme.of(context).colorScheme.onSecondary,
@@ -121,7 +122,8 @@ class FidoUnlockedPage extends ConsumerWidget {
       return AppPage(
         title: const Text('WebAuthn'),
         actions: _buildActions(context),
-        child: Column(children: children),
+        child: Column(
+            crossAxisAlignment: CrossAxisAlignment.start, children: children),
       );
     }
 

lib/oath/views/account_list.dart

@@ -3,6 +3,7 @@ import 'package:flutter/services.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 
 import '../../app/models.dart';
+import '../../widgets/list_title.dart';
 import '../models.dart';
 import '../state.dart';
 import 'account_view.dart';
@@ -93,28 +94,14 @@ class _AccountListState extends ConsumerState<AccountList> {
 
     return Column(
       children: [
-        if (pinnedCreds.isNotEmpty)
-          ListTile(
-            minVerticalPadding: 16,
-            title: Text(
-              'PINNED',
-              style: Theme.of(context).textTheme.labelSmall,
-            ),
-          ),
+        if (pinnedCreds.isNotEmpty) const ListTitle('Pinned'),
         ...pinnedCreds.map(
           (entry) => AccountView(
             entry.credential,
             focusNode: _focusNodes[entry.credential],
           ),
         ),
-        if (creds.isNotEmpty)
-          ListTile(
-            minVerticalPadding: 16,
-            title: Text(
-              'ACCOUNTS',
-              style: Theme.of(context).textTheme.labelSmall,
-            ),
-          ),
+        if (creds.isNotEmpty) const ListTitle('Accounts'),
         ...creds.map(
           (entry) => AccountView(
             entry.credential,

lib/oath/views/account_view.dart

@@ -132,7 +132,6 @@ class AccountView extends ConsumerWidget with AccountMixin {
           title: Text(
             title,
             overflow: TextOverflow.fade,
-            style: Theme.of(context).textTheme.headlineSmall,
             maxLines: 1,
             softWrap: false,
           ),
@@ -140,7 +139,6 @@ class AccountView extends ConsumerWidget with AccountMixin {
               ? Text(
                   subtitle!,
                   overflow: TextOverflow.fade,
-                  style: Theme.of(context).textTheme.bodySmall,
                   maxLines: 1,
                   softWrap: false,
                 )

lib/theme.dart

@@ -62,6 +62,11 @@ class AppTheme {
         floatingActionButtonTheme: const FloatingActionButtonThemeData(
           backgroundColor: primaryBlue,
         ),
+        listTileTheme: const ListTileThemeData(
+          // For alignment under menu button
+          contentPadding: EdgeInsets.symmetric(horizontal: 18.0),
+          visualDensity: VisualDensity.compact,
+        ),
         fontFamily: 'Roboto',
         textTheme: const TextTheme(
           //bodySmall: TextStyle(color: Colors.grey.shade500),
@@ -134,6 +139,11 @@ class AppTheme {
           shape: RoundedRectangleBorder(
             borderRadius: BorderRadius.circular(8),
           ),
+          labelStyle: TextStyle(
+              // Should match titleMedium
+              color: Colors.grey.shade200,
+              fontWeight: FontWeight.w300,
+              fontSize: 16),
         ),
         dialogTheme: const DialogTheme(
           backgroundColor: Color(0xff323232),
@@ -142,6 +152,11 @@ class AppTheme {
           foregroundColor: Colors.grey.shade900,
           backgroundColor: primaryGreen,
         ),
+        listTileTheme: const ListTileThemeData(
+          // For alignment under menu button
+          contentPadding: EdgeInsets.symmetric(horizontal: 18.0),
+          visualDensity: VisualDensity.compact,
+        ),
         fontFamily: 'Roboto',
         textTheme: TextTheme(
           bodySmall: TextStyle(color: Colors.grey.shade500),
@@ -151,7 +166,10 @@ class AppTheme {
           labelMedium: TextStyle(color: Colors.cyan.shade200),
           labelLarge: TextStyle(color: Colors.cyan.shade500),
           titleSmall: TextStyle(color: Colors.grey.shade600),
-          titleMedium: const TextStyle(),
+          titleMedium: TextStyle(
+              color: Colors.grey.shade200,
+              fontWeight: FontWeight.w300,
+              fontSize: 16),
           titleLarge: TextStyle(
               color: Colors.grey.shade500,
               fontWeight: FontWeight.w400,

lib/widgets/list_title.dart

@@ -0,0 +1,14 @@
+import 'package:flutter/material.dart';
+
+class ListTitle extends StatelessWidget {
+  final String title;
+
+  const ListTitle(this.title, {super.key});
+  @override
+  Widget build(BuildContext context) => ListTile(
+        title: Text(
+          title.toUpperCase(),
+          style: Theme.of(context).textTheme.labelSmall,
+        ),
+      );
+}