mirror of
https://github.com/block/buzz.git
synced 2026-10-27 12:40:30 +00:00
## Summary - Restores `#` and lock icons for public and private channels on Home, with matching loading placeholders. - Updates the dark-mode navigation colors to the desktop design-system tokens (read and unread text, section headings). - Replaces the chat color picker with the seven desktop accents (Gray, Chartreuse, Flame, Magenta, Iris, Cobalt, Jade). Saved legacy colors map to the closest one. - Uses white text in your own bubbles, and black where white falls below 4.5:1 (Chartreuse, dark-mode Gray). Links (underlined), quotes, tables and code use the same text color. - Insets code blocks in bubbles evenly, with corners concentric to the bubble and even inner padding. - The swipe-to-reply indicator uses the chosen chat color. ## Testing - `flutter analyze` and `dart format` are clean. The full mobile suite passes (3,705 tests). - Installed and checked on a Pixel 10 and an iPhone Air against a real community. 🤖 Generated with [Claude Code](https://claude.com/claude-code) --------- Signed-off-by: kenny lopez <klopez4212@gmail.com> Co-authored-by: Terp <5856f6900e8e0a4e0ea1f4f8d2ee33e4753d2119bc122f94ecafc660b46c0511@buzz.block.builderlab.xyz> Co-authored-by: Queue <874bf2d815c2c4b459b90438c669c57f2702f3a76bb6e16fa97184259aac3e9e@buzz.block.builderlab.xyz> Co-authored-by: Claude Opus 5.5 <noreply@anthropic.com>
117 lines
4.9 KiB
Dart
117 lines
4.9 KiB
Dart
import 'package:flutter/material.dart';
|
|
|
|
import 'accent_colors.dart';
|
|
import 'app_colors.dart';
|
|
import 'theme_extensions.dart';
|
|
|
|
/// Name of the first-party Buzz theme. Buzz reuses the GitHub Light palette for
|
|
/// every base color; the one thing that sets it apart is a branded gradient
|
|
/// painted across the app's top section. Mirrors desktop, where the same
|
|
/// gradient fills the sidebar canvas — see `data-buzz-sidebar` in
|
|
/// `desktop/src/shared/styles/globals/theme.css`.
|
|
const buzzThemeName = 'buzz';
|
|
|
|
/// Name of the dark counterpart, which reuses the GitHub Dark palette and the
|
|
/// dark-tuned gradient stops. Paired with [buzzThemeName] in `themePairs`, so
|
|
/// the two behave as a single "Buzz" choice under System mode.
|
|
const buzzDarkThemeName = 'buzz-dark';
|
|
|
|
/// Whether [themeName] is either half of the Buzz pair. Both halves enable the
|
|
/// gradient so System mode keeps it on across an OS light/dark switch.
|
|
bool isBuzzTheme(String themeName) =>
|
|
themeName == buzzThemeName || themeName == buzzDarkThemeName;
|
|
|
|
/// Whether the current widget tree is using the first-party Buzz treatment.
|
|
bool isBuzzThemeContext(BuildContext context) =>
|
|
Theme.of(context).extension<AppColors>()?.topSectionGradient != null;
|
|
|
|
/// Primary foreground for the mobile top navigation.
|
|
///
|
|
/// Every theme uses its own [ColorScheme.onSurface]. Buzz is the exception:
|
|
/// its desktop-matching top gradient needs a neutral black or white foreground
|
|
/// rather than the accent-derived color scheme foreground.
|
|
Color navigationPrimaryForeground(BuildContext context) {
|
|
final scheme = Theme.of(context).colorScheme;
|
|
if (!isBuzzThemeContext(context)) return scheme.onSurface;
|
|
return scheme.brightness == Brightness.dark ? Colors.white : Colors.black;
|
|
}
|
|
|
|
/// Secondary label and placeholder foreground for the mobile top navigation.
|
|
Color navigationSecondaryForeground(BuildContext context) {
|
|
final scheme = Theme.of(context).colorScheme;
|
|
if (!isBuzzThemeContext(context)) return scheme.onSurfaceVariant;
|
|
return navigationPrimaryForeground(context).withValues(alpha: 0.4);
|
|
}
|
|
|
|
/// Channel-section label and icon foreground for the mobile side navigation.
|
|
///
|
|
/// Section labels need more hierarchy than a placeholder. Buzz therefore uses
|
|
/// a stronger neutral over its gradient, while all other themes preserve their
|
|
/// established secondary foreground token.
|
|
Color navigationSectionForeground(BuildContext context) {
|
|
final scheme = Theme.of(context).colorScheme;
|
|
if (!isBuzzThemeContext(context)) return scheme.onSurfaceVariant;
|
|
return navigationPrimaryForeground(context).withValues(alpha: 0.8);
|
|
}
|
|
|
|
/// Search-field surface for the mobile top navigation.
|
|
Color navigationSearchSurface(BuildContext context) {
|
|
return context.controlSurface;
|
|
}
|
|
|
|
/// A low-contrast navigation divider derived from the active theme foreground.
|
|
Color navigationDivider(BuildContext context, double opacity) =>
|
|
navigationPrimaryForeground(context).withValues(alpha: opacity);
|
|
|
|
/// Buzz renders with its fixed neutral foreground while preserving the stored
|
|
/// wire accent so the user's choice returns on another theme.
|
|
int effectiveAccentIndex(String themeName, String storedAccent) {
|
|
if (isBuzzTheme(themeName)) return neutralAccentIndex;
|
|
return accentIndexForWireValue(storedAccent) ?? defaultAccentIndex;
|
|
}
|
|
|
|
/// Gradient stops, matching desktop's `--buzz-gradient-*` custom properties.
|
|
const _lightTop = Color(0xFFE6E6B6);
|
|
const _lightBottom = Color(0xFFC4D0DA);
|
|
const _darkTop = Color(0xFF4A4616);
|
|
const _darkBottom = Color(0xFF0A1423);
|
|
|
|
/// The Buzz gradient for the app's top section, or null when [themeName] is not
|
|
/// a Buzz theme — in which case the section keeps its default frosted fill.
|
|
///
|
|
/// The stops are fully opaque: under Buzz the color replaces the frosted
|
|
/// treatment rather than tinting it, matching desktop's solid sidebar canvas.
|
|
///
|
|
/// [brightness] comes from the applied color scheme rather than the theme name,
|
|
/// so System mode picks the right stops as the OS switches.
|
|
LinearGradient? buzzTopSectionGradient(
|
|
String themeName,
|
|
Brightness brightness,
|
|
) {
|
|
if (!isBuzzTheme(themeName)) return null;
|
|
|
|
final isDark = brightness == Brightness.dark;
|
|
return LinearGradient(
|
|
begin: Alignment.topCenter,
|
|
end: Alignment.bottomCenter,
|
|
colors: [
|
|
isDark ? _darkTop : _lightTop,
|
|
isDark ? _darkBottom : _lightBottom,
|
|
],
|
|
);
|
|
}
|
|
|
|
/// Desktop navigation ink distinguishes read destinations from unread labels.
|
|
Color channelNavigationForeground(BuildContext context, {bool unread = false}) {
|
|
if (unread || Theme.of(context).brightness != Brightness.dark) {
|
|
return navigationPrimaryForeground(context);
|
|
}
|
|
return Theme.of(context).colorScheme.onSurfaceVariant;
|
|
}
|
|
|
|
/// Metadata ink used by Home section headings and muted destinations.
|
|
Color navigationMetadataForeground(BuildContext context) =>
|
|
Theme.of(context).brightness == Brightness.dark
|
|
? const Color(0xFFA4A4A4)
|
|
: const Color(0xFF5F5F5F);
|