moodist/src/components/modals/presets/new/new.module.css

72 lines
1.4 KiB
CSS

.new {
margin-top: 16px;
& .title {
font-weight: 500;
color: var(--color-foreground-subtle);
}
& .form {
display: flex;
align-items: center;
width: 100%;
height: 45px;
padding: 4px;
margin-top: 8px;
background-color: var(--color-neutral-50);
border: 1px solid var(--color-neutral-200);
border-radius: 8px;
&.disabled {
filter: blur(2px);
opacity: 0.4;
}
& input {
flex-grow: 1;
min-width: 0;
height: 100%;
padding: 0 12px;
color: var(--color-foreground);
background: transparent;
border: none;
outline: none;
&:focus-visible {
outline: 2px solid var(--color-neutral-400);
outline-offset: 2px;
}
}
& button {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
padding: 0 12px;
font-size: var(--font-sm);
font-weight: 500;
color: var(--color-neutral-50);
cursor: pointer;
background-color: var(--color-neutral-950);
border: none;
border-radius: 4px;
outline: none;
&:focus-visible {
outline: 2px solid var(--color-neutral-400);
outline-offset: 2px;
}
&:disabled {
cursor: not-allowed;
}
}
}
& .noSelected {
margin-top: 8px;
font-size: var(--font-sm);
color: var(--color-foreground-subtle);
}
}