menu: finished cupertino style

This commit is contained in:
FloVanGH 2025-02-27 11:03:38 +01:00 committed by FloVanGH
parent 09db98f9ca
commit f6cec29fed
2 changed files with 30 additions and 25 deletions

View file

@ -55,6 +55,10 @@ export component MenuBarBase inherits Rectangle {
layout := HorizontalLayout { layout := HorizontalLayout {
alignment: start; alignment: start;
padding: root.padding; padding: root.padding;
padding-left: root.padding-left;
padding-right: root.padding-right;
padding-top: root.padding-top;
padding-bottom: root.padding-bottom;
@children @children
} }

View file

@ -13,34 +13,37 @@ export component MenuBarItem {
min-height: base.min-height; min-height: base.min-height;
base := MenuBarItemBase { base := MenuBarItemBase {
padding-left: 11px; padding-left: 8px;
padding-right: 11px; padding-right: 8px;
padding-top: 4px;
padding-bottom: 6px;
default-foreground: CupertinoPalette.foreground; default-foreground: CupertinoPalette.foreground;
hover-foreground: CupertinoPalette.accent-foreground; hover-foreground: CupertinoPalette.foreground;
pressed-foreground: CupertinoPalette.accent-foreground; pressed-foreground: CupertinoPalette.foreground;
hover-background: CupertinoPalette.accent-background; hover-background: CupertinoPalette.secondary-control-background;
pressed-background: CupertinoPalette.accent-background; pressed-background: CupertinoPalette.secondary-control-background;
font-size: 14px; font-size: 13px;
font-weight: 300; font-weight: 300;
border-radius: 3px; border-radius: 2px;
} }
} }
export component MenuBar inherits MenuBarBase { export component MenuBar inherits MenuBarBase {
padding: 9px; padding-top: 0;
spacing: 10px; padding-bottom: 0;
min-layout-height: 40px; padding-left: 8px;
padding-right: 8px;
min-layout-height: 24px;
} }
export component MenuFrame inherits MenuFrameBase { export component MenuFrame inherits MenuFrameBase {
background: CupertinoPalette.background;
border-radius: 7px;
border-width: 1px; border-width: 1px;
border-color: CupertinoPalette.border; border-color: CupertinoPalette.border;
padding: 1px;
layout-min-width: 280px; layout-min-width: 280px;
drop-shadow-blur: 22px;
drop-shadow-color: #00000066;
drop-shadow-offset-y: 0.5px;
background: CupertinoPalette.background;
border-radius: 6px;
padding: 4px;
} }
export component MenuItem { export component MenuItem {
@ -51,23 +54,21 @@ export component MenuItem {
callback clear-current <=> base.clear-current; callback clear-current <=> base.clear-current;
callback activate <=> base.activate; callback activate <=> base.activate;
min-height: max(40px, base.min-height); min-height: max(22px, base.min-height);
HorizontalLayout { HorizontalLayout {
padding: 5px;
base := MenuItemBase { base := MenuItemBase {
default-foreground: CupertinoPalette.foreground; default-foreground: CupertinoPalette.foreground;
current-foreground: CupertinoPalette.accent-foreground; current-foreground: CupertinoPalette.accent-foreground;
current-background: CupertinoPalette.accent-background; current-background: CupertinoPalette.accent-background;
font-size: CupertinoFontSettings.body.font-size; font-size: CupertinoFontSettings.body.font-size;
font-weight: CupertinoFontSettings.body.font-weight; font-weight: CupertinoFontSettings.body.font-weight;
border-radius: 4px; border-radius: 5px;
padding-left: 11px; padding-left: 8px;
padding-right: 11px; padding-right: 8px;
spacing: 8px; spacing: 4px;
sub-menu-icon: @image-url("_arrow_forward.svg"); sub-menu-icon: @image-url("_arrow_forward.svg");
icon-size: 12px; icon-size: 13px;
} }
} }
} }