1 files changed, 157 insertions, 0 deletions
diff --git a/www/lib/ionic/scss/_platform.scss b/www/lib/ionic/scss/_platform.scss
new file mode 100644
index 00000000..aae13d04
--- /dev/null
+++ b/www/lib/ionic/scss/_platform.scss
@@ -0,0 +1,157 @@
+/**
+ * Platform
+ * --------------------------------------------------
+ * Platform specific tweaks
+ */
+
+.platform-ios.platform-cordova {
+  // iOS has a status bar which sits on top of the header.
+  // Bump down everything to make room for it. However, if
+  // if its in Cordova, and set to fullscreen, then disregard the bump.
+  &:not(.fullscreen) {
+    .bar-header:not(.bar-subheader) {
+      height: $bar-height + $ios-statusbar-height;
+      height: calc(constant(safe-area-inset-top) + #{$bar-height});
+      height: calc(env(safe-area-inset-top) + #{$bar-height});
+
+      &.item-input-inset .item-input-wrapper {
+        margin-top: 19px !important;
+      }
+
+      > * {
+        margin-top: $ios-statusbar-height;
+        margin-top: constant(safe-area-inset-top);
+        margin-top: env(safe-area-inset-top);
+      }
+    }
+    .bar-header {
+      padding-left: calc( constant(safe-area-inset-left) + #{$bar-padding-portrait});
+      padding-left: calc(env(safe-area-inset-left) + #{$bar-padding-portrait});
+      padding-right: calc(constant(safe-area-inset-right) + #{$bar-padding-portrait});
+      padding-right: calc(env(safe-area-inset-right) + #{$bar-padding-portrait});
+
+      .buttons:last-child {
+        right: calc(constant(safe-area-inset-right) + #{$bar-padding-portrait});
+        right: calc(env(safe-area-inset-right) + #{$bar-padding-portrait});
+      }
+    }
+
+    .has-tabs, .bar-footer.has-tabs {
+      bottom : calc(constant(safe-area-inset-bottom) + #{$tabs-height});
+      bottom : calc(env(safe-area-inset-bottom) + #{$tabs-height});
+    }
+
+    .tabs-top > .tabs, .tabs.tabs-top {
+      top: $bar-height + $ios-statusbar-height;
+    }
+
+    .tabs {
+      padding-bottom: constant(safe-area-inset-bottom);
+      padding-bottom: env(safe-area-inset-bottom);
+      height: calc(constant(safe-area-inset-bottom) + 49px);
+      height: calc(env(safe-area-inset-bottom) + 49px);
+    }
+    .has-header, .bar-subheader {
+      top: $bar-height + $ios-statusbar-height;
+      top: calc(constant(safe-area-inset-top) + #{$bar-height});
+      top: calc(env(safe-area-inset-top) + #{$bar-height});
+    }
+    .has-subheader {
+      top: $bar-height + $bar-subheader-height + $ios-statusbar-height;
+
+      top: calc(constant(safe-area-inset-top) + #{$bar-height + $bar-subheader-height});
+      top: calc(env(safe-area-inset-top) + #{$bar-height + $bar-subheader-height});
+    }
+    .has-header.has-tabs-top {
+      top: $bar-height + $tabs-height + $ios-statusbar-height;
+
+      top: calc(#{$bar-height + $tabs-height} + constant(safe-area-inset-top));
+      top: calc(#{$bar-height + $tabs-height} + env(safe-area-inset-top));
+    }
+    .has-header.has-subheader.has-tabs-top {
+      top: $bar-height + $bar-subheader-height + $tabs-height + $ios-statusbar-height;
+
+      top: calc(#{$bar-height + $bar-subheader-height + $tabs-height} + constant(safe-area-inset-right));
+      top: calc(#{$bar-height + $bar-subheader-height + $tabs-height} + env(safe-area-inset-right));
+    }
+  }
+  .popover {
+    .bar-header:not(.bar-subheader) {
+      height: $bar-height;
+      &.item-input-inset .item-input-wrapper {
+        margin-top: -1px;
+      }
+      > * {
+        margin-top: 0;
+      }
+    }
+    .has-header, .bar-subheader {
+      top: $bar-height;
+    }
+    .has-subheader {
+      top: $bar-height + $bar-subheader-height;
+    }
+  }
+  &.status-bar-hide {
+    // Cordova doesn't adjust the body height correctly, this makes up for it
+    margin-bottom: 20px;
+  }
+}
+
+@media (orientation: landscape) {
+  .item {
+    padding: $item-padding calc(constant(safe-area-inset-right) + #{$item-padding});
+
+    .badge {
+      right: calc(constant(safe-area-inset-right) + 32px)
+    }
+  }
+  .item-icon-left {
+    padding-left: calc(constant(safe-area-inset-left) + 54px);
+
+    .icon {
+      left: calc(constant(safe-area-inset-left) + 11px);
+    }
+  }
+  .item-icon-right {
+    padding-right: calc(constant(safe-area-inset-right) + 54px);
+    .icon {
+      right: calc(constant(safe-area-inset-right) + 11px);
+    }
+  }
+
+  .item-complex, a.item.item-complex, button.item.item-complex {
+    padding: 0;
+
+    .item-content {
+      padding: $item-padding
+        calc(constant(safe-area-inset-right) + #{(ceil( ($item-padding * 3) + ($item-padding / 3)) - 5)})
+        $item-padding
+        calc(constant(safe-area-inset-left) + #{$item-padding});
+    }
+  }
+
+  .item-left-edit.visible.active {
+    @include translate3d(calc(constant(safe-area-inset-left) + 8px), 0, 0);
+  }
+  .list-left-editing .item-left-editable .item-content,
+  .item-left-editing.item-left-editable .item-content {
+    @include translate3d(calc(constant(safe-area-inset-left) + 50px), 0, 0);
+  }
+
+  .item-right-edit{
+    right: constant(safe-area-inset-right);
+    right: env(safe-area-inset-right)
+  }
+
+
+  .platform-ios.platform-browser.platform-ipad {
+    position: fixed; // required for iPad 7 Safari
+  }
+}
+
+.platform-c:not(.enable-transitions) * {
+  // disable transitions on grade-c devices (Android 2)
+  -webkit-transition: none !important;
+  transition: none !important;
+}