51 lines
1.2 KiB
CSS
51 lines
1.2 KiB
CSS
:root {
|
|
--hw-option-bg-color: var(--color-ink-reversed);
|
|
--hw-active-bg-color: var(--color-selected);
|
|
--hw-border-color: var(--color-subtle-dark);
|
|
--hw-border-radius: 1em;
|
|
}
|
|
|
|
.hw-combobox {
|
|
turbo-frame {
|
|
display: inline;
|
|
}
|
|
}
|
|
|
|
.hw-combobox__input {
|
|
--hover-size: 0;
|
|
|
|
min-inline-size: 15ch;
|
|
padding: 0 calc(var(--hw-handle-offset-right) * 2) 0 0;
|
|
}
|
|
|
|
.hw-combobox__main__wrapper {
|
|
--hw-combobox-width: auto;
|
|
|
|
accent-color: var(--input-accent-color, var(--color-ink));
|
|
background-color: var(--input-background, transparent);
|
|
border-radius: var(--input-border-radius, 0.5em);
|
|
border: var(--input-border-size, 1px) solid var(--input-border-color, var(--color-subtle-dark));
|
|
color: var(--input-color, var(--color-ink));
|
|
font-size: max(16px, 1em);
|
|
line-height: inherit;
|
|
padding: var(--input-padding, 0.2em 0.6em);
|
|
}
|
|
|
|
.combox-popup {
|
|
--panel-border-color: var(--bubble-color);
|
|
--panel-border-radius: 2em;
|
|
--panel-border-size: 2px;
|
|
--panel-padding: 0.4em 1em;
|
|
--panel-size: auto;
|
|
|
|
inline-size: auto !important;
|
|
inset: -2px auto auto 0;
|
|
max-inline-size: var(--panel-size) !important;
|
|
position: absolute;
|
|
z-index: 2;
|
|
|
|
&[open] {
|
|
display: flex;
|
|
}
|
|
}
|