Sha256: b5948a129961bb351d76cb3e05bcde9e81ae93c09f44b9d2f188e71164bfe34f
Contents?: true
Size: 1.99 KB
Versions: 67
Compression:
Stored size: 1.99 KB
Contents
@import "../tokens/colors";
@import "../tokens/border_radius";
@import "../tokens/spacing";
@import "../tokens/shadows";
[class^=pb_typeahead_kit] {
.pb_typeahead_wrapper {
position: relative;
.pb_typeahead_loading_indicator {
position: absolute;
width: min-content;
bottom: 0.6em;
right: 1em;
opacity: 0;
color: $text_lt_light;
transition: opacity .15s ease-in-out;
}
}
[class^=pb_text_input_kit] {
.text_input_wrapper {
& > input:first-child {
padding-right: $space_xl;
}
}
}
.pb_item_kit {
padding: ($space_xs + 2) 0;
@media (hover:hover) {
&:hover {
background-color: $bg_light;
}
}
}
[class^=pb_list_kit] {
max-height: 18em;
overflow-y: auto;
overscroll-behavior: contain;
position: absolute;
left: 0;
right: 0;
background: white;
box-shadow: $shadow_deep;
z-index: 100;
border-radius: $border_rad_heavier;
transition: opacity .25s ease-in-out;
}
&:focus-within [class^=pb_list_kit] {
display: block;
opacity: 1;
}
&:not(:focus-within) [class^=pb_list_kit] {
display: none;
opacity: 0;
}
[class^=pb_list_kit] {
margin-top: -$space-sm;
li {
transition: background-color .25s ease-in-out;
}
& > [data-pb-typeahead-kit-results] > li {
&:focus-within {
background-color: $active_light;
}
> button {
background: none;
color: $text_lt_default;
border: none;
padding: 0;
font: inherit;
cursor: pointer;
outline: inherit;
width: 100%;
height: 100%;
text-align: left;
}
}
}
.dark {
.pb_typeahead_wrapper .pb_typeahead_loading_indicator {
color: $text_dk_light;
}
}
&.react-select {
.text_input {
display: inherit;
padding: 3px 4px;
&_indicators {
max-width: 70px;
}
&_value_container {
flex-grow: 1;
}
}
}
}
Version data entries
67 entries across 67 versions & 1 rubygems