Replace inline Colors.* with SojornColors tokens in video_player_with_comments, image_editor, traditional_quips_sheet

This commit is contained in:
Patrick Britton 2026-02-10 14:43:43 -06:00
parent 2551829604
commit cca4ffa08b
3 changed files with 40 additions and 37 deletions

View file

@ -8,6 +8,7 @@ import 'package:path_provider/path_provider.dart';
import 'package:pro_image_editor/pro_image_editor.dart'; import 'package:pro_image_editor/pro_image_editor.dart';
import '../../models/sojorn_media_result.dart'; import '../../models/sojorn_media_result.dart';
import '../../theme/tokens.dart';
import '../../theme/app_theme.dart'; import '../../theme/app_theme.dart';
class sojornImageEditor extends StatelessWidget { class sojornImageEditor extends StatelessWidget {
@ -32,8 +33,8 @@ class sojornImageEditor extends StatelessWidget {
ThemeData _buildEditorTheme() { ThemeData _buildEditorTheme() {
final baseTheme = ThemeData.dark(useMaterial3: true); final baseTheme = ThemeData.dark(useMaterial3: true);
final textTheme = GoogleFonts.interTextTheme(baseTheme.textTheme).apply( final textTheme = GoogleFonts.interTextTheme(baseTheme.textTheme).apply(
bodyColor: Colors.white, bodyColor: SojornColors.basicWhite,
displayColor: Colors.white, displayColor: SojornColors.basicWhite,
); );
return baseTheme.copyWith( return baseTheme.copyWith(
@ -42,18 +43,18 @@ class sojornImageEditor extends StatelessWidget {
primary: AppTheme.brightNavy, primary: AppTheme.brightNavy,
secondary: AppTheme.brightNavy, secondary: AppTheme.brightNavy,
surface: _matteBlack, surface: _matteBlack,
onSurface: Colors.white, onSurface: SojornColors.basicWhite,
), ),
textTheme: textTheme, textTheme: textTheme,
iconTheme: const IconThemeData(color: Colors.white), iconTheme: const IconThemeData(color: SojornColors.basicWhite),
appBarTheme: const AppBarTheme( appBarTheme: const AppBarTheme(
backgroundColor: _matteBlack, backgroundColor: _matteBlack,
foregroundColor: Colors.white, foregroundColor: SojornColors.basicWhite,
elevation: 0, elevation: 0,
), ),
sliderTheme: baseTheme.sliderTheme.copyWith( sliderTheme: baseTheme.sliderTheme.copyWith(
activeTrackColor: AppTheme.brightNavy, activeTrackColor: AppTheme.brightNavy,
inactiveTrackColor: Colors.white24, inactiveTrackColor: SojornColors.basicWhite.withValues(alpha: 0.24),
thumbColor: AppTheme.brightNavy, thumbColor: AppTheme.brightNavy,
overlayColor: AppTheme.brightNavy.withOpacity(0.2), overlayColor: AppTheme.brightNavy.withOpacity(0.2),
), ),
@ -211,7 +212,7 @@ class sojornImageEditor extends StatelessWidget {
body: Center( body: Center(
child: Text( child: Text(
message, message,
style: const TextStyle(color: Colors.white), style: const TextStyle(color: SojornColors.basicWhite),
), ),
), ),
); );

View file

@ -12,6 +12,7 @@ import '../models/thread_node.dart';
import '../providers/api_provider.dart'; import '../providers/api_provider.dart';
import '../services/auth_service.dart'; import '../services/auth_service.dart';
import '../theme/app_theme.dart'; import '../theme/app_theme.dart';
import '../theme/tokens.dart';
import '../widgets/media/signed_media_image.dart'; import '../widgets/media/signed_media_image.dart';
import '../widgets/reactions/reactions_display.dart'; import '../widgets/reactions/reactions_display.dart';
import '../widgets/reactions/reaction_picker.dart'; import '../widgets/reactions/reaction_picker.dart';
@ -187,7 +188,7 @@ class _TraditionalQuipsSheetState extends ConsumerState<TraditionalQuipsSheet> {
TextButton(onPressed: () => Navigator.pop(context, false), child: const Text('Cancel')), TextButton(onPressed: () => Navigator.pop(context, false), child: const Text('Cancel')),
TextButton( TextButton(
onPressed: () => Navigator.pop(context, true), onPressed: () => Navigator.pop(context, true),
child: const Text('Delete', style: TextStyle(color: Colors.redAccent)), child: const Text('Delete', style: TextStyle(color: SojornColors.destructive)),
), ),
], ],
), ),
@ -270,7 +271,7 @@ class _TraditionalQuipsSheetState extends ConsumerState<TraditionalQuipsSheet> {
borderRadius: const BorderRadius.vertical(top: Radius.circular(24)), borderRadius: const BorderRadius.vertical(top: Radius.circular(24)),
boxShadow: [ boxShadow: [
BoxShadow( BoxShadow(
color: Colors.black.withOpacity(0.1), color: SojornColors.overlayScrim,
blurRadius: 40, blurRadius: 40,
offset: const Offset(0, -10), offset: const Offset(0, -10),
), ),
@ -376,7 +377,7 @@ class _TraditionalQuipsSheetState extends ConsumerState<TraditionalQuipsSheet> {
), ),
const Spacer(), const Spacer(),
IconButton( IconButton(
icon: const Icon(Icons.delete_outline, color: Colors.redAccent), icon: const Icon(Icons.delete_outline, color: SojornColors.destructive),
onPressed: _bulkDelete, onPressed: _bulkDelete,
), ),
] ]
@ -398,7 +399,7 @@ class _TraditionalQuipsSheetState extends ConsumerState<TraditionalQuipsSheet> {
child: Column( child: Column(
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
children: [ children: [
const Icon(Icons.error_outline, color: Colors.redAccent, size: 48), const Icon(Icons.error_outline, color: SojornColors.destructive, size: 48),
const SizedBox(height: 16), const SizedBox(height: 16),
Text('Error: $_error', style: TextStyle(color: AppTheme.navyText), textAlign: TextAlign.center), Text('Error: $_error', style: TextStyle(color: AppTheme.navyText), textAlign: TextAlign.center),
], ],
@ -543,8 +544,8 @@ class _TraditionalQuipsSheetState extends ConsumerState<TraditionalQuipsSheet> {
], ],
), ),
child: _isPosting child: _isPosting
? const SizedBox(width: 20, height: 20, child: CircularProgressIndicator(strokeWidth: 2, color: Colors.white)) ? const SizedBox(width: 20, height: 20, child: CircularProgressIndicator(strokeWidth: 2, color: SojornColors.basicWhite))
: const Icon(Icons.send, color: Colors.white, size: 20), : const Icon(Icons.send, color: SojornColors.basicWhite, size: 20),
), ),
), ),
], ],
@ -609,7 +610,7 @@ class _CommentTile extends StatelessWidget {
boxShadow: [ boxShadow: [
if (!isSelected) if (!isSelected)
BoxShadow( BoxShadow(
color: Colors.black.withOpacity(0.02), color: SojornColors.basicBlack.withValues(alpha: 0.02),
blurRadius: 10, blurRadius: 10,
offset: const Offset(0, 4), offset: const Offset(0, 4),
), ),
@ -705,7 +706,7 @@ class _CommentTile extends StatelessWidget {
icon: Icon( icon: Icon(
node.post.isLiked == true ? Icons.favorite : Icons.favorite_border, node.post.isLiked == true ? Icons.favorite : Icons.favorite_border,
size: 20, size: 20,
color: node.post.isLiked == true ? Colors.redAccent : AppTheme.textSecondary.withOpacity(0.2), color: node.post.isLiked == true ? SojornColors.destructive : AppTheme.textSecondary.withOpacity(0.2),
), ),
onPressed: () => onReaction('❤️'), onPressed: () => onReaction('❤️'),
visualDensity: VisualDensity.compact, visualDensity: VisualDensity.compact,
@ -768,9 +769,9 @@ class _CommentTile extends StatelessWidget {
value: 'delete', value: 'delete',
child: Row( child: Row(
children: [ children: [
Icon(Icons.delete_outline, size: 18, color: Colors.redAccent), Icon(Icons.delete_outline, size: 18, color: SojornColors.destructive),
const SizedBox(width: 12), const SizedBox(width: 12),
const Text('Delete', style: TextStyle(color: Colors.redAccent)), const Text('Delete', style: TextStyle(color: SojornColors.destructive)),
], ],
) )
), ),

View file

@ -3,6 +3,7 @@ import 'package:google_fonts/google_fonts.dart';
import 'package:video_player/video_player.dart'; import 'package:video_player/video_player.dart';
import '../../models/post.dart'; import '../../models/post.dart';
import '../../theme/app_theme.dart'; import '../../theme/app_theme.dart';
import '../../theme/tokens.dart';
import 'video_comments_sheet.dart'; import 'video_comments_sheet.dart';
import 'media/signed_media_image.dart'; import 'media/signed_media_image.dart';
@ -70,7 +71,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Container( return Container(
color: Colors.black, color: SojornColors.basicBlack,
child: Stack( child: Stack(
children: [ children: [
// Video player // Video player
@ -109,7 +110,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
// Loading indicator // Loading indicator
const Center( const Center(
child: CircularProgressIndicator( child: CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(Colors.white), valueColor: AlwaysStoppedAnimation<Color>(SojornColors.basicWhite),
), ),
), ),
], ],
@ -147,10 +148,10 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
begin: Alignment.topCenter, begin: Alignment.topCenter,
end: Alignment.bottomCenter, end: Alignment.bottomCenter,
colors: [ colors: [
Colors.black.withValues(alpha: 0.3), const Color(0x4D000000),
Colors.transparent, SojornColors.transparent,
Colors.transparent, SojornColors.transparent,
Colors.black.withValues(alpha: 0.5), const Color(0x80000000),
], ],
), ),
), ),
@ -162,14 +163,14 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
children: [ children: [
IconButton( IconButton(
onPressed: () => Navigator.of(context).pop(), onPressed: () => Navigator.of(context).pop(),
icon: const Icon(Icons.arrow_back, color: Colors.white), icon: const Icon(Icons.arrow_back, color: SojornColors.basicWhite),
), ),
const Spacer(), const Spacer(),
IconButton( IconButton(
onPressed: () { onPressed: () {
// TODO: More options // TODO: More options
}, },
icon: const Icon(Icons.more_vert, color: Colors.white), icon: const Icon(Icons.more_vert, color: SojornColors.basicWhite),
), ),
], ],
), ),
@ -192,7 +193,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
}, },
icon: Icon( icon: Icon(
_isPlaying ? Icons.pause : Icons.play_arrow, _isPlaying ? Icons.pause : Icons.play_arrow,
color: Colors.white, color: SojornColors.basicWhite,
size: 48, size: 48,
), ),
), ),
@ -205,9 +206,9 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
_videoController!, _videoController!,
allowScrubbing: true, allowScrubbing: true,
colors: const VideoProgressColors( colors: const VideoProgressColors(
playedColor: Colors.white, playedColor: SojornColors.basicWhite,
backgroundColor: Colors.white24, backgroundColor: SojornColors.basicWhite.withValues(alpha: 0.24),
bufferedColor: Colors.white38, bufferedColor: SojornColors.basicWhite.withValues(alpha: 0.38),
), ),
), ),
), ),
@ -219,7 +220,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
child: Text( child: Text(
_formatDuration(_videoController?.value.position) ?? '0:00', _formatDuration(_videoController?.value.position) ?? '0:00',
style: GoogleFonts.inter( style: GoogleFonts.inter(
color: Colors.white, color: SojornColors.basicWhite,
fontSize: 12, fontSize: 12,
), ),
), ),
@ -279,12 +280,12 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
width: 48, width: 48,
height: 48, height: 48,
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.black.withValues(alpha: 0.3), color: const Color(0x4D000000),
shape: BoxShape.circle, shape: BoxShape.circle,
), ),
child: IconButton( child: IconButton(
onPressed: onTap, onPressed: onTap,
icon: Icon(icon, color: Colors.white, size: 24), icon: Icon(icon, color: SojornColors.basicWhite, size: 24),
), ),
), ),
if (count != null) ...[ if (count != null) ...[
@ -292,7 +293,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
Text( Text(
count > 999 ? '${(count / 1000).toStringAsFixed(1)}k' : count.toString(), count > 999 ? '${(count / 1000).toStringAsFixed(1)}k' : count.toString(),
style: GoogleFonts.inter( style: GoogleFonts.inter(
color: Colors.white, color: SojornColors.basicWhite,
fontSize: 12, fontSize: 12,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
), ),
@ -336,7 +337,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
? widget.post.author!.displayName![0].toUpperCase() ? widget.post.author!.displayName![0].toUpperCase()
: '?', : '?',
style: GoogleFonts.inter( style: GoogleFonts.inter(
color: Colors.white, color: SojornColors.basicWhite,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
fontSize: 12, fontSize: 12,
), ),
@ -350,7 +351,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
widget.post.author?.handle ?? widget.post.author?.handle ??
'Anonymous', 'Anonymous',
style: GoogleFonts.inter( style: GoogleFonts.inter(
color: Colors.white, color: SojornColors.basicWhite,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
fontSize: 14, fontSize: 14,
), ),
@ -365,7 +366,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
Text( Text(
widget.post.body, widget.post.body,
style: GoogleFonts.inter( style: GoogleFonts.inter(
color: Colors.white, color: SojornColors.basicWhite,
fontSize: 14, fontSize: 14,
height: 1.4, height: 1.4,
), ),
@ -383,7 +384,7 @@ class _VideoPlayerWithCommentsState extends State<VideoPlayerWithComments> {
showModalBottomSheet( showModalBottomSheet(
context: context, context: context,
isScrollControlled: true, isScrollControlled: true,
backgroundColor: Colors.transparent, backgroundColor: SojornColors.transparent,
builder: (context) => VideoCommentsSheet( builder: (context) => VideoCommentsSheet(
postId: widget.post.id, postId: widget.post.id,
initialCommentCount: _commentCount, initialCommentCount: _commentCount,