Skip to content

N
nexpie-grafana-theme
Commit 4f7791b9 by Marcus Efraimsson
Options

fix dropdown typeahead issue 

New explore feature overriding css for dropdown typeahead component.
parent c5419ba8
Showing with 48 additions and 46 deletions
public/sass/pages/_explore.scss
...@@ -42,55 +42,57 @@ ...@@ -42,55 +42,57 @@
transition: all 0.3s; transition: all 0.3s;
} }
.typeahead { .explore {
position: absolute; .typeahead {
z-index: auto; position: absolute;
top: -10000px; z-index: auto;
left: -10000px; top: -10000px;
opacity: 0; left: -10000px;
border-radius: 4px; opacity: 0;
transition: opacity 0.75s; border-radius: 4px;
border: 1px solid #e4e4e4; transition: opacity 0.75s;
max-height: calc(66vh); border: 1px solid #e4e4e4;
overflow-y: scroll; max-height: calc(66vh);
max-width: calc(66%); overflow-y: scroll;
overflow-x: hidden; max-width: calc(66%);
outline: none; overflow-x: hidden;
list-style: none; outline: none;
background: #fff; list-style: none;
color: rgba(0, 0, 0, 0.65); background: #fff;
transition: opacity 0.4s ease-out; color: rgba(0, 0, 0, 0.65);
} transition: opacity 0.4s ease-out;
}
.typeahead-group__title { .typeahead-group__title {
color: rgba(0, 0, 0, 0.43); color: rgba(0, 0, 0, 0.43);
font-size: 12px; font-size: 12px;
line-height: 1.5; line-height: 1.5;
padding: 8px 16px; padding: 8px 16px;
} }
.typeahead-item { .typeahead-item {
line-height: 200%; line-height: 200%;
height: auto; height: auto;
font-family: Consolas, Menlo, Courier, monospace; font-family: Consolas, Menlo, Courier, monospace;
padding: 0 16px 0 28px; padding: 0 16px 0 28px;
font-size: 12px; font-size: 12px;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
margin-left: -1px; margin-left: -1px;
left: 1px; left: 1px;
position: relative; position: relative;
z-index: 1; z-index: 1;
display: block; display: block;
white-space: nowrap; white-space: nowrap;
cursor: pointer; cursor: pointer;
transition: color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), border-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), transition: color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), border-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.15s cubic-bezier(0.645, 0.045, 0.355, 1); background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
} }
.typeahead-item__selected { .typeahead-item__selected {
background-color: #ecf6fd; background-color: #ecf6fd;
color: #108ee9; color: #108ee9;
}
} }
/* SYNTAX */ /* SYNTAX */
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment