Lidarr/frontend/src/Components/Form/TagInput.css

98 lines
1.5 KiB
CSS

.container {
composes: input from 'Components/Form/Input.css';
display: flex;
flex-wrap: wrap;
min-height: 35px;
height: auto;
}
.containerFocused {
outline: 0;
border-color: $inputFocusBorderColor;
box-shadow: inset 0 1px 1px $inputBoxShadowColor, 0 0 8px $inputFocusBoxShadowColor;
}
.selectedTagContainer {
flex: 0 0 auto;
}
.selectedTag {
composes: label from 'Components/Label.css';
border-style: none;
font-size: 13px;
}
/* Selected Tag Kinds */
.info {
composes: info from 'Components/Label.css';
}
.success {
composes: success from 'Components/Label.css';
}
.warning {
composes: warning from 'Components/Label.css';
}
.danger {
composes: danger from 'Components/Label.css';
}
.searchInputContainer {
position: relative;
flex: 1 0 100px;
margin-top: 1px;
padding-left: 5px;
}
.searchInput {
max-width: 100%;
font-size: 13px;
input {
margin: 0;
padding: 0;
max-width: 100%;
outline: none;
border: 0;
}
}
.suggestions {
position: absolute;
z-index: 1;
overflow-y: auto;
max-height: 200px;
width: 100%;
border: 1px solid $inputBorderColor;
border-radius: 4px;
background-color: $white;
box-shadow: inset 0 1px 1px $inputBoxShadowColor;
ul {
margin: 5px 0;
padding-left: 0;
list-style-type: none;
}
li {
padding: 0 16px;
}
li mark {
font-weight: bold;
}
li:hover {
background-color: $menuItemHoverColor;
}
}
.suggestionActive {
background-color: $menuItemHoverColor;
}