💄 Updating compose toolbar styling

This commit is contained in:
2026-01-16 00:47:32 +08:00
parent 321ea4458b
commit bcd6753ed2

View File

@@ -72,8 +72,7 @@ class ComposeToolbar extends HookConsumerWidget {
context: context, context: context,
isScrollControlled: true, isScrollControlled: true,
useRootNavigator: true, useRootNavigator: true,
builder: builder: (context) => DraftManagerSheet(
(context) => DraftManagerSheet(
onDraftSelected: (draftId) { onDraftSelected: (draftId) {
final draft = ref.read(composeStorageProvider)[draftId]; final draft = ref.read(composeStorageProvider)[draftId];
if (draft != null) { if (draft != null) {
@@ -97,13 +96,14 @@ class ComposeToolbar extends HookConsumerWidget {
final colorScheme = Theme.of(context).colorScheme; final colorScheme = Theme.of(context).colorScheme;
if (isCompact) { if (isCompact) {
return Container( return Material(
color: Theme.of(context).colorScheme.surfaceContainerLow, elevation: 8,
padding: EdgeInsets.symmetric(horizontal: 8), color: Theme.of(context).colorScheme.surfaceContainerHigh,
child: Center( child: Center(
child: ConstrainedBox( child: ConstrainedBox(
constraints: const BoxConstraints(maxWidth: 560), constraints: const BoxConstraints(maxWidth: 560),
child: Row( child:
Row(
children: [ children: [
Expanded( Expanded(
child: SingleChildScrollView( child: SingleChildScrollView(
@@ -140,7 +140,9 @@ class ComposeToolbar extends HookConsumerWidget {
style: ButtonStyle( style: ButtonStyle(
backgroundColor: WidgetStatePropertyAll( backgroundColor: WidgetStatePropertyAll(
state.pollId.value != null state.pollId.value != null
? colorScheme.primary.withOpacity(0.15) ? colorScheme.primary.withOpacity(
0.15,
)
: null, : null,
), ),
), ),
@@ -153,7 +155,9 @@ class ComposeToolbar extends HookConsumerWidget {
builder: (context, _) { builder: (context, _) {
return IconButton( return IconButton(
onPressed: pickFund, onPressed: pickFund,
icon: const Icon(Symbols.account_balance_wallet), icon: const Icon(
Symbols.account_balance_wallet,
),
tooltip: 'fund'.tr(), tooltip: 'fund'.tr(),
color: colorScheme.primary, color: colorScheme.primary,
visualDensity: const VisualDensity( visualDensity: const VisualDensity(
@@ -163,7 +167,9 @@ class ComposeToolbar extends HookConsumerWidget {
style: ButtonStyle( style: ButtonStyle(
backgroundColor: WidgetStatePropertyAll( backgroundColor: WidgetStatePropertyAll(
state.fundId.value != null state.fundId.value != null
? colorScheme.primary.withOpacity(0.15) ? colorScheme.primary.withOpacity(
0.15,
)
: null, : null,
), ),
), ),
@@ -186,7 +192,9 @@ class ComposeToolbar extends HookConsumerWidget {
style: ButtonStyle( style: ButtonStyle(
backgroundColor: WidgetStatePropertyAll( backgroundColor: WidgetStatePropertyAll(
state.embedView.value != null state.embedView.value != null
? colorScheme.primary.withOpacity(0.15) ? colorScheme.primary.withOpacity(
0.15,
)
: null, : null,
), ),
), ),
@@ -230,10 +238,11 @@ class ComposeToolbar extends HookConsumerWidget {
), ),
], ],
).padding( ).padding(
horizontal: 8, horizontal: 16,
top: 4, top: 4,
bottom: bottom: useSafeArea
useSafeArea ? MediaQuery.of(context).padding.bottom + 4 : 4, ? MediaQuery.of(context).padding.bottom + 4
: 4,
), ),
), ),
), ),
@@ -246,14 +255,18 @@ class ComposeToolbar extends HookConsumerWidget {
child: Center( child: Center(
child: ConstrainedBox( child: ConstrainedBox(
constraints: const BoxConstraints(maxWidth: 560), constraints: const BoxConstraints(maxWidth: 560),
child: Row( child:
Row(
children: [ children: [
Expanded( Expanded(
child: SingleChildScrollView( child: SingleChildScrollView(
scrollDirection: Axis.horizontal, scrollDirection: Axis.horizontal,
child: Row( child: Row(
children: [ children: [
UploadMenu(items: uploadMenuItems, isCompact: isCompact), UploadMenu(
items: uploadMenuItems,
isCompact: isCompact,
),
IconButton( IconButton(
onPressed: linkAttachment, onPressed: linkAttachment,
icon: const Icon(Symbols.attach_file), icon: const Icon(Symbols.attach_file),
@@ -285,7 +298,9 @@ class ComposeToolbar extends HookConsumerWidget {
builder: (context, _) { builder: (context, _) {
return IconButton( return IconButton(
onPressed: pickFund, onPressed: pickFund,
icon: const Icon(Symbols.account_balance_wallet), icon: const Icon(
Symbols.account_balance_wallet,
),
tooltip: 'fund'.tr(), tooltip: 'fund'.tr(),
color: colorScheme.primary, color: colorScheme.primary,
style: ButtonStyle( style: ButtonStyle(