javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

- update badge position;

Browse Source
This commit is contained in:
João Ferreira
2025-08-28 12:46:54 +01:00
parent 17e26d3312
commit 291beb32bb
1 changed files with 18 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
core/src/components/tab-button/tab-button.ionic.scss
View File

@@ -107,18 +107,23 @@
:host ::slotted(ion-badge) {
@include globals.position(null, null, null, calc(50% + globals.$ion-scale-300));
@include globals.transform(translate(-50%, -50%));
}
:host ::slotted(ion-badge.badge-vertical-top) {
@include globals.position(-2px);
@include globals.position(globals.$ion-scale-150);
}
:host ::slotted(ion-badge.badge-vertical-top:empty) {
@include globals.position(globals.$ion-scale-050, null, null, calc(50% + globals.$ion-scale-250));
}
:host ::slotted(ion-badge.badge-vertical-bottom) {
@include globals.position(calc(50% - globals.$ion-scale-200));
@include globals.position(calc(50% - (globals.$ion-scale-050)));
}
:host ::slotted(ion-badge.badge-vertical-bottom:empty) {
@include globals.position(calc(50% - globals.$ion-scale-100));
@include globals.position(50%, null, null, calc(50% + globals.$ion-scale-250));
}
:host ::slotted(ion-badge[vertical]:not(:empty)) {
@@ -131,13 +136,17 @@
}
:host(.tab-layout-icon-bottom) ::slotted(ion-badge.badge-vertical-top) {
@include globals.position(calc(50% - globals.$ion-scale-100));
}
:host(.tab-layout-icon-bottom) ::slotted(ion-badge.badge-vertical-bottom) {
@include globals.position(calc(50% + globals.$ion-scale-100));
}
:host(.tab-layout-icon-bottom) ::slotted(ion-badge.badge-vertical-bottom:empty) {
@include globals.position(calc(50% + 14px));
:host(.tab-layout-icon-bottom) ::slotted(ion-badge.badge-vertical-top:empty) {
@include globals.position(50%);
}
:host(.tab-layout-icon-bottom) ::slotted(ion-badge.badge-vertical-bottom) {
@include globals.position(calc(100% - globals.$ion-scale-100));
}
:host(.tab-layout-icon-bottom) ::slotted(ion-badge.badge-vertical-bottom:empty) {
@include globals.position(calc(100% - globals.$ion-scale-050), null, null, calc(50% + globals.$ion-scale-250));
}