diff --git a/src/core/features/mainmenu/components/user-menu-button/user-menu-button.scss b/src/core/features/mainmenu/components/user-menu-button/user-menu-button.scss index d9faceaac..1b47049ad 100644 --- a/src/core/features/mainmenu/components/user-menu-button/user-menu-button.scss +++ b/src/core/features/mainmenu/components/user-menu-button/user-menu-button.scss @@ -8,5 +8,5 @@ core-user-avatar { :host-context(ion-toolbar) core-user-avatar ::ng-deep img, :host-context(ion-tab-bar) core-user-avatar ::ng-deep img { - padding: 2px !important; + padding: 6px !important; } diff --git a/src/theme/theme.base.scss b/src/theme/theme.base.scss index e890184f2..c30dae7a9 100644 --- a/src/theme/theme.base.scss +++ b/src/theme/theme.base.scss @@ -214,8 +214,8 @@ ion-header ion-toolbar { .button.button-clear.button-has-icon-only, .button.button-solid.button-has-icon-only { --border-radius: var(--huge-radius); - width: 48px; - height: 48px; + width: var(--a11y-min-target-size); + height: var(--a11y-min-target-size); } @@ -310,6 +310,10 @@ ion-button ion-spinner { --color: inherit !important; } +ion-button.button-has-icon-only { + margin: 2px; +} + ion-button:not(.button-has-icon-only):not(.button-small) > ion-icon { min-width: 20px; } diff --git a/src/theme/theme.light.scss b/src/theme/theme.light.scss index 39eb96a05..33ef85f65 100644 --- a/src/theme/theme.light.scss +++ b/src/theme/theme.light.scss @@ -111,7 +111,7 @@ --core-bottom-tabs-background-selected: transparent; --core-bottom-tabs-badge-color: var(--brand); --core-bottom-tabs-badge-text-color: var(--brand-contrast); - --bottom-tabs-size: 56px; + --bottom-tabs-size: 48px; ion-tab-bar.mainmenu-tabs { --background: var(--core-bottom-tabs-background); --color: var(--core-bottom-tabs-color); @@ -126,12 +126,12 @@ --core-header-toolbar-button-image-size: var(--a11y-min-target-size); --core-header-toolbar-background: var(--white); - --core-header-toolbar-border-width: 1px; + --core-header-toolbar-border-width: 0px; --core-header-toolbar-border-color: var(--stroke); --core-header-toolbar-color: var(--gray-900); - --core-header-toolbar-height: 56px; + --core-header-toolbar-height: 48px; html.ios { - --core-header-toolbar-height: 54px; + --core-header-toolbar-height: 48px; } ion-header ion-toolbar { @@ -220,7 +220,7 @@ --core-tab-color-active: var(--dark); --core-tab-border-color-active: var(--brand); --core-tab-font-weight-active: normal; - --core-tabs-height: 56px; + --core-tabs-height: 48px; core-tabs, core-tabs-outlet { ion-slide { --background: var(--core-tab-background);