diff options
| -rw-r--r-- | wqflask/wqflask/static/new/css/autocomplete.css | 80 |
1 files changed, 80 insertions, 0 deletions
diff --git a/wqflask/wqflask/static/new/css/autocomplete.css b/wqflask/wqflask/static/new/css/autocomplete.css new file mode 100644 index 00000000..aba68e37 --- /dev/null +++ b/wqflask/wqflask/static/new/css/autocomplete.css @@ -0,0 +1,80 @@ +.autocomplete { + /*the container must be positioned relative:*/ + position: relative; + display: inline-block; +} + +input.autocomplete { + border: 1px solid transparent; + background-color: #f1f1f1; + padding: 10px; + font-size: 16px; +} + +input[type=text].autocomplete { + background-color: #f1f1f1; + width: 100%; +} + +input[type=submit].autocomplete { + background-color: DodgerBlue; + color: #fff; +} + + +.autocomplete-items { + position: absolute; + border: 1px solid #d4d4d4; + border-bottom: none; + border-top: none; + z-index: 99; + /*position the autocomplete items to be the same width as the container:*/ + top: 100%; + left: 0; + right: 0; +} + +.autocomplete-items div { + padding: 10px; + cursor: pointer; + background-color: #fff; + border-bottom: 1px solid #d4d4d4; +} + +.autocomplete-items div:hover { + /*when hovering an item:*/ + background-color: #e9e9e9; +} + +.autocomplete-active { + /*when navigating through the items using the arrow keys:*/ + background-color: DodgerBlue !important; + color: #ffffff; +} + +.recent-search-title { + display: -webkit-box; + display: -moz-box; + display: -ms-flexbox; + display: -webkit-flex; + display: flex; +} + +.recent-search-title * { + -webkit-box-flex: 1 1 auto; + -moz-box-flex: 1 1 auto; + -webkit-flex: 1 1 auto; + -ms-flex: 1 1 auto; + flex: 1 1 auto; +} + + +.recent-search-title input[type="button"] { + border: none; + background: none; + cursor: pointer; + margin: 0; + padding: 0; + color: blue; + +}
\ No newline at end of file |