Skip to content

Commit

Permalink
fix(mobile): chrome 53+ not allowing selects to open. #96
Browse files Browse the repository at this point in the history
  • Loading branch information
polonel committed Oct 17, 2018
1 parent 4f6c00d commit 7d71135
Show file tree
Hide file tree
Showing 21 changed files with 417 additions and 214 deletions.
87 changes: 73 additions & 14 deletions mobile/css/ionic.app.css
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ $dark: #444 !default;
Ionicons, v2.0.1
Created by Ben Sperry for the Ionic Framework, http://ionicons.com/
https://twitter.com/benjsperry https://twitter.com/ionicframework
MIT License: https://github.com/driftyco/ionicons
MIT License: https://github.com/ionic-team/ionicons
Android-style icons originally built by Google’s
Material Design Icons: https://github.com/google/material-design-icons
Expand Down Expand Up @@ -6604,6 +6604,9 @@ button.item.item-button-right {
align-items: center; }
.item-options .button:before {
margin: 0 auto; }
.item-options ion-option-button:last-child {
padding-right: calc(constant(safe-area-inset-right) + 12px);
padding-right: calc(env(safe-area-inset-right) + 12px); }

/**
* Lists
Expand Down Expand Up @@ -9599,28 +9602,57 @@ a.button {
* Platform specific tweaks
*/
.platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader) {
height: 64px; }
height: 64px;
height: calc(constant(safe-area-inset-top) + 44px);
height: calc(env(safe-area-inset-top) + 44px); }
.platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader).item-input-inset .item-input-wrapper {
margin-top: 19px !important; }
.platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader) > * {
margin-top: 20px; }

.platform-ios.platform-cordova:not(.fullscreen) .tabs-top > .tabs,
.platform-ios.platform-cordova:not(.fullscreen) .tabs.tabs-top {
margin-top: 20px;
margin-top: constant(safe-area-inset-top);
margin-top: env(safe-area-inset-top); }

.platform-ios.platform-cordova:not(.fullscreen) .bar-header {
padding-left: calc( constant(safe-area-inset-left) + 5px);
padding-left: calc(env(safe-area-inset-left) + 5px);
padding-right: calc(constant(safe-area-inset-right) + 5px);
padding-right: calc(env(safe-area-inset-right) + 5px); }
.platform-ios.platform-cordova:not(.fullscreen) .bar-header .buttons:last-child {
right: calc(constant(safe-area-inset-right) + 5px);
right: calc(env(safe-area-inset-right) + 5px); }

.platform-ios.platform-cordova:not(.fullscreen) .has-tabs, .platform-ios.platform-cordova:not(.fullscreen) .bar-footer.has-tabs {
bottom: calc(constant(safe-area-inset-bottom) + 49px);
bottom: calc(env(safe-area-inset-bottom) + 49px); }

.platform-ios.platform-cordova:not(.fullscreen) .tabs-top > .tabs, .platform-ios.platform-cordova:not(.fullscreen) .tabs.tabs-top {
top: 64px; }

.platform-ios.platform-cordova:not(.fullscreen) .has-header,
.platform-ios.platform-cordova:not(.fullscreen) .bar-subheader {
top: 64px; }
.platform-ios.platform-cordova:not(.fullscreen) .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); }

.platform-ios.platform-cordova:not(.fullscreen) .has-header, .platform-ios.platform-cordova:not(.fullscreen) .bar-subheader {
top: 64px;
top: calc(constant(safe-area-inset-top) + 44px);
top: calc(env(safe-area-inset-top) + 44px); }

.platform-ios.platform-cordova:not(.fullscreen) .has-subheader {
top: 108px; }
top: 108px;
top: calc(constant(safe-area-inset-top) + 88px);
top: calc(env(safe-area-inset-top) + 88px); }

.platform-ios.platform-cordova:not(.fullscreen) .has-header.has-tabs-top {
top: 113px; }
top: 113px;
top: calc(93px + constant(safe-area-inset-top));
top: calc(93px + env(safe-area-inset-top)); }

.platform-ios.platform-cordova:not(.fullscreen) .has-header.has-subheader.has-tabs-top {
top: 157px; }
top: 157px;
top: calc(137px + constant(safe-area-inset-right));
top: calc(137px + env(safe-area-inset-right)); }

