Replace inline Colors.* with SojornColors tokens in 8 more widgets: composer, reactions, modals, safety, button, radial_menu

This commit is contained in:
Patrick Britton 2026-02-10 13:59:15 -06:00
parent 9ec4ad408d
commit 9b11b95a57
8 changed files with 32 additions and 24 deletions

View file

@ -1,5 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import '../../theme/app_theme.dart'; import '../../theme/app_theme.dart';
import '../../theme/tokens.dart';
/// Simple text styling options (Twitter/Bluesky style) /// Simple text styling options (Twitter/Bluesky style)
enum TextStyleOption { enum TextStyleOption {
@ -99,7 +100,7 @@ class FormattingToolbar extends StatelessWidget {
child: Container( child: Container(
padding: const EdgeInsets.all(8), padding: const EdgeInsets.all(8),
decoration: BoxDecoration( decoration: BoxDecoration(
color: isActive ? AppTheme.queenPink.withValues(alpha: 0.3) : Colors.transparent, color: isActive ? AppTheme.queenPink.withValues(alpha: 0.3) : SojornColors.transparent,
borderRadius: BorderRadius.circular(4), borderRadius: BorderRadius.circular(4),
), ),
child: Icon( child: Icon(

View file

@ -1,5 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import '../../theme/app_theme.dart'; import '../../theme/app_theme.dart';
import '../../theme/tokens.dart';
/// Keyboard-attached toolbar for the composer with attachments, formatting, topic, and counter. /// Keyboard-attached toolbar for the composer with attachments, formatting, topic, and counter.
class ComposerToolbar extends StatelessWidget { class ComposerToolbar extends StatelessWidget {
@ -102,7 +103,7 @@ class ComposerToolbar extends StatelessWidget {
onPressed: onToggleNsfw, onPressed: onToggleNsfw,
icon: Icon( icon: Icon(
Icons.visibility_off_outlined, Icons.visibility_off_outlined,
color: isNsfw ? Colors.amber.shade700 : AppTheme.navyText.withValues(alpha: 0.4), color: isNsfw ? AppTheme.nsfwWarningIcon : AppTheme.navyText.withValues(alpha: 0.4),
), ),
tooltip: isNsfw ? 'Marked as NSFW' : 'Mark as NSFW', tooltip: isNsfw ? 'Marked as NSFW' : 'Mark as NSFW',
), ),

View file

@ -1,6 +1,7 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_quill/flutter_quill.dart'; import 'package:flutter_quill/flutter_quill.dart';
import '../../theme/app_theme.dart'; import '../../theme/app_theme.dart';
import '../../theme/tokens.dart';
class QuillEditorWrapper extends StatelessWidget { class QuillEditorWrapper extends StatelessWidget {
final QuillController controller; final QuillController controller;
@ -38,7 +39,7 @@ class QuillEditorWrapper extends StatelessWidget {
Container( Container(
constraints: const BoxConstraints(minHeight: 200), constraints: const BoxConstraints(minHeight: 200),
decoration: const BoxDecoration( decoration: const BoxDecoration(
color: Colors.white, color: SojornColors.basicWhite,
), ),
child: QuillEditor.basic( child: QuillEditor.basic(
controller: controller, controller: controller,

View file

@ -2,6 +2,7 @@ import 'dart:ui';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import '../../models/post.dart'; import '../../models/post.dart';
import '../../theme/app_theme.dart'; import '../../theme/app_theme.dart';
import '../../theme/tokens.dart';
import '../../services/api_service.dart'; import '../../services/api_service.dart';
class SanctuarySheet extends StatefulWidget { class SanctuarySheet extends StatefulWidget {
@ -12,7 +13,7 @@ class SanctuarySheet extends StatefulWidget {
static Future<void> show(BuildContext context, Post post) { static Future<void> show(BuildContext context, Post post) {
return showModalBottomSheet( return showModalBottomSheet(
context: context, context: context,
backgroundColor: Colors.transparent, backgroundColor: SojornColors.transparent,
isScrollControlled: true, isScrollControlled: true,
builder: (_) => SanctuarySheet(post: post), builder: (_) => SanctuarySheet(post: post),
); );
@ -110,7 +111,7 @@ class _SanctuarySheetState extends State<SanctuarySheet> {
icon: Icons.block_flipped, icon: Icons.block_flipped,
title: "Exclude User", title: "Exclude User",
subtitle: "Stop all interactions structurally", subtitle: "Stop all interactions structurally",
color: Colors.redAccent.withOpacity(0.8), color: SojornColors.destructive.withValues(alpha: 0.8),
onTap: () => setState(() => _step = 3), onTap: () => setState(() => _step = 3),
), ),
], ],
@ -185,7 +186,7 @@ class _SanctuarySheetState extends State<SanctuarySheet> {
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)), shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)),
), ),
onPressed: _submitReport, onPressed: _submitReport,
child: const Text("Submit Report", style: TextStyle(color: Colors.white)), child: const Text("Submit Report", style: TextStyle(color: SojornColors.basicWhite)),
), ),
), ),
TextButton( TextButton(
@ -199,7 +200,7 @@ class _SanctuarySheetState extends State<SanctuarySheet> {
Widget _buildBlockConfirmation() { Widget _buildBlockConfirmation() {
return Column( return Column(
children: [ children: [
const Icon(Icons.warning_amber_rounded, color: Colors.redAccent, size: 64), const Icon(Icons.warning_amber_rounded, color: SojornColors.destructive, size: 64),
const SizedBox(height: 16), const SizedBox(height: 16),
Text( Text(
"Exclude from Circle?", "Exclude from Circle?",
@ -220,11 +221,11 @@ class _SanctuarySheetState extends State<SanctuarySheet> {
height: 56, height: 56,
child: ElevatedButton( child: ElevatedButton(
style: ElevatedButton.styleFrom( style: ElevatedButton.styleFrom(
backgroundColor: Colors.redAccent, backgroundColor: SojornColors.destructive,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)), shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)),
), ),
onPressed: _confirmBlock, onPressed: _confirmBlock,
child: const Text("Yes, Exclude structurally", style: TextStyle(color: Colors.white)), child: const Text("Yes, Exclude structurally", style: TextStyle(color: SojornColors.basicWhite)),
), ),
), ),
const SizedBox(height: 8), const SizedBox(height: 8),

View file

@ -2,6 +2,7 @@ import 'dart:math' as math;
import 'dart:ui'; import 'dart:ui';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import '../theme/app_theme.dart'; import '../theme/app_theme.dart';
import '../theme/tokens.dart';
class RadialMenuOverlay extends StatefulWidget { class RadialMenuOverlay extends StatefulWidget {
final bool isVisible; final bool isVisible;
@ -95,7 +96,7 @@ class _RadialMenuOverlayState extends State<RadialMenuOverlay>
child: BackdropFilter( child: BackdropFilter(
filter: ImageFilter.blur(sigmaX: 5, sigmaY: 5), filter: ImageFilter.blur(sigmaX: 5, sigmaY: 5),
child: Container( child: Container(
color: Colors.black54, color: SojornColors.overlayDark,
), ),
), ),
), ),
@ -219,11 +220,11 @@ class _MenuButton extends StatelessWidget {
width: 70, width: 70,
height: 70, height: 70,
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.white, color: SojornColors.basicWhite,
shape: BoxShape.circle, shape: BoxShape.circle,
boxShadow: [ boxShadow: [
BoxShadow( BoxShadow(
color: Colors.black.withOpacity(0.2), color: SojornColors.overlayScrim,
blurRadius: 12, blurRadius: 12,
offset: const Offset(0, 4), offset: const Offset(0, 4),
), ),
@ -239,11 +240,11 @@ class _MenuButton extends StatelessWidget {
Container( Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 4), padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 4),
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.white, color: SojornColors.basicWhite,
borderRadius: BorderRadius.circular(12), borderRadius: BorderRadius.circular(12),
boxShadow: [ boxShadow: [
BoxShadow( BoxShadow(
color: Colors.black.withOpacity(0.15), color: SojornColors.overlayScrim,
blurRadius: 8, blurRadius: 8,
offset: const Offset(0, 2), offset: const Offset(0, 2),
), ),

View file

@ -7,6 +7,7 @@ import 'package:google_fonts/google_fonts.dart';
import 'package:url_launcher/url_launcher.dart'; import 'package:url_launcher/url_launcher.dart';
import 'dart:convert'; import 'dart:convert';
import '../../theme/app_theme.dart'; import '../../theme/app_theme.dart';
import '../../theme/tokens.dart';
class ReactionPicker extends StatefulWidget { class ReactionPicker extends StatefulWidget {
final Function(String) onReactionSelected; final Function(String) onReactionSelected;
@ -203,7 +204,7 @@ class _ReactionPickerState extends State<ReactionPicker> with SingleTickerProvid
Widget build(BuildContext context) { Widget build(BuildContext context) {
if (_isLoading) { if (_isLoading) {
return Dialog( return Dialog(
backgroundColor: Colors.transparent, backgroundColor: SojornColors.transparent,
child: Container( child: Container(
width: 400, width: 400,
height: 300, height: 300,
@ -224,7 +225,7 @@ class _ReactionPickerState extends State<ReactionPicker> with SingleTickerProvid
final myReactions = widget.myReactions ?? {}; final myReactions = widget.myReactions ?? {};
return Dialog( return Dialog(
backgroundColor: Colors.transparent, backgroundColor: SojornColors.transparent,
child: Container( child: Container(
padding: const EdgeInsets.all(20), padding: const EdgeInsets.all(20),
decoration: BoxDecoration( decoration: BoxDecoration(
@ -236,7 +237,7 @@ class _ReactionPickerState extends State<ReactionPicker> with SingleTickerProvid
), ),
boxShadow: [ boxShadow: [
BoxShadow( BoxShadow(
color: Colors.black.withValues(alpha: 0.2), color: SojornColors.overlayScrim,
blurRadius: 20, blurRadius: 20,
offset: const Offset(0, 10), offset: const Offset(0, 10),
), ),
@ -403,7 +404,7 @@ class _ReactionPickerState extends State<ReactionPicker> with SingleTickerProvid
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
const Divider(color: Colors.grey), Divider(color: SojornColors.textDisabled),
const SizedBox(height: 8), const SizedBox(height: 8),
Text( Text(
'Credits:', 'Credits:',
@ -474,7 +475,7 @@ class _ReactionPickerState extends State<ReactionPicker> with SingleTickerProvid
final isSelected = myReactions.contains(reaction); final isSelected = myReactions.contains(reaction);
return Material( return Material(
color: Colors.transparent, color: SojornColors.transparent,
child: InkWell( child: InkWell(
onTap: () { onTap: () {
Navigator.of(context).pop(); Navigator.of(context).pop();
@ -517,7 +518,7 @@ class _ReactionPickerState extends State<ReactionPicker> with SingleTickerProvid
child: Text( child: Text(
count > 99 ? '99+' : '$count', count > 99 ? '99+' : '$count',
style: GoogleFonts.inter( style: GoogleFonts.inter(
color: Colors.white, color: SojornColors.basicWhite,
fontSize: 8, fontSize: 8,
fontWeight: FontWeight.w600, fontWeight: FontWeight.w600,
), ),

View file

@ -2,6 +2,7 @@ import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart'; import 'package:url_launcher/url_launcher.dart';
import '../theme/app_theme.dart'; import '../theme/app_theme.dart';
import '../theme/tokens.dart';
/// Safety Redirect Sheet /// Safety Redirect Sheet
/// ///
@ -40,7 +41,7 @@ class SafetyRedirectSheet extends StatelessWidget {
CupertinoIcons.arrow_up_right_square, CupertinoIcons.arrow_up_right_square,
size: 56, size: 56,
color: theme.iconTheme.color?.withValues(alpha: 0.7) ?? color: theme.iconTheme.color?.withValues(alpha: 0.7) ??
Colors.grey.shade600, SojornColors.textDisabled,
), ),
const SizedBox(height: 20), const SizedBox(height: 20),
@ -114,7 +115,7 @@ class SafetyRedirectSheet extends StatelessWidget {
Icon( Icon(
CupertinoIcons.hand_raised, CupertinoIcons.hand_raised,
color: theme.iconTheme.color?.withValues(alpha: 0.6) ?? color: theme.iconTheme.color?.withValues(alpha: 0.6) ??
Colors.grey.shade600, SojornColors.textDisabled,
size: 18, size: 18,
), ),
const SizedBox(width: 8), const SizedBox(width: 8),

View file

@ -1,5 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import '../theme/app_theme.dart'; import '../theme/app_theme.dart';
import '../theme/tokens.dart';
/// Custom button widget enforcing sojorn's visual system /// Custom button widget enforcing sojorn's visual system
/// Variants: primary, secondary, tertiary, destructive /// Variants: primary, secondary, tertiary, destructive
@ -101,7 +102,7 @@ class sojornButton extends StatelessWidget {
disabledForegroundColor: AppTheme.navyText disabledForegroundColor: AppTheme.navyText
.withOpacity(0.5), // Replaced AppTheme.textDisabled .withOpacity(0.5), // Replaced AppTheme.textDisabled
elevation: 0, elevation: 0,
shadowColor: Colors.transparent, shadowColor: SojornColors.transparent,
padding: _getPadding(), padding: _getPadding(),
shape: RoundedRectangleBorder( shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular( borderRadius: BorderRadius.circular(
@ -122,7 +123,7 @@ class sojornButton extends StatelessWidget {
disabledForegroundColor: AppTheme.navyText disabledForegroundColor: AppTheme.navyText
.withOpacity(0.5), // Replaced AppTheme.textDisabled .withOpacity(0.5), // Replaced AppTheme.textDisabled
elevation: 0, elevation: 0,
shadowColor: Colors.transparent, shadowColor: SojornColors.transparent,
padding: _getPadding(), padding: _getPadding(),
shape: RoundedRectangleBorder( shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular( borderRadius: BorderRadius.circular(