frosty/lib/theme.dart
Tommy Chow 9a6892746d
Update to Material 3/You and other changes/fixes (#280)
* Use adaptive refresh indicators

* Add new message count indicator in chat

* Sync pubspec.lock

* Initial migration to material 3

* Restore default bottom sheet style

* Remove FrostyListTile and reset styles

* Use "Clear" button for all search history

* Add `require_trailing_commas` lint rule

* Exclude generated files from linter

* Use ListView for safe area support in bottom sheet

* Add initial dark theme

* Make sizing and units consistent

* Update onbaording spacings & copy

* Migrate to default material 3 buttons

* Add headers to chat details bottom sheet

* Simplify token log in method

* Use bottom sheet for account options

* Remove `AnimateScale` widget

* Tweak search paddings

* Update message spacing divisions

* Upgrade packages

* Update message spacing divisions

* Regenerate splash screens

* Update Inter & add google fonts

* Add initial material 3 themes

* Use adaptive alert dialogs

* Revert to oultined inputs

* Fix tooltip message

* Revert add google_fonts

* Improve themes and various styling

* Convert categories grid to list

* Tweak stream card thumbnail radii

* Tweak settings headers

* Left align floating snackbars

* Tweak search header padding

* Fix profile pics occasionally not rounded

* Use profile pic for settings button if logged in

* Redesign sleep timer

* Use divider theme and reduce thickness

* Use 0 letter spacing for tab bar titles

* Redesign category streams list

* Add border to tooltips

* Increase category card font weight

* Use outlined icon btton for chat user modal

* Reduce profile pic radius in search results

* Fix scrolll to top button safe area

* Add support for reply threads

* Reduce tooltip and snackbar border thickness

* Rebuild reply threads on new messages

* Upgrade packages (iOS)

* Reduce font weight for all chat alerts

* Use tabbars for pageview

* Add dividers everywhere

* Revert "Add dividers everywhere"

This reverts commit 5f0d349fdb.

* Remove fill from inputs

* Add dividers to settings

* Use segmented button for settings list

* Add scrollbar to lists with scrollcontroller

* Redesign badge/emote tooltip

* Remove outline from chat user modal buttons

* Remove divider from reply thread

* Use tap for chatters list and increase font weight

* Constrain emote tooltip width
2023-10-22 18:38:32 -04:00

156 lines
4.5 KiB
Dart

import 'dart:io';
import 'package:flutter/material.dart';
class FrostyThemes {
static const gray = Color.fromRGBO(18, 18, 18, 1);
static const purple = Color(0xff9146ff);
ThemeData createBaseTheme({
required Brightness brightness,
required Color colorSchemeSeed,
Color? backgroundColor,
}) {
final secondaryBackground = brightness == Brightness.light
? Colors.grey.shade200
: Colors.grey.shade800;
return ThemeData(
useMaterial3: true,
fontFamily: 'Inter',
brightness: brightness,
colorSchemeSeed: colorSchemeSeed,
splashFactory: Platform.isIOS ? NoSplash.splashFactory : null,
scaffoldBackgroundColor: backgroundColor,
bottomSheetTheme: BottomSheetThemeData(
showDragHandle: true,
backgroundColor: backgroundColor,
surfaceTintColor: backgroundColor,
),
dialogTheme: DialogTheme(
backgroundColor: backgroundColor,
surfaceTintColor: backgroundColor,
),
appBarTheme: AppBarTheme(
elevation: 0,
backgroundColor: backgroundColor,
surfaceTintColor: backgroundColor,
),
inputDecorationTheme: InputDecorationTheme(
contentPadding: const EdgeInsets.symmetric(horizontal: 16),
border: OutlineInputBorder(
borderRadius: const BorderRadius.all(Radius.circular(100)),
borderSide: BorderSide(color: secondaryBackground),
),
enabledBorder: OutlineInputBorder(
borderRadius: const BorderRadius.all(Radius.circular(100)),
borderSide: BorderSide(color: secondaryBackground),
),
disabledBorder: OutlineInputBorder(
borderRadius: const BorderRadius.all(Radius.circular(100)),
borderSide: BorderSide(color: secondaryBackground),
),
),
navigationBarTheme: NavigationBarThemeData(
elevation: 0,
backgroundColor: backgroundColor,
),
tabBarTheme: const TabBarTheme(
dividerColor: Colors.transparent,
),
tooltipTheme: TooltipThemeData(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
margin: const EdgeInsets.symmetric(horizontal: 8),
decoration: BoxDecoration(
color: backgroundColor,
borderRadius: const BorderRadius.all(Radius.circular(8)),
border: Border.all(color: secondaryBackground),
),
textStyle: TextStyle(
color: brightness == Brightness.dark ? Colors.white : Colors.black,
),
),
snackBarTheme: SnackBarThemeData(
showCloseIcon: true,
backgroundColor: backgroundColor,
shape: RoundedRectangleBorder(
side: BorderSide(color: secondaryBackground),
borderRadius: const BorderRadius.all(Radius.circular(8)),
),
behavior: SnackBarBehavior.floating,
),
dividerTheme: const DividerThemeData(
thickness: 0.5,
space: 0.5,
),
textTheme: const TextTheme(
// Used in alert dialog title.
headlineSmall: TextStyle(
fontWeight: FontWeight.bold,
),
// Used in app bar title.
titleLarge: TextStyle(
fontSize: 24,
fontWeight: FontWeight.bold,
),
titleMedium: TextStyle(letterSpacing: 0),
// Used in tab bar title.
titleSmall: TextStyle(
fontSize: 16,
letterSpacing: 0,
fontWeight: FontWeight.w600,
),
labelLarge: TextStyle(
letterSpacing: 0,
),
labelMedium: TextStyle(
letterSpacing: 0,
),
labelSmall: TextStyle(
letterSpacing: 0,
),
// Used in list tile title.
bodyLarge: TextStyle(
letterSpacing: 0,
fontWeight: FontWeight.w500,
),
bodyMedium: TextStyle(
letterSpacing: 0,
),
bodySmall: TextStyle(
letterSpacing: 0,
),
),
);
}
ThemeData get light {
final theme = createBaseTheme(
brightness: Brightness.light,
colorSchemeSeed: purple,
backgroundColor: Colors.white,
);
return theme;
}
ThemeData get dark {
final theme = createBaseTheme(
brightness: Brightness.dark,
colorSchemeSeed: purple,
backgroundColor: gray,
);
return theme;
}
ThemeData get black {
final theme = createBaseTheme(
brightness: Brightness.dark,
colorSchemeSeed: purple,
backgroundColor: Colors.black,
);
return theme;
}
}