.platform-ios.platform-cordova .popover .bar-header:not(.bar-subheader) {
height: 44px; }
Expand All @@ -9629,8 +9661,7 @@ a.button {
.platform-ios.platform-cordova .popover .bar-header:not(.bar-subheader) > * {
margin-top: 0; }

.platform-ios.platform-cordova .popover .has-header,
.platform-ios.platform-cordova .popover .bar-subheader {
.platform-ios.platform-cordova .popover .has-header, .platform-ios.platform-cordova .popover .bar-subheader {
top: 44px; }

.platform-ios.platform-cordova .popover .has-subheader {
Expand All @@ -9640,6 +9671,34 @@ a.button {
margin-bottom: 20px; }

@media (orientation: landscape) {
.item {
padding: 16px calc(constant(safe-area-inset-right) + 16px); }
.item .badge {
right: calc(constant(safe-area-inset-right) + 32px); }
.item-icon-left {
padding-left: calc(constant(safe-area-inset-left) + 54px); }
.item-icon-left .icon {
left: calc(constant(safe-area-inset-left) + 11px); }
.item-icon-right {
padding-right: calc(constant(safe-area-inset-right) + 54px); }
.item-icon-right .icon {
right: calc(constant(safe-area-inset-right) + 11px); }
.item-complex,
a.item.item-complex,
button.item.item-complex {
padding: 0; }
.item-complex .item-content, a.item.item-complex .item-content, button.item.item-complex .item-content {
padding: 16px calc(constant(safe-area-inset-right) + 49px) 16px calc(constant(safe-area-inset-left) + 16px); }
.item-left-edit.visible.active {
-webkit-transform: translate3d(calc(constant(safe-area-inset-left) + 8px), 0, 0);
transform: 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 {
-webkit-transform: translate3d(calc(constant(safe-area-inset-left) + 50px), 0, 0);
transform: 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; } }

Expand Down
2 changes: 1 addition & 1 deletion mobile/css/ionic.app.min.css

Large diffs are not rendered by default.

4 changes: 4 additions & 0 deletions mobile/css/style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
body {
padding-top: constant(safe-area-inset-top); /* iOS 11.0 */
padding-top: env(safe-area-inset-top); /* iOS 11.2 */
}
23 changes: 10 additions & 13 deletions mobile/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width, viewport-fit=cover">
<meta name="viewport" content="initial-scale=1,user-scalable=no, width=device-width, height=device-height, viewport-fit=cover">
<meta http-equiv="Content-Security-Policy" content="default-src gap://ready file://* * 'self' data: blob: 'unsafe-inline' 'unsafe-eval' ws: wss:;">
<title></title>

Expand All @@ -17,9 +17,6 @@

<script src="lib/ngstorage/ngStorage.min.js"></script>

<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>

<!--ionic filter plugin-->
<link rel="stylesheet" href="lib/ionic-filter-bar/dist/ionic.filter.bar.css">
<script src="lib/ionic-filter-bar/dist/ionic.filter.bar.js" charset="utf-8"></script>
Expand Down Expand Up @@ -47,16 +44,16 @@
<script src="js/dist/td.app.min.js"></script>
</head>
<body ng-app="trudesk">
<!--
The nav bar that will be updated as we navigate between views.
-->
<div id="loader" class="loader"></div>
<ion-nav-bar class="bar-dark nav-title-slide-ios7">
<ion-nav-back-button>
</ion-nav-back-button>
</ion-nav-bar>
<div class="mobile-container">

<ion-nav-view></ion-nav-view>

<div id="loader" class="loader"></div>
<ion-nav-bar class="bar-dark nav-title-slide-ios7">
<ion-nav-back-button>
</ion-nav-back-button>
</ion-nav-bar>

<ion-nav-view></ion-nav-view>
</div>
</body>
</html>
2 changes: 1 addition & 1 deletion mobile/js/dist/td.app.js
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ angular.module('trudesk', [
if (jsonData.notification.payload && jsonData.notification.payload.additionalData) {
var ticketUid = jsonData.notification.payload.additionalData.ticketUid;
if (ticketUid) {
console.log('Moving to ticket: ' + ticketUid);
// console.log('Moving to ticket: ' + ticketUid);
$state.go('tab.tickets')
setTimeout(function() {
return $state.go('tab.tickets-details', { ticketuid: ticketUid})
Expand Down
4 changes: 2 additions & 2 deletions mobile/js/dist/td.app.min.js

Large diffs are not rendered by default.

18 changes: 9 additions & 9 deletions mobile/lib/ionic/.bower.json
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
{
"name": "ionic",
"version": "1.3.1",
"codename": "el salvador",
"homepage": "https://github.com/driftyco/ionic",
"version": "1.3.5",
"codename": "hong kong",
"homepage": "https://github.com/ionic-team/ionic-v1",
"authors": [
"Max Lynch <[email protected]>",
"Adam Bradley <[email protected]>",
Expand Down Expand Up @@ -34,13 +34,13 @@
"angular-sanitize": "1.5.3",
"angular-ui-router": "0.2.13"
},
"_release": "1.3.1",
"_release": "1.3.5",
"_resolution": {
"type": "version",
"tag": "v1.3.1",
"commit": "deade5ac92dc25febaa60b05336decd62f545bb5"
"tag": "v1.3.5",
"commit": "c4e4be2e1766b2caf276bd83af4c924533be688a"
},
"_source": "git://github.com/driftyco/ionic-bower.git",
"_target": "1.3.1",
"_originalSource": "driftyco/ionic-bower"
"_source": "https://github.com/ionic-team/ionic-bower.git",
"_target": "1.3.5",
"_originalSource": "ionic-team/ionic-bower"
}
4 changes: 2 additions & 2 deletions mobile/lib/ionic/README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# ionic-bower

Bower repository for [Ionic Framework](http://github.com/driftyco/ionic)
Bower repository for [Ionic Framework](http://github.com/driftyco/ionic) v1 (Ionic 2+ uses npm)

### Usage

Expand All @@ -10,6 +10,6 @@ Alternatively, include the individual ionic files with the dependencies separate

### Versions

To install the latest stable version, `bower install driftyco/ionic-bower#v1.1.1`
To install the latest stable version, `bower install driftyco/ionic-bower`

To install the latest nightly release, `bower install driftyco/ionic-bower#master`
6 changes: 3 additions & 3 deletions mobile/lib/ionic/bower.json
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
{
"name": "ionic",
"version": "1.3.1",
"codename": "el salvador",
"homepage": "https://github.com/driftyco/ionic",
"version": "1.3.5",
"codename": "hong kong",
"homepage": "https://github.com/ionic-team/ionic-v1",
"authors": [
"Max Lynch <[email protected]>",
"Adam Bradley <[email protected]>",
Expand Down
98 changes: 71 additions & 27 deletions mobile/lib/ionic/css/ionic.css
Original file line number Diff line number Diff line change
@@ -1,22 +1,9 @@
@charset "UTF-8";
/*!
* Copyright 2015 Drifty Co.
* http://drifty.com/
*
* Ionic, v1.3.1
* A powerful HTML5 mobile app framework.
* http://ionicframework.com/
*
* By @maxlynch, @benjsperry, @adamdbradley <3
*
* Licensed under the MIT license. Please see LICENSE for more information.
*
*/
/*!
Ionicons, v2.0.1
Created by Ben Sperry for the Ionic Framework, http://ionicons.com/
https://twitter.com/benjsperry https://twitter.com/ionicframework
MIT License: https://github.com/driftyco/ionicons
MIT License: https://github.com/ionic-team/ionicons
Android-style icons originally built by Google’s
Material Design Icons: https://github.com/google/material-design-icons
Expand Down Expand Up @@ -6601,6 +6588,9 @@ button.item.item-button-right {
align-items: center; }
.item-options .button:before {
margin: 0 auto; }
.item-options ion-option-button:last-child {
padding-right: calc(constant(safe-area-inset-right) + 12px);
padding-right: calc(env(safe-area-inset-right) + 12px); }

/**
* Lists
Expand Down Expand Up @@ -9596,28 +9586,57 @@ a.button {
* Platform specific tweaks
*/
.platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader) {
height: 64px; }
height: 64px;
height: calc(constant(safe-area-inset-top) + 44px);
height: calc(env(safe-area-inset-top) + 44px); }
.platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader).item-input-inset .item-input-wrapper {
margin-top: 19px !important; }
.platform-ios.platform-cordova:not(.fullscreen) .bar-header:not(.bar-subheader) > * {
margin-top: 20px; }

.platform-ios.platform-cordova:not(.fullscreen) .tabs-top > .tabs,
.platform-ios.platform-cordova:not(.fullscreen) .tabs.tabs-top {
margin-top: 20px;
margin-top: constant(safe-area-inset-top);
margin-top: env(safe-area-inset-top); }

.platform-ios.platform-cordova:not(.fullscreen) .bar-header {
padding-left: calc( constant(safe-area-inset-left) + 5px);
padding-left: calc(env(safe-area-inset-left) + 5px);
padding-right: calc(constant(safe-area-inset-right) + 5px);
padding-right: calc(env(safe-area-inset-right) + 5px); }
.platform-ios.platform-cordova:not(.fullscreen) .bar-header .buttons:last-child {
right: calc(constant(safe-area-inset-right) + 5px);
right: calc(env(safe-area-inset-right) + 5px); }

.platform-ios.platform-cordova:not(.fullscreen) .has-tabs, .platform-ios.platform-cordova:not(.fullscreen) .bar-footer.has-tabs {
bottom: calc(constant(safe-area-inset-bottom) + 49px);
bottom: calc(env(safe-area-inset-bottom) + 49px); }

.platform-ios.platform-cordova:not(.fullscreen) .tabs-top > .tabs, .platform-ios.platform-cordova:not(.fullscreen) .tabs.tabs-top {
top: 64px; }

.platform-ios.platform-cordova:not(.fullscreen) .has-header,
.platform-ios.platform-cordova:not(.fullscreen) .bar-subheader {
top: 64px; }
.platform-ios.platform-cordova:not(.fullscreen) .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); }

.platform-ios.platform-cordova:not(.fullscreen) .has-header, .platform-ios.platform-cordova:not(.fullscreen) .bar-subheader {
top: 64px;
top: calc(constant(safe-area-inset-top) + 44px);
top: calc(env(safe-area-inset-top) + 44px); }

.platform-ios.platform-cordova:not(.fullscreen) .has-subheader {
top: 108px; }
top: 108px;
top: calc(constant(safe-area-inset-top) + 88px);
top: calc(env(safe-area-inset-top) + 88px); }

.platform-ios.platform-cordova:not(.fullscreen) .has-header.has-tabs-top {
top: 113px; }
top: 113px;
top: calc(93px + constant(safe-area-inset-top));
top: calc(93px + env(safe-area-inset-top)); }

.platform-ios.platform-cordova:not(.fullscreen) .has-header.has-subheader.has-tabs-top {
top: 157px; }
top: 157px;
top: calc(137px + constant(safe-area-inset-right));
top: calc(137px + env(safe-area-inset-right)); }

.platform-ios.platform-cordova .popover .bar-header:not(.bar-subheader) {
height: 44px; }
Expand All @@ -9626,8 +9645,7 @@ a.button {
.platform-ios.platform-cordova .popover .bar-header:not(.bar-subheader) > * {
margin-top: 0; }

.platform-ios.platform-cordova .popover .has-header,
.platform-ios.platform-cordova .popover .bar-subheader {
.platform-ios.platform-cordova .popover .has-header, .platform-ios.platform-cordova .popover .bar-subheader {
top: 44px; }

.platform-ios.platform-cordova .popover .has-subheader {
Expand All @@ -9637,6 +9655,32 @@ a.button {
margin-bottom: 20px; }

@media (orientation: landscape) {
.item {
padding: 16px calc(constant(safe-area-inset-right) + 16px); }
.item .badge {
right: calc(constant(safe-area-inset-right) + 32px); }
.item-icon-left {
padding-left: calc(constant(safe-area-inset-left) + 54px); }
.item-icon-left .icon {
left: calc(constant(safe-area-inset-left) + 11px); }
.item-icon-right {
padding-right: calc(constant(safe-area-inset-right) + 54px); }
.item-icon-right .icon {
right: calc(constant(safe-area-inset-right) + 11px); }
.item-complex, a.item.item-complex, button.item.item-complex {
padding: 0; }
.item-complex .item-content, a.item.item-complex .item-content, button.item.item-complex .item-content {
padding: 16px calc(constant(safe-area-inset-right) + 49px) 16px calc(constant(safe-area-inset-left) + 16px); }
.item-left-edit.visible.active {
-webkit-transform: translate3d(calc(constant(safe-area-inset-left) + 8px), 0, 0);
transform: 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 {
-webkit-transform: translate3d(calc(constant(safe-area-inset-left) + 50px), 0, 0);
transform: 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; } }

Expand Down
Loading

0 comments on commit 7d71135

Please sign in to comment.