Skip to content

Commit 15642e4

Browse files
committed
fix(cordova): fix the status bar padding with the new structure
1 parent 5a85d82 commit 15642e4

File tree

4 files changed

+10
-45
lines changed

4 files changed

+10
-45
lines changed

src/platform/cordova.ios.scss

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,18 +7,16 @@
77
$cordova-ios-statusbar-padding-modal-max-width: $cordova-statusbar-padding-modal-max-width !default;
88

99

10-
@include navbar-section-statusbar-padding($toolbar-ios-height);
11-
@include navbar-section-title-statusbar-padding($toolbar-ios-height);
12-
13-
.tab-subpage,
1410
ion-nav > ion-page,
11+
ion-nav > ion-page > ion-header,
12+
ion-tab > ion-page > ion-header,
1513
ion-menu {
1614
@include toolbar-statusbar-padding($toolbar-ios-height, $content-ios-padding);
1715
@include toolbar-title-statusbar-padding($toolbar-ios-height, $content-ios-padding);
1816
}
1917

2018
@media only screen and (max-width: $cordova-ios-statusbar-padding-modal-max-width) {
21-
.modal-wrapper > ion-modal-inner {
19+
.modal-wrapper > ion-page > ion-header {
2220
@include toolbar-statusbar-padding($toolbar-ios-height, $content-ios-padding);
2321
@include toolbar-title-statusbar-padding($toolbar-ios-height, $content-ios-padding);
2422
}

src/platform/cordova.md.scss

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,16 +7,15 @@
77
$cordova-md-statusbar-padding-modal-max-width: $cordova-statusbar-padding-modal-max-width !default;
88

99

10-
@include navbar-section-statusbar-padding($toolbar-md-height);
11-
12-
.tab-subpage,
1310
ion-nav > ion-page,
11+
ion-nav > ion-page > ion-header,
12+
ion-tab > ion-page > ion-header,
1413
ion-menu {
1514
@include toolbar-statusbar-padding($toolbar-md-height, $content-md-padding);
1615
}
1716

1817
@media only screen and (max-width: $cordova-md-statusbar-padding-modal-max-width) {
19-
.modal-wrapper > ion-modal-inner {
18+
.modal-wrapper > ion-page > ion-header {
2019
@include toolbar-statusbar-padding($toolbar-md-height, $content-md-padding);
2120
}
2221
}

src/platform/cordova.scss

Lines changed: 1 addition & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -33,27 +33,8 @@ $cordova-statusbar-padding-modal-max-width: 767px !default;
3333

3434
}
3535

36-
// The navbar section should get modified height and padding-top for the status bar
37-
// --------------------------------------------------------------------------------
38-
39-
@mixin navbar-section-statusbar-padding($toolbar-height) {
40-
41-
ion-navbar-section.statusbar-padding {
42-
height: calc(#{$toolbar-height} + #{$cordova-ios-statusbar-padding});
43-
min-height: calc(#{$toolbar-height} + #{$cordova-ios-statusbar-padding});
44-
}
45-
46-
ion-navbar-section.statusbar-padding > .toolbar {
47-
padding-top: $cordova-ios-statusbar-padding;
48-
49-
height: calc(#{$toolbar-height} + #{$cordova-ios-statusbar-padding});
50-
min-height: calc(#{$toolbar-height} + #{$cordova-ios-statusbar-padding});
51-
}
5236

53-
}
54-
55-
56-
// iOS is the only mode that uses these mixins and they should be removed with #5036
37+
// iOS is the only mode that uses this mixins and it should be removed with #5036
5738
// --------------------------------------------------------------------------------
5839

5940
@mixin toolbar-title-statusbar-padding($toolbar-height, $content-padding) {
@@ -67,15 +48,3 @@ $cordova-statusbar-padding-modal-max-width: 767px !default;
6748
}
6849

6950
}
70-
71-
@mixin navbar-section-title-statusbar-padding($toolbar-height) {
72-
73-
ion-navbar-section.statusbar-padding > .toolbar ion-segment,
74-
ion-navbar-section.statusbar-padding > .toolbar ion-title {
75-
padding-top: $cordova-ios-statusbar-padding;
76-
77-
height: calc(#{$toolbar-height} + #{$cordova-ios-statusbar-padding});
78-
min-height: calc(#{$toolbar-height} + #{$cordova-ios-statusbar-padding});
79-
}
80-
81-
}

src/platform/cordova.wp.scss

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,16 +7,15 @@
77
$cordova-wp-statusbar-padding-modal-max-width: $cordova-statusbar-padding-modal-max-width !default;
88

99

10-
@include navbar-section-statusbar-padding($toolbar-wp-height);
11-
12-
.tab-subpage,
1310
ion-nav > ion-page,
11+
ion-nav > ion-page > ion-header,
12+
ion-tab > ion-page > ion-header,
1413
ion-menu {
1514
@include toolbar-statusbar-padding($toolbar-wp-height, $content-wp-padding);
1615
}
1716

1817
@media only screen and (max-width: $cordova-wp-statusbar-padding-modal-max-width) {
19-
.modal-wrapper > ion-modal-inner {
18+
.modal-wrapper > ion-page > ion-header {
2019
@include toolbar-statusbar-padding($toolbar-wp-height, $content-wp-padding);
2120
}
2221
}

0 commit comments

Comments
 (0)