mirror of
https://github.com/block/buzz.git
synced 2026-10-30 05:51:46 +00:00
## Summary Polish mobile Home and Solo: group Search/Inbox beside a separate profile avatar, move Inbox and Settings to bottom-up pages with Close controls, and place tabs opposite the plus/compose action. Morph plus to compose clockwise when entering Solo and reverse counterclockwise when returning Home, with a directional quarter-turn of the icon inside a level button and a subtle scale pulse, respecting reduced motion. Align Search’s Close control with Inbox, simplify its placeholder, and initialize selected filter contrast correctly. Collapse the plus menu when leaving Home. Center Solo’s native-glass New chat empty state and keep it stationary behind the keyboard. Standardize Tabler icons and neutral backgrounds, retain SF Back/Close on iOS, use native Liquid Glass headers, tab container, and actions (solid grey selected tab, slightly darker on iOS) on iOS and black actions on Android, and smooth the expanded menu corners. Repair native header safe-area/return layout and compose movement after cancellation. ### Related issue None found for this UI refinement; follows #8337. ### Testing - Formatting, analysis, full mobile suite: 3,487 passed, 4 skipped; 3 push-configuration tests passed. File-size checks passed. - Base UI built and installed on Pixel and iPhone in place. Pixel navigation/New chat cancellation checked. Subsequent glass and rotation refinements are previewed on iPhone; motion feel awaits human confirmation. - Draft pending human confirmation of the final Settings entrance/return behavior on iPhone. ### Pixel snapshots | Solo | Expanded actions | | --- | --- | | <img src="https://raw.githubusercontent.com/block/buzz/16dc0f8af971e63d788fee20974997fab925dec9/docs/screenshots/mobile-home-solo/pixel-solo.png" width="280" alt="Solo empty state with New chat" /> | <img src="https://raw.githubusercontent.com/block/buzz/16dc0f8af971e63d788fee20974997fab925dec9/docs/screenshots/mobile-home-solo/pixel-actions.png" width="280" alt="Expanded channel actions with smooth corners" /> | --------- Signed-off-by: kenny lopez <klopez4212@gmail.com> Co-authored-by: Terp <5856f6900e8e0a4e0ea1f4f8d2ee33e4753d2119bc122f94ecafc660b46c0511@buzz.block.builderlab.xyz>
418 lines
13 KiB
Dart
418 lines
13 KiB
Dart
import 'package:flutter/widgets.dart';
|
|
|
|
/// Tabler 3.46.0 icons for the mobile icon preview.
|
|
///
|
|
/// Semantic names preserve existing call sites; artwork matches buzz-app.
|
|
/// Native iOS controls share Tabler artwork except Back and Close navigation.
|
|
abstract final class BuzzIcons {
|
|
static const cornerUpLeft = IconData(0xeb77, fontFamily: 'BuzzTabler');
|
|
static const droplet = IconData(0xea97, fontFamily: 'BuzzTabler');
|
|
|
|
static const edit = IconData(0xea98, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `text-size`.
|
|
static const aLargeSmall = IconData(0xf2b1, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `activity`.
|
|
static const activity = IconData(0xed23, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `archive`.
|
|
static const archive = IconData(0xea0b, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `restore`.
|
|
static const archiveRestore = IconData(0xfafd, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `arrow-down`.
|
|
static const arrowDown = IconData(0xea16, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `arrow-left`.
|
|
static const arrowLeft = IconData(0xea19, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `arrows-exchange`.
|
|
static const arrowLeftRight = IconData(0xf1f4, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `arrow-up`.
|
|
static const arrowUp = IconData(0xea25, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `arrows-sort`.
|
|
static const arrowUpDown = IconData(0xeb5a, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `at`.
|
|
static const atSign = IconData(0xea2b, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `bell`.
|
|
static const bell = IconData(0xea35, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `bell-off`.
|
|
static const bellOff = IconData(0xece9, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `bell-ringing`.
|
|
static const bellRing = IconData(0xed07, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `bold`.
|
|
static const bold = IconData(0xeb7b, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `robot`.
|
|
static const bot = IconData(0xf00b, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `brain`.
|
|
static const brain = IconData(0xf59f, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `calendar-time`.
|
|
static const calendarClock = IconData(0xee21, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `camera`.
|
|
static const camera = IconData(0xea54, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `camera-off`.
|
|
static const cameraOff = IconData(0xecee, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `check`.
|
|
static const check = IconData(0xea5e, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `checks`.
|
|
static const checkCheck = IconData(0xebaa, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `chevron-down`.
|
|
static const chevronDown = IconData(0xea5f, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `chevron-left`.
|
|
static const chevronLeft = IconData(0xea60, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `chevron-right`.
|
|
static const chevronRight = IconData(0xea61, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `chevron-up`.
|
|
static const chevronUp = IconData(0xea62, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `circle`.
|
|
static const circle = IconData(0xea6b, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `alert-circle`.
|
|
static const circleAlert = IconData(0xea05, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `circle-check`.
|
|
static const circleCheck = IconData(0xea67, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `circle-dashed`.
|
|
static const circleDashed = IconData(0xed27, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `circle-dot`.
|
|
static const circleDot = IconData(0xefb1, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `circle-x`.
|
|
static const circleX = IconData(0xea6a, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `clock`.
|
|
static const clock = IconData(0xea70, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `clock-hour-3`.
|
|
static const clock3 = IconData(0xf318, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `hourglass`: a channel with a limited lifetime.
|
|
static const clockFading = IconData(0xef93, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `code`.
|
|
static const code = IconData(0xea77, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `coffee`.
|
|
static const coffee = IconData(0xef0e, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `compass`.
|
|
static const compass = IconData(0xea79, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `copy`.
|
|
static const copy = IconData(0xea7a, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `download`.
|
|
static const download = IconData(0xea96, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `dots`.
|
|
static const ellipsis = IconData(0xea95, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `dots-vertical`.
|
|
static const ellipsisVertical = IconData(0xea94, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `external-link`.
|
|
static const externalLink = IconData(0xea99, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `file`.
|
|
static const file = IconData(0xeaa4, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `file-pencil`.
|
|
static const filePen = IconData(0xf039, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `file-text`.
|
|
static const fileText = IconData(0xeaa2, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `fingerprint`.
|
|
static const fingerprint = IconData(0xebd1, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `flag`.
|
|
static const flag = IconData(0xeaa6, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `folder`.
|
|
static const folder = IconData(0xeaad, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `folder-code`.
|
|
static const folderGit2 = IconData(0xf90f, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `folder-symlink`.
|
|
static const folderInput = IconData(0xf91b, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `folder-minus`.
|
|
static const folderMinus = IconData(0xeaaa, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `folder-plus`.
|
|
static const folderPlus = IconData(0xeaab, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `carousel-horizontal`.
|
|
static const galleryThumbnails = IconData(0xf659, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `git-pull-request`.
|
|
static const gitPullRequest = IconData(0xeab6, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `hash`.
|
|
static const hash = IconData(0xeabc, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `headphones-off`.
|
|
static const headphoneOff = IconData(0xed1d, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `headphones`.
|
|
static const headphones = IconData(0xeabd, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `heart`.
|
|
static const heart = IconData(0xeabe, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `home`.
|
|
static const house300 = IconData(0xeac1, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `home`.
|
|
static const house500 = IconData(0xeac1, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `photo`.
|
|
static const image = IconData(0xeb0a, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `photo-off`.
|
|
static const imageOff = IconData(0xecf6, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `library-photo`.
|
|
static const images = IconData(0xfd4a, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `inbox`.
|
|
static const inbox300 = IconData(0xeac4, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `inbox`.
|
|
static const inbox500 = IconData(0xeac4, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `italic`.
|
|
static const italic = IconData(0xeb93, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `key`.
|
|
static const key = IconData(0xeac7, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `layout-grid`.
|
|
static const layoutGrid = IconData(0xedba, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `leaf`.
|
|
static const leaf = IconData(0xed4f, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `bulb`.
|
|
static const lightbulb = IconData(0xea51, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `link`.
|
|
static const link = IconData(0xeade, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `link`.
|
|
static const link2 = IconData(0xeade, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `loader-2`.
|
|
static const loaderCircle = IconData(0xf226, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `lock`.
|
|
static const lock = IconData(0xeae2, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `login`.
|
|
static const logIn = IconData(0xeba7, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `logout`.
|
|
static const logOut = IconData(0xeba8, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `mail`.
|
|
static const mail = IconData(0xeae5, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `mail-check`.
|
|
static const mailCheck = IconData(0xf939, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `mail-opened`.
|
|
static const mailOpen = IconData(0xeae4, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `message-circle`.
|
|
static const messageCircle = IconData(0xeaed, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `message`.
|
|
static const messageSquare = IconData(0xeaef, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `message-reply`.
|
|
static const messageSquareReply = IconData(0xfd4d, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `message-2`.
|
|
static const messageSquareText = IconData(0xeaec, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `messages`.
|
|
static const messagesSquare = IconData(0xeb6c, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `microphone`.
|
|
static const mic = IconData(0xeaf0, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `microphone-off`.
|
|
static const micOff = IconData(0xed16, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `moon`.
|
|
static const moon = IconData(0xeaf8, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `palette`.
|
|
static const palette = IconData(0xeb01, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `player-pause`.
|
|
static const pause = IconData(0xed45, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `pencil`.
|
|
static const pencil = IconData(0xeb04, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `phone-off`.
|
|
static const phoneOff = IconData(0xecf5, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `plane`.
|
|
static const plane = IconData(0xeb6f, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `player-play`.
|
|
static const play = IconData(0xed46, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `plus`.
|
|
static const plus = IconData(0xeb0b, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `radio`.
|
|
static const radio = IconData(0xef2d, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `rotate`.
|
|
static const refreshCcw = IconData(0xeb16, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `rotate-clockwise`.
|
|
static const refreshCw = IconData(0xeb15, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `face-id`.
|
|
static const scanFace = IconData(0xea9b, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `scan`.
|
|
static const scanLine = IconData(0xebc8, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `search`.
|
|
static const search = IconData(0xeb1c, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `search`.
|
|
static const search300 = IconData(0xeb1c, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `search`.
|
|
static const search500 = IconData(0xeb1c, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `search-off`.
|
|
static const searchX = IconData(0xf19c, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `settings`.
|
|
static const settings = IconData(0xeb20, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `share`.
|
|
static const share = IconData(0xeb21, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `share`.
|
|
static const share2 = IconData(0xeb21, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `shield`.
|
|
static const shield = IconData(0xeb24, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `shield-exclamation`.
|
|
static const shieldAlert = IconData(0xf9c6, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `shield-check`.
|
|
static const shieldCheck = IconData(0xeb22, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `mood-smile`.
|
|
static const smile = IconData(0xeaf7, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `mood-plus`.
|
|
static const smilePlus = IconData(0xf7b9, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `sparkles`.
|
|
static const sparkles = IconData(0xf6d7, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `square`.
|
|
static const square = IconData(0xeb2c, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `code-dots`.
|
|
static const squareCode = IconData(0xf61a, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `star`.
|
|
static const star = IconData(0xeb2e, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `star-off`.
|
|
static const starOff = IconData(0xed62, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `strikethrough`.
|
|
static const strikethrough = IconData(0xeb9e, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `sun`.
|
|
static const sun = IconData(0xeb30, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `sun-moon`.
|
|
static const sunMoon = IconData(0xf4a3, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `camera-rotate`.
|
|
static const switchCamera = IconData(0xee22, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `trash`.
|
|
static const trash2 = IconData(0xeb41, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `alert-triangle`.
|
|
static const triangleAlert = IconData(0xea06, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `user`.
|
|
static const user = IconData(0xeb4d, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `user-minus`.
|
|
static const userMinus = IconData(0xeb4a, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `user-plus`.
|
|
static const userPlus = IconData(0xeb4b, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `user`.
|
|
static const userRound = IconData(0xeb4d, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `users`.
|
|
static const users = IconData(0xebf2, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `video`.
|
|
static const video = IconData(0xed22, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `video-off`.
|
|
static const videoOff = IconData(0xed20, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `ball-volleyball`.
|
|
static const volleyball = IconData(0xec2b, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `volume`.
|
|
static const volume2 = IconData(0xeb51, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `volume-off`.
|
|
static const volumeX = IconData(0xf1c3, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `wifi-off`.
|
|
static const wifiOff = IconData(0xecfa, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `tool`.
|
|
static const wrench = IconData(0xeb40, fontFamily: 'BuzzTabler');
|
|
|
|
/// Tabler `x`.
|
|
static const x = IconData(0xeb55, fontFamily: 'BuzzTabler');
|
|
}
|