change drawer location; change drawer position; unify toolbar icon colors;

This commit is contained in:
Fabian Freund
2026-02-01 12:48:14 +01:00
parent 0dd5710488
commit 0e5c240b45
5 changed files with 81 additions and 58 deletions
@@ -456,7 +456,7 @@ class BrowserScreen extends HookConsumerWidget {
child: Scaffold( child: Scaffold(
// Minimal scaffold - only for Material overlay support (SnackBars) // Minimal scaffold - only for Material overlay support (SnackBars)
resizeToAvoidBottomInset: false, resizeToAvoidBottomInset: false,
drawer: const BrowserNavigationDrawer(), endDrawer: const BrowserNavigationDrawer(),
body: Stack( body: Stack(
children: [ children: [
// Layer 0: Browser content // Layer 0: Browser content
@@ -439,6 +439,7 @@ class ContextualToolbar extends HookConsumerWidget {
TabMenu( TabMenu(
controller: useMenuController(), controller: useMenuController(),
selectedTabId: selectedTabId!, selectedTabId: selectedTabId!,
enableNavigationButtons: false,
builder: (context, controller, child) { builder: (context, controller, child) {
return ToolbarButton( return ToolbarButton(
onTap: () { onTap: () {
@@ -555,6 +556,8 @@ class QuickTabSwitcher extends HookConsumerWidget {
enableFetchFeeds: false, enableFetchFeeds: false,
enableDesktopMode: false, enableDesktopMode: false,
enableReaderMode: false, enableReaderMode: false,
enableReloadButton: false,
enableNavigationButtons: false,
builder: (context, controller, _) { builder: (context, controller, _) {
return InkWell( return InkWell(
onLongPress: () { onLongPress: () {
@@ -645,7 +648,7 @@ class NavigationMenuButton extends StatelessWidget {
Widget build(BuildContext context) { Widget build(BuildContext context) {
return ToolbarButton( return ToolbarButton(
onTap: () { onTap: () {
Scaffold.of(context).openDrawer(); Scaffold.of(context).openEndDrawer();
}, },
child: const Icon(Icons.menu), child: const Icon(Icons.menu),
); );
@@ -61,6 +61,8 @@ class TabMenu extends HookConsumerWidget {
final bool enableShare; final bool enableShare;
final bool enableExport; final bool enableExport;
final bool enableCloseTab; final bool enableCloseTab;
final bool enableReloadButton;
final bool enableNavigationButtons;
const TabMenu({ const TabMenu({
super.key, super.key,
@@ -77,6 +79,8 @@ class TabMenu extends HookConsumerWidget {
this.enableShare = true, this.enableShare = true,
this.enableExport = true, this.enableExport = true,
this.enableCloseTab = true, this.enableCloseTab = true,
this.enableReloadButton = true,
this.enableNavigationButtons = true,
}); });
@override @override
@@ -453,55 +457,57 @@ class TabMenu extends HookConsumerWidget {
leadingIcon: const Icon(MdiIcons.tabMinus), leadingIcon: const Icon(MdiIcons.tabMinus),
child: const Text('Close Tab'), child: const Text('Close Tab'),
), ),
const Divider(), if (enableReloadButton || enableNavigationButtons) const Divider(),
MenuItemButton( if (enableReloadButton)
onPressed: () async { MenuItemButton(
final sessionController = ref.read( onPressed: () async {
tabSessionProvider(tabId: selectedTabId).notifier, final sessionController = ref.read(
); tabSessionProvider(tabId: selectedTabId).notifier,
);
await sessionController.reload(); await sessionController.reload();
controller.close(); controller.close();
}, },
leadingIcon: const Icon(Icons.refresh), leadingIcon: const Icon(Icons.refresh),
child: const Text('Reload'), child: const Text('Reload'),
), ),
Consumer( if (enableNavigationButtons)
builder: (context, ref, child) { Consumer(
final history = ref.watch( builder: (context, ref, child) {
tabStateProvider( final history = ref.watch(
selectedTabId, tabStateProvider(
).select((value) => value?.historyState), selectedTabId,
); ).select((value) => value?.historyState),
);
final isLoading = ref.watch( final isLoading = ref.watch(
selectedTabStateProvider.select( selectedTabStateProvider.select(
(state) => state?.isLoading ?? false, (state) => state?.isLoading ?? false,
),
);
return Row(
children: [
Expanded(
child: NavigateBackButton(
selectedTabId: selectedTabId,
isLoading: isLoading,
menuControllerToClose: controller,
canGoBack: history?.canGoBack == true,
),
), ),
const SizedBox(height: 48, child: VerticalDivider()), );
Expanded(
child: NavigateForwardButton( return Row(
selectedTabId: selectedTabId, children: [
menuControllerToClose: controller, Expanded(
canGoForward: history?.canGoForward == true, child: NavigateBackButton(
selectedTabId: selectedTabId,
isLoading: isLoading,
menuControllerToClose: controller,
canGoBack: history?.canGoBack == true,
),
), ),
), const SizedBox(height: 48, child: VerticalDivider()),
], Expanded(
); child: NavigateForwardButton(
}, selectedTabId: selectedTabId,
), menuControllerToClose: controller,
canGoForward: history?.canGoForward == true,
),
),
],
);
},
),
], ],
); );
} }
@@ -57,18 +57,17 @@ class TabsActionButton extends HookConsumerWidget {
selectedContainerDataProvider.select((value) => value.value?.color), selectedContainerDataProvider.select((value) => value.value?.color),
); );
final iconColor = isActive
? theme.colorScheme.primary
: theme.colorScheme.onSurfaceVariant;
return ToolbarButton( return ToolbarButton(
onTap: onTap, onTap: onTap,
onDoubleTap: onDoubleTap, onDoubleTap: onDoubleTap,
onLongPress: onLongPress, onLongPress: onLongPress,
child: Container( child: Container(
decoration: BoxDecoration( decoration: BoxDecoration(
border: Border.all( border: Border.all(width: 2.0, color: iconColor),
width: 2.0,
color: isActive
? theme.colorScheme.primary
: DefaultTextStyle.of(context).style.color!,
),
borderRadius: BorderRadius.circular(5.0), borderRadius: BorderRadius.circular(5.0),
color: containerColor.mapNotNull(ContainerColors.forAppBar), color: containerColor.mapNotNull(ContainerColors.forAppBar),
), ),
@@ -82,7 +81,7 @@ class TabsActionButton extends HookConsumerWidget {
style: TextStyle( style: TextStyle(
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
fontSize: 14.0, fontSize: 14.0,
color: isActive ? theme.colorScheme.primary : null, color: iconColor,
), ),
); );
}, },
@@ -92,10 +91,19 @@ class TabsActionButton extends HookConsumerWidget {
style: TextStyle( style: TextStyle(
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
fontSize: 14.0, fontSize: 14.0,
color: isActive ? theme.colorScheme.primary : null, color: iconColor,
), ),
) )
: const Skeletonizer(child: Text('00')), : Skeletonizer(
child: Text(
'0',
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 14.0,
color: iconColor,
),
),
),
error: (error, stackTrace) { error: (error, stackTrace) {
logger.e( logger.e(
'Could not determine tab count', 'Could not determine tab count',
@@ -108,7 +116,7 @@ class TabsActionButton extends HookConsumerWidget {
style: TextStyle( style: TextStyle(
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,
fontSize: 14.0, fontSize: 14.0,
color: isActive ? theme.colorScheme.primary : null, color: iconColor,
), ),
); );
}, },
@@ -35,13 +35,19 @@ class ToolbarButton extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final theme = Theme.of(context);
final iconColor = theme.colorScheme.onSurfaceVariant;
return InkWell( return InkWell(
onTap: onTap, onTap: onTap,
onDoubleTap: onDoubleTap, onDoubleTap: onDoubleTap,
onLongPress: onLongPress, onLongPress: onLongPress,
child: Padding( child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 8.0, vertical: 15.0), padding: const EdgeInsets.symmetric(horizontal: 8.0, vertical: 15.0),
child: child, child: IconTheme(
data: IconThemeData(color: iconColor),
child: child,
),
), ),
); );
} }