android popovers
This commit is contained in:
Родитель
91bcafcd3a
Коммит
e4291bc32d
|
@ -413,17 +413,28 @@ textarea,
|
|||
}
|
||||
|
||||
.popover {
|
||||
top: 90px;
|
||||
top: 47px;
|
||||
left: 15px;
|
||||
width: 200px;
|
||||
margin-left: 0;
|
||||
border: 1px solid #9b9b9b;
|
||||
border-radius: 0;
|
||||
box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
|
||||
-webkit-transition: -webkit-transform 0.2s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
|
||||
-moz-transition: -webkit-transform 0.2s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
|
||||
transition: -webkit-transform 0.2s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
|
||||
-webkit-transform: scale(0.75);
|
||||
-ms-transform: scale(0.75);
|
||||
transform: scale(0.75);
|
||||
-webkit-transition: -webkit-transform 0.1s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
|
||||
-moz-transition: -webkit-transform 0.1s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
|
||||
transition: -webkit-transform 0.1s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
|
||||
}
|
||||
.popover:before {
|
||||
display: none;
|
||||
}
|
||||
.popover.visible {
|
||||
-webkit-transform: scale(1);
|
||||
-ms-transform: scale(1);
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
.popover .bar {
|
||||
border-radius: 0;
|
||||
|
|
|
@ -1029,8 +1029,8 @@ select {
|
|||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 10;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
z-index: 15;
|
||||
background-color: none;
|
||||
}
|
||||
|
||||
.popover .btn-block {
|
||||
|
|
|
@ -1567,17 +1567,28 @@ hr {
|
|||
background-color: #ff4444;
|
||||
}
|
||||
.platform-android .popover {
|
||||
top: 90px;
|
||||
top: 47px;
|
||||
left: 15px;
|
||||
width: 200px;
|
||||
margin-left: 0;
|
||||
border: 1px solid #9b9b9b;
|
||||
border-radius: 0;
|
||||
box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
|
||||
-webkit-transition: -webkit-transform 0.2s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
|
||||
-moz-transition: -webkit-transform 0.2s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
|
||||
transition: -webkit-transform 0.2s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
|
||||
-webkit-transform: scale(0.75);
|
||||
-ms-transform: scale(0.75);
|
||||
transform: scale(0.75);
|
||||
-webkit-transition: -webkit-transform 0.1s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
|
||||
-moz-transition: -webkit-transform 0.1s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
|
||||
transition: -webkit-transform 0.1s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
|
||||
}
|
||||
.platform-android .popover:before {
|
||||
display: none;
|
||||
}
|
||||
.platform-android .popover.visible {
|
||||
-webkit-transform: scale(1);
|
||||
-ms-transform: scale(1);
|
||||
transform: scale(1);
|
||||
}
|
||||
.platform-android .popover .bar {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
@ -1681,6 +1692,11 @@ hr {
|
|||
.platform-android .device .content {
|
||||
top: 50px;
|
||||
}
|
||||
.platform-android .device .popover {
|
||||
-webkit-transform: scale(1);
|
||||
-ms-transform: scale(1);
|
||||
transform: scale(1);
|
||||
}
|
||||
.platform-android .bar ~ .content {
|
||||
padding: 0;
|
||||
}
|
||||
|
|
|
@ -8,7 +8,7 @@
|
|||
<meta name="apple-mobile-web-app-status-bar-style" content="black">
|
||||
|
||||
<link rel="stylesheet" href="../../dist/ratchet.css">
|
||||
<link rel="stylesheet" href="../../dist/ios-theme.css">
|
||||
<link rel="stylesheet" href="../../dist/android-theme.css">
|
||||
<link rel="stylesheet" href="css/app.css">
|
||||
<script src="../../dist/ratchet.js"></script>
|
||||
|
||||
|
|
|
@ -775,6 +775,9 @@ hr {
|
|||
.content {
|
||||
top: 50px;
|
||||
}
|
||||
.popover {
|
||||
@include transform(scale(1));
|
||||
}
|
||||
}
|
||||
.bar ~ .content {
|
||||
padding: 0;
|
||||
|
|
|
@ -31,7 +31,7 @@
|
|||
content: '';
|
||||
}
|
||||
|
||||
// Popover animation
|
||||
// Popover transition
|
||||
// --------------------------------------------------
|
||||
|
||||
&.visible {
|
||||
|
@ -53,8 +53,8 @@
|
|||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 10;
|
||||
background-color: rgba(0,0,0,.3);
|
||||
z-index: 15;
|
||||
background-color: none;
|
||||
}
|
||||
|
||||
// Block level buttons in popovers
|
||||
|
|
|
@ -587,15 +587,24 @@ textarea,
|
|||
// --------------------------------------------------
|
||||
|
||||
.popover {
|
||||
top: 90px;
|
||||
top: 47px;
|
||||
left: 15px;
|
||||
width: 200px;
|
||||
margin-left: 0;
|
||||
border: 1px solid #9b9b9b;
|
||||
border-radius: 0;
|
||||
box-shadow: 0 0 3px rgba(0,0,0,.2);
|
||||
@include transition(-webkit-transform 0.2s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out);
|
||||
@include transform(scale(.75));
|
||||
@include transition(-webkit-transform 0.1s ease-in-out, transform 0.2s ease-in-out, opacity 0.2s ease-in-out);
|
||||
|
||||
&:before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
&.visible {
|
||||
@include transform(scale(1));
|
||||
}
|
||||
}
|
||||
|
||||
// Popovers with bars
|
||||
|
|
Загрузка…
Ссылка в новой задаче