Skip to content

Commit 4353450

Browse files
MartoYankovMartoYankov
authored
feat: add background color css to tab strip (#7414)
1 parent 6263033 commit 4353450

27 files changed

Lines changed: 334 additions & 88 deletions

‎e2e/ui-tests-app/app/bottom-navigation/background-color-page.css‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
BottomNavigation {
2+
background-color: gold;
3+
}
4+
5+
TabStrip {
6+
background-color: skyblue;
7+
}

‎e2e/ui-tests-app/app/bottom-navigation/background-color-page.xml‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,21 +3,21 @@
33
<ActionBar title="BottomNavigation background-color" icon="" class="action-bar">
44
</ActionBar>
55

6-
<BottomNavigation style="background-color: green;">
6+
<BottomNavigation>
77
<TabStrip>
88
<TabStripItem title="First"></TabStripItem>
99
<TabStripItem title="Second"></TabStripItem>
1010
</TabStrip>
1111

1212
<TabContentItem>
1313
<GridLayout>
14-
<Label text="First View" verticalAlignment="center" horizontalAlignment="center"/>
14+
<Label text="First View" />
1515
</GridLayout>
1616
</TabContentItem>
1717

1818
<TabContentItem>
1919
<GridLayout>
20-
<Label text="Second View" verticalAlignment="center" horizontalAlignment="center"/>
20+
<Label text="Second View" />
2121
</GridLayout>
2222
</TabContentItem>
2323
</BottomNavigation>

‎e2e/ui-tests-app/app/bottom-navigation/color-page.xml‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,20 +4,20 @@
44

55
<BottomNavigation style="color: green;">
66
<TabStrip>
7-
<TabStripItem title="First"></TabStripItem>
8-
<TabStripItem title="Second"></TabStripItem>
7+
<TabStripItem title="First"></TabStripItem>
8+
<TabStripItem title="Second"></TabStripItem>
99
</TabStrip>
1010

1111
<TabContentItem>
12-
<GridLayout>
13-
<Label text="First View" verticalAlignment="center" horizontalAlignment="center"/>
14-
</GridLayout>
12+
<GridLayout>
13+
<Label text="First View" />
14+
</GridLayout>
1515
</TabContentItem>
1616

1717
<TabContentItem>
18-
<GridLayout>
19-
<Label text="Second View" verticalAlignment="center" horizontalAlignment="center"/>
20-
</GridLayout>
18+
<GridLayout>
19+
<Label text="Second View" />
20+
</GridLayout>
2121
</TabContentItem>
2222
</BottomNavigation>
2323
</Page>

‎e2e/ui-tests-app/app/bottom-navigation/icon-change-page.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { BottomNavigation, SelectedIndexChangedEventData } from "tns-core-modules/ui/bottom-navigation";
22

33
export function onSelectedIndexChanged(args: SelectedIndexChangedEventData) {
4-
const bottomNav = args.object as BottomNavigation;
4+
const bottomNav = <BottomNavigation>args.object;
55

66
const newItem = bottomNav.tabStrip.items[args.newIndex];
77
if (newItem) {

‎e2e/ui-tests-app/app/bottom-navigation/icon-change-page.xml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<Page xmlns="http://schemas.nativescript.org/tns.xsd" class="page" navigatingTo="onNavigatingTo">
1+
<Page xmlns="http://schemas.nativescript.org/tns.xsd" class="page" navigatingTo="onNavigatingTo">
22
<ActionBar title="BottomNavigation icon change" icon="" class="action-bar">
33
</ActionBar>
44

‎e2e/ui-tests-app/app/bottom-navigation/icon-title-placement-page.xml‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,19 +11,19 @@
1111

1212
<TabContentItem>
1313
<GridLayout>
14-
<Label text="Title and icon" verticalAlignment="center" horizontalAlignment="center"/>
14+
<Label text="Title and icon" />
1515
</GridLayout>
1616
</TabContentItem>
1717

1818
<TabContentItem>
1919
<GridLayout>
20-
<Label text="Only icon" verticalAlignment="center" horizontalAlignment="center"/>
20+
<Label text="Only icon" />
2121
</GridLayout>
2222
</TabContentItem>
2323

2424
<TabContentItem>
2525
<GridLayout>
26-
<Label text="Only title" verticalAlignment="center" horizontalAlignment="center"/>
26+
<Label text="Only title" />
2727
</GridLayout>
2828
</TabContentItem>
2929
</BottomNavigation>

‎e2e/ui-tests-app/app/bottom-navigation/issue-5470-page.xml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,5 +23,5 @@
2323
</GridLayout>
2424
</TabContentItem>
2525
</BottomNavigation>
26-
26+
2727
</Page>

‎e2e/ui-tests-app/app/tabs/background-color-page.css‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
Tabs {
2+
background-color: gold;
3+
}
4+
5+
TabStrip {
6+
background-color: skyblue;
7+
}

‎e2e/ui-tests-app/app/tabs/background-color-page.xml‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,24 @@
11
<Page class="page">
22

3-
<ActionBar title="BottomNavigation background-color" icon="" class="action-bar">
3+
<ActionBar title="Tabs background-color" icon="" class="action-bar">
44
</ActionBar>
55

6-
<BottomNavigation style="background-color: green;">
6+
<Tabs>
77
<TabStrip>
8-
<TabStripItem title="First"></TabStripItem>
9-
<TabStripItem title="Second"></TabStripItem>
8+
<TabStripItem title="First"></TabStripItem>
9+
<TabStripItem title="Second"></TabStripItem>
1010
</TabStrip>
1111

1212
<TabContentItem>
13-
<GridLayout>
14-
<Label text="First View" verticalAlignment="center" horizontalAlignment="center"/>
15-
</GridLayout>
13+
<GridLayout>
14+
<Label text="First View" />
15+
</GridLayout>
1616
</TabContentItem>
1717

1818
<TabContentItem>
19-
<GridLayout>
20-
<Label text="Second View" verticalAlignment="center" horizontalAlignment="center"/>
21-
</GridLayout>
19+
<GridLayout>
20+
<Label text="Second View" />
21+
</GridLayout>
2222
</TabContentItem>
23-
</BottomNavigation>
23+
</Tabs>
2424
</Page>

‎e2e/ui-tests-app/app/tabs/color-page.xml‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,23 @@
11
<Page class="page">
2-
<ActionBar title="BottomNavigation color" icon="" class="action-bar">
2+
<ActionBar title="Tabs color" icon="" class="action-bar">
33
</ActionBar>
44

5-
<BottomNavigation style="color: green;">
5+
<Tabs style="color: green;">
66
<TabStrip>
7-
<TabStripItem title="First"></TabStripItem>
8-
<TabStripItem title="Second"></TabStripItem>
7+
<TabStripItem title="First"></TabStripItem>
8+
<TabStripItem title="Second"></TabStripItem>
99
</TabStrip>
1010

1111
<TabContentItem>
12-
<GridLayout>
13-
<Label text="First View" verticalAlignment="center" horizontalAlignment="center"/>
14-
</GridLayout>
12+
<GridLayout>
13+
<Label text="First View" />
14+
</GridLayout>
1515
</TabContentItem>
1616

1717
<TabContentItem>
18-
<GridLayout>
19-
<Label text="Second View" verticalAlignment="center" horizontalAlignment="center"/>
20-
</GridLayout>
18+
<GridLayout>
19+
<Label text="Second View" />
20+
</GridLayout>
2121
</TabContentItem>
22-
</BottomNavigation>
22+
</Tabs>
2323
</Page>

0 commit comments

Comments
 (0)