create searchfield
This commit is contained in:
parent
1d43d27f6b
commit
78af957ba3
3 changed files with 37 additions and 32 deletions
|
@ -115,8 +115,9 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="userSearch vertical center">
|
<div class="searchfield">
|
||||||
<input class="js-search form-control flex" name="search" placeholder="Search for users" type="search">
|
<svg class="icon icon-magnifier"><use xlink:href="#icon-magnifier" /></svg>
|
||||||
|
<input class="js-search form-control" name="search" placeholder="Search for users" type="search">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="userSearch horizontal">
|
<div class="userSearch horizontal">
|
||||||
|
|
18
app/assets/stylesheets/bootstrap.css
vendored
18
app/assets/stylesheets/bootstrap.css
vendored
|
@ -125,13 +125,6 @@ button,
|
||||||
select {
|
select {
|
||||||
text-transform: none;
|
text-transform: none;
|
||||||
}
|
}
|
||||||
button,
|
|
||||||
html input[type="button"],
|
|
||||||
input[type="reset"],
|
|
||||||
input[type="submit"] {
|
|
||||||
-webkit-appearance: button;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
button[disabled],
|
button[disabled],
|
||||||
html input[disabled] {
|
html input[disabled] {
|
||||||
cursor: default;
|
cursor: default;
|
||||||
|
@ -155,16 +148,7 @@ input[type="number"]::-webkit-inner-spin-button,
|
||||||
input[type="number"]::-webkit-outer-spin-button {
|
input[type="number"]::-webkit-outer-spin-button {
|
||||||
height: auto;
|
height: auto;
|
||||||
}
|
}
|
||||||
input[type="search"] {
|
|
||||||
-webkit-box-sizing: content-box;
|
|
||||||
-moz-box-sizing: content-box;
|
|
||||||
box-sizing: content-box;
|
|
||||||
-webkit-appearance: textfield;
|
|
||||||
}
|
|
||||||
input[type="search"]::-webkit-search-cancel-button,
|
|
||||||
input[type="search"]::-webkit-search-decoration {
|
|
||||||
-webkit-appearance: none;
|
|
||||||
}
|
|
||||||
fieldset {
|
fieldset {
|
||||||
padding: .35em .625em .75em;
|
padding: .35em .625em .75em;
|
||||||
margin: 0 2px;
|
margin: 0 2px;
|
||||||
|
|
|
@ -254,15 +254,12 @@ span[data-tooltip]:hover:before {
|
||||||
transition: transform 300ms 1.5s cubic-bezier(0.34,1.6,0.71,1), opacity 300ms 1.5s;
|
transition: transform 300ms 1.5s cubic-bezier(0.34,1.6,0.71,1), opacity 300ms 1.5s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.textarea::-webkit-input-placeholder,
|
.textarea::placeholder,
|
||||||
.form-control::-webkit-input-placeholder,
|
.form-control::placeholder,
|
||||||
.token-input::-webkit-input-placeholder { color: hsl(0,0%,80%); }
|
.token-input::placeholder {
|
||||||
.textarea::-moz-placeholder,
|
color: hsl(0,0%,80%);
|
||||||
.form-control::-moz-placeholder,
|
opacity: 1;
|
||||||
.token-input::-moz-placeholder { opacity: 1; color: hsl(0,0%,80%); }
|
}
|
||||||
.textarea:-ms-input-placeholder,
|
|
||||||
.form-control:-ms-input-placeholder,
|
|
||||||
.token-input:-ms-input-placeholder { color: hsl(0,0%,80%); }
|
|
||||||
|
|
||||||
.btn,
|
.btn,
|
||||||
.btn:hover,
|
.btn:hover,
|
||||||
|
@ -899,6 +896,33 @@ textarea,
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.searchfield {
|
||||||
|
position: relative;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
left: 9px;
|
||||||
|
top: 6px;
|
||||||
|
width: 17px;
|
||||||
|
height: 17px;
|
||||||
|
position: absolute;
|
||||||
|
fill: hsl(60,1%,61%);
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type=search] {
|
||||||
|
appearance: textfield;
|
||||||
|
line-height: 30px;
|
||||||
|
height: 30px;
|
||||||
|
border-radius: 19px;
|
||||||
|
padding: 0 17px 0 34px;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="search"]::-webkit-search-cancel-button,
|
||||||
|
input[type="search"]::-webkit-search-decoration {
|
||||||
|
-webkit-appearance: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
@ -4454,10 +4478,6 @@ footer {
|
||||||
vertical-align: bottom;
|
vertical-align: bottom;
|
||||||
}
|
}
|
||||||
|
|
||||||
.userSearch {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.userSearch-label {
|
.userSearch-label {
|
||||||
margin: 10px 10px 0 0;
|
margin: 10px 10px 0 0;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue