Tighten desktop vault navigation header

main.go

@@ -1355,7 +1355,7 @@ func (u *ui) listPanel(gtx layout.Context) layout.Dimensions {
 				if u.isVaultLocked() {
 					return layout.Dimensions{}
 				}
-				return u.sectionBar(gtx)
+				return u.navigationHeader(gtx)
 			}),
 			layout.Rigid(layout.Spacer{Height: spacing}.Layout),
 			layout.Rigid(func(gtx layout.Context) layout.Dimensions {
@@ -1419,6 +1419,20 @@ func (u *ui) listPanel(gtx layout.Context) layout.Dimensions {
 	})
 }
 
+func (u *ui) navigationHeader(gtx layout.Context) layout.Dimensions {
+	return layout.Flex{Alignment: layout.Middle}.Layout(gtx,
+		layout.Flexed(1, func(gtx layout.Context) layout.Dimensions {
+			return u.sectionBar(gtx)
+		}),
+		layout.Rigid(func(gtx layout.Context) layout.Dimensions {
+			if u.state.Section != appstate.SectionEntries {
+				return layout.Dimensions{}
+			}
+			return u.groupControlsDisclosure(gtx)
+		}),
+	)
+}
+
 func (u *ui) sectionBar(gtx layout.Context) layout.Dimensions {
 	return layout.Flex{Spacing: layout.SpaceStart}.Layout(gtx,
 		layout.Rigid(func(gtx layout.Context) layout.Dimensions {
@@ -1905,8 +1919,8 @@ func (u *ui) pathBar(gtx layout.Context) layout.Dimensions {
 				}
 				btn := material.Button(u.theme, &u.breadcrumbs[index], label)
 				btn.Background, btn.Color = buttonFocusColors(u.isFocused(breadcrumbFocusID(index)))
-				btn.TextSize = unit.Sp(12)
+				btn.TextSize = unit.Sp(11)
-				btn.Inset = layout.Inset{Top: 6, Bottom: 6, Left: 10, Right: 10}
+				btn.Inset = layout.Inset{Top: 5, Bottom: 5, Left: 9, Right: 9}
 				return btn.Layout(gtx)
 			}))
 			if i < len(crumbs)-1 {
@@ -1930,7 +1944,14 @@ func (u *ui) groupBar(gtx layout.Context) layout.Dimensions {
 		return layout.Dimensions{}
 	}
 	return layout.Flex{Axis: layout.Vertical}.Layout(gtx, func() []layout.FlexChild {
-		children := make([]layout.FlexChild, 0, len(groups)*2)
+		children := []layout.FlexChild{
+			layout.Rigid(func(gtx layout.Context) layout.Dimensions {
+				lbl := material.Label(u.theme, unit.Sp(12), "Groups")
+				lbl.Color = mutedColor
+				return lbl.Layout(gtx)
+			}),
+			layout.Rigid(layout.Spacer{Height: unit.Dp(6)}.Layout),
+		}
 		for i, group := range groups {
 			idx := i
 			name := group
@@ -1940,11 +1961,7 @@ func (u *ui) groupBar(gtx layout.Context) layout.Dimensions {
 					u.currentPath = append([]string(nil), u.state.CurrentPath...)
 					u.filter()
 				}
-				btn := material.Button(u.theme, &u.groupClicks[idx], name)
+				return tonedButton(gtx, u.theme, &u.groupClicks[idx], name)
-				btn.Background = color.NRGBA{R: 241, G: 236, B: 227, A: 255}
-				btn.Color = accentColor
-				btn.TextSize = unit.Sp(12)
-				return btn.Layout(gtx)
 			}))
 			if i < len(groups)-1 {
 				children = append(children, layout.Rigid(layout.Spacer{Height: unit.Dp(6)}.Layout))

ui_forms.go

@@ -261,47 +261,41 @@ func (u *ui) groupControlsSection(gtx layout.Context) layout.Dimensions {
 	if u.state.Section != appstate.SectionEntries {
 		return layout.Dimensions{}
 	}
+	if u.groupControlsHidden {
+		return layout.Dimensions{}
+	}
 	return layout.Flex{Axis: layout.Vertical}.Layout(gtx,
-		layout.Rigid(func(gtx layout.Context) layout.Dimensions {
+		layout.Rigid(u.groupControls),
-			return u.groupControlsDisclosure(gtx)
-		}),
-		layout.Rigid(func(gtx layout.Context) layout.Dimensions {
-			if u.groupControlsHidden {
-				return layout.Dimensions{}
-			}
-			return layout.Flex{Axis: layout.Vertical}.Layout(gtx,
-				layout.Rigid(layout.Spacer{Height: unit.Dp(6)}.Layout),
-				layout.Rigid(u.groupControls),
-			)
-		}),
 	)
 }
 
 func (u *ui) groupControlsDisclosure(gtx layout.Context) layout.Dimensions {
 	return u.toggleGroupControls.Layout(gtx, func(gtx layout.Context) layout.Dimensions {
-		return layout.Flex{Alignment: layout.Middle}.Layout(gtx,
+		return layout.UniformInset(unit.Dp(2)).Layout(gtx, func(gtx layout.Context) layout.Dimensions {
-			layout.Rigid(func(gtx layout.Context) layout.Dimensions {
+			return layout.Flex{Alignment: layout.Middle}.Layout(gtx,
-				icon := u.expandLessIcon
+				layout.Rigid(func(gtx layout.Context) layout.Dimensions {
-				if u.groupControlsHidden {
+					icon := u.expandLessIcon
-					icon = u.expandMoreIcon
+					if u.groupControlsHidden {
-				}
+						icon = u.expandMoreIcon
-				if icon == nil {
-					lbl := material.Label(u.theme, unit.Sp(16), ">")
-					if !u.groupControlsHidden {
-						lbl.Text = "v"
 					}
-					lbl.Color = accentColor
+					if icon == nil {
+						lbl := material.Label(u.theme, unit.Sp(16), ">")
+						if !u.groupControlsHidden {
+							lbl.Text = "v"
+						}
+						lbl.Color = accentColor
+						return lbl.Layout(gtx)
+					}
+					return icon.Layout(gtx, accentColor)
+				}),
+				layout.Rigid(layout.Spacer{Width: unit.Dp(4)}.Layout),
+				layout.Rigid(func(gtx layout.Context) layout.Dimensions {
+					lbl := material.Label(u.theme, unit.Sp(12), "Group Tools")
+					lbl.Color = mutedColor
 					return lbl.Layout(gtx)
-				}
+				}),
-				return icon.Layout(gtx, accentColor)
+			)
-			}),
+		})
-			layout.Rigid(layout.Spacer{Width: unit.Dp(4)}.Layout),
-			layout.Rigid(func(gtx layout.Context) layout.Dimensions {
-				lbl := material.Label(u.theme, unit.Sp(13), "Group Tools")
-				lbl.Color = accentColor
-				return lbl.Layout(gtx)
-			}),
-		)
 	})
 }