reduce width of searchbox on mobile, fix overlap, fix #7282
This commit is contained in:
parent
3bd984ebf0
commit
3e2c56157b
|
@ -0,0 +1,20 @@
|
|||
@media only screen and (max-width: 600px) {
|
||||
|
||||
/* compress search box on mobile, expand when focused */
|
||||
.searchbox input[type="search"] {
|
||||
width: 17%;
|
||||
-webkit-transition: width 100ms;
|
||||
-moz-transition: width 100ms;
|
||||
-o-transition: width 100ms;
|
||||
transition: width 100ms;
|
||||
}
|
||||
.searchbox input[type="search"]:focus,
|
||||
.searchbox input[type="search"]:active {
|
||||
width: 155px;
|
||||
-webkit-transition: width 100ms;
|
||||
-moz-transition: width 100ms;
|
||||
-o-transition: width 100ms;
|
||||
transition: width 100ms;
|
||||
}
|
||||
|
||||
}
|
|
@ -205,17 +205,19 @@ textarea:disabled {
|
|||
color: #bbb;
|
||||
}
|
||||
|
||||
|
||||
/* Searchbox */
|
||||
.searchbox input[type="search"] {
|
||||
position: relative;
|
||||
font-size: 1.2em;
|
||||
padding: .2em .5em .2em 1.5em;
|
||||
padding-left: 1.5em;
|
||||
background: #fff url('../img/actions/search.svg') no-repeat .5em center;
|
||||
border: 0;
|
||||
border-radius: 1em;
|
||||
border-radius: 2em;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter:alpha(opacity=70); opacity: .7;
|
||||
margin-top: 10px;
|
||||
margin-top: 6px;
|
||||
float: right;
|
||||
}
|
||||
|
||||
input[type="submit"].enabled {
|
||||
background: #66f866;
|
||||
border: 1px solid #5e5;
|
||||
|
|
|
@ -332,6 +332,7 @@ class OC {
|
|||
}
|
||||
|
||||
OC_Util::addStyle("styles");
|
||||
OC_Util::addStyle("mobile");
|
||||
OC_Util::addStyle("icons");
|
||||
OC_Util::addStyle("apps");
|
||||
OC_Util::addStyle("fixes");
|
||||
|
|
Loading…
Reference in New Issue