Skip to content

Commit

Permalink
Fixes #53
Browse files Browse the repository at this point in the history
  • Loading branch information
mcasimir committed May 15, 2014
1 parent 095e472 commit a9a20c7
Show file tree
Hide file tree
Showing 12 changed files with 216 additions and 70 deletions.
4 changes: 4 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,9 @@
# Mobile Angular Ui Changelog

### v. 1.1.0-beta.21

- Fixes #53: Android devices bad rendering box model with %-based translate3d. Switched to fixed sidebars width and media-queries.

### v. 1.1.0-beta.20

_Sun May 11 12:54 2014_
Expand Down
54 changes: 44 additions & 10 deletions dist/css/mobile-angular-ui-base.css
Original file line number Diff line number Diff line change
Expand Up @@ -6844,34 +6844,36 @@ a.list-group-item .icon.pull-right {

.sidebar-left {
background: #555555;
width: 80%;
width: 300px;
left: 0;
right: auto;
-webkit-transition: width 400ms ease;
transition: width 400ms ease;
}

.sidebar-right {
background: #555555;
width: 80%;
width: 300px;
left: auto;
right: 0;
opacity: 1;
filter: alpha(opacity=100);
-webkit-transition: opacity 600ms cubic-bezier(1, 0, 1, 0);
transition: opacity 600ms cubic-bezier(1, 0, 1, 0);
-webkit-transition: opacity 600ms cubic-bezier(1, 0, 1, 0), width 400ms ease;
transition: opacity 600ms cubic-bezier(1, 0, 1, 0), width 400ms ease;
}

.sidebar-left-in .sidebar-right {
z-index: -100;
opacity: 0;
filter: alpha(opacity=0);
-webkit-transition: opacity 600ms cubic-bezier(1, 0, 1, 0);
transition: opacity 600ms cubic-bezier(1, 0, 1, 0);
-webkit-transition: opacity 600ms cubic-bezier(1, 0, 1, 0), width 400ms ease;
transition: opacity 600ms cubic-bezier(1, 0, 1, 0), width 400ms ease;
}

.sidebar-left-in .app {
width: 100%;
-webkit-transform: translate3d(80%, 0, 0);
transform: translate3d(80%, 0, 0);
-webkit-transform: translate3d(300px, 0, 0);
transform: translate3d(300px, 0, 0);
-webkit-transition: -webkit-transform 400ms ease;
-moz-transition: -moz-transform 400ms ease;
-o-transition: -o-transform 400ms ease;
Expand All @@ -6880,8 +6882,8 @@ a.list-group-item .icon.pull-right {

.sidebar-right-in .app {
width: 100%;
-webkit-transform: translate3d(-80%, 0, 0);
transform: translate3d(-80%, 0, 0);
-webkit-transform: translate3d(-300px, 0, 0);
transform: translate3d(-300px, 0, 0);
-webkit-transition: -webkit-transform 400ms ease;
-moz-transition: -moz-transform 400ms ease;
-o-transition: -o-transform 400ms ease;
Expand Down Expand Up @@ -7313,3 +7315,35 @@ form .panel-body {
margin-left: 0%;
}
}
@media (min-width: 480px) {
.sidebar-left {
width: 440px;
}
.sidebar-right {
width: 440px;
}
.sidebar-left-in .app {
-webkit-transform: translate3d(440px, 0, 0);
transform: translate3d(440px, 0, 0);
}
.sidebar-right-in .app {
-webkit-transform: translate3d(-440px, 0, 0);
transform: translate3d(-440px, 0, 0);
}
}
@media (min-width: 768px) {
.sidebar-left {
width: 688px;
}
.sidebar-right {
width: 688px;
}
.sidebar-left-in .app {
-webkit-transform: translate3d(688px, 0, 0);
transform: translate3d(688px, 0, 0);
}
.sidebar-right-in .app {
-webkit-transform: translate3d(-688px, 0, 0);
transform: translate3d(-688px, 0, 0);
}
}
2 changes: 1 addition & 1 deletion dist/css/mobile-angular-ui-base.min.css

Large diffs are not rendered by default.

47 changes: 31 additions & 16 deletions dist/css/mobile-angular-ui-desktop.css
Original file line number Diff line number Diff line change
Expand Up @@ -470,47 +470,62 @@
.sidebar-left {
display: block;
left: 0;
width: 280px;
width: 300px;
}
.sidebar-right {
display: block;
right: 0;
left: auto;
width: 280px;
width: 300px;
}
.sidebar-right-in .sidebar-left {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
-webkit-transform: translate3d(0, 0, 0) !important;
-moz-transform: translate3d(0, 0, 0) !important;
transform: translate3d(0, 0, 0) !important;
}
.sidebar-left-in .sidebar-right {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
-webkit-transform: translate3d(0, 0, 0) !important;
-moz-transform: translate3d(0, 0, 0) !important;
transform: translate3d(0, 0, 0) !important;
}
.has-sidebar-left .app,
.sidebar-left-in .app {
width: auto;
margin-left: 280px;
margin-left: 300px;
left: 0;
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
-webkit-transform: translate3d(0, 0, 0) !important;
-moz-transform: translate3d(0, 0, 0) !important;
transform: translate3d(0, 0, 0) !important;
position: relative;
-webkit-transition: -webkit-transform 0 ease;
-moz-transition: -moz-transform 0 ease;
transition: transform 0 ease;
}
.sidebar-right-in .app {
width: auto;
margin-right: 280px;
margin-right: 300px;
right: 0;
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
-webkit-transform: translate3d(0, 0, 0) !important;
-moz-transform: translate3d(0, 0, 0) !important;
transform: translate3d(0, 0, 0) !important;
position: relative;
-webkit-transition: -webkit-transform 0 ease;
-moz-transition: -moz-transform 0 ease;
transition: transform 0 ease;
}
}
@media (min-width: 1200px) {
.sidebar-left {
width: 320px;
}
.sidebar-right {
width: 320px;
}
.has-sidebar-left .app,
.sidebar-left-in .app {
margin-left: 320px;
}
.sidebar-right-in .app {
margin-right: 320px;
}
}
2 changes: 1 addition & 1 deletion dist/css/mobile-angular-ui-desktop.min.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 0 additions & 1 deletion site/content/assets/css/main.css
Original file line number Diff line number Diff line change
Expand Up @@ -518,4 +518,3 @@ html .sec-help .btn:hover {
#docs #toc0+h2 {
margin-top: 0;
}

Loading

0 comments on commit a9a20c7

Please sign in to comment.