TelegramPWA/src/components/common/pickers/PickerStyles.module.scss
2024-08-29 15:52:16 +02:00

76 lines
1.2 KiB
SCSS

@use "../../../styles/mixins";
.container {
height: 100%;
display: flex;
flex-direction: column;
overflow: hidden;
}
.header {
padding: 0.75rem 1.25rem;
border-bottom: 1px solid var(--color-borders);
display: flex;
flex-flow: row wrap;
flex-shrink: 0;
overflow-y: auto;
max-height: 20rem;
:global(.input-group) {
margin-bottom: 0;
flex-grow: 1;
}
:global(.form-control) {
height: 2rem;
border: none;
border-radius: 0;
padding: 0;
box-shadow: none !important;
}
}
.pickerCategoryTitle {
color: var(--color-text-secondary);
padding-inline: 0.5rem;
font-weight: 500;
&:not(:first-child) {
border-top: 1px solid var(--color-borders);
padding-top: 0.75rem;
margin-top: 0.375rem;
}
}
.pickerList {
flex-grow: 1;
overflow-y: auto;
overflow-x: hidden;
}
.padded {
padding: 0.5rem;
scrollbar-gutter: stable;
@include mixins.adapt-padding-to-scrollbar(0.5rem);
@media (max-width: 600px) {
padding-inline: 0;
}
}
.noResults {
height: 100%;
margin: 0;
padding: 1rem 1rem;
display: flex;
align-items: center;
justify-content: center;
color: var(--color-text-secondary);
}
.onlineStatus {
color: var(--color-primary);
}