Skip to content

Commit 0de99f4

Browse files
committed
refactor(tab-bar): remove ionic vars file, move vars to global theme file
1 parent 2d68ebb commit 0de99f4

File tree

3 files changed

+17
-25
lines changed

3 files changed

+17
-25
lines changed

core/src/components/tab-bar/tab-bar.ionic.scss

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
@use "../../themes/ionic/ionic.globals.scss" as globals;
22
@use "./tab-bar.common";
3-
@import "./tab-bar.ionic.vars";
43

54
:host {
6-
--background: #{$tabbar-ionic-background};
7-
--background-activated: #{$tabbar-ionic-background-activated};
8-
--background-focused: #{$tabbar-ionic-background-focused};
9-
--color: #{$tabbar-ionic-color};
10-
--color-selected: #{$tabbar-ionic-color-selected};
5+
--background: #{globals.$tabbar-ionic-background};
6+
--background-activated: #{globals.$tabbar-ionic-background-activated};
7+
--background-focused: #{globals.$tabbar-ionic-background-focused};
8+
--border: #{globals.$ion-border-size-0} #{globals.$ion-border-style-solid} #{globals.$tabbar-ionic-border-color};
9+
--color: #{globals.$tabbar-ionic-color};
10+
--color-selected: #{globals.$tabbar-ionic-color-selected};
1111

1212
/**
1313
* Tab bar has a box sizing of content-box to ensure the padding

core/src/components/tab-bar/tab-bar.ionic.vars.scss

Lines changed: 0 additions & 19 deletions
This file was deleted.

core/src/themes/ionic/ionic.theme.default.scss

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
@use "../functions.color" as color;
2+
@use "../../foundations/ionic.vars.scss" as globals;
23

34
// Ionic Theme
45
// -------------------------------------------------------------------------------------------
@@ -89,3 +90,13 @@ $ionic-colors: (
8990
tint: color.get-color-tint($dark),
9091
),
9192
);
93+
94+
// Ionic Tabs & Tab Bar
95+
// --------------------------------------------------
96+
97+
$tabbar-ionic-background: var(--ion-tab-bar-background, globals.$ion-primitives-base-white);
98+
$tabbar-ionic-background-activated: var(--ion-tab-bar-background-activated, globals.$ion-primitives-neutral-100);
99+
$tabbar-ionic-background-focused: var(--ion-tab-bar-background-focused, transparent);
100+
$tabbar-ionic-color: var(--ion-tab-bar-color, globals.$ion-primitives-neutral-800);
101+
$tabbar-ionic-color-selected: var(--ion-tab-bar-color-selected, globals.$ion-semantics-primary-base);
102+
$tabbar-ionic-border-color: var(--ion-tab-bar-border-color, transparent);

0 commit comments

Comments
 (0)