Thomas
9c441571bc
* fix: improve mobile header and board menus * fix: keep mobile header logo condensed * refactor: share mobile breakpoint handling
67 lines
1.3 KiB
CSS
67 lines
1.3 KiB
CSS
.modalContent {
|
|
overflow: hidden;
|
|
border: rem(1px) solid color-mix(in srgb, var(--mantine-color-default-border) 70%, transparent);
|
|
border-radius: rem(24px);
|
|
background: color-mix(in srgb, var(--mantine-color-body) 58%, transparent);
|
|
box-shadow: 0 rem(18px) rem(56px) rgb(0 0 0 / 22%);
|
|
backdrop-filter: blur(rem(20px)) saturate(140%);
|
|
}
|
|
|
|
.modalBody {
|
|
padding: var(--mantine-spacing-sm);
|
|
}
|
|
|
|
.content {
|
|
outline: none;
|
|
}
|
|
|
|
.results {
|
|
min-height: 0;
|
|
}
|
|
|
|
.searchInput {
|
|
border-color: color-mix(in srgb, var(--mantine-color-default-border) 72%, transparent);
|
|
background: color-mix(in srgb, var(--mantine-color-body) 54%, transparent);
|
|
backdrop-filter: blur(rem(8px));
|
|
}
|
|
|
|
.option {
|
|
min-width: 0;
|
|
border-radius: var(--mantine-radius-md);
|
|
outline: none;
|
|
}
|
|
|
|
.card {
|
|
height: 100%;
|
|
overflow: hidden;
|
|
box-shadow: var(--mantine-shadow-sm);
|
|
}
|
|
|
|
.metadataBadge {
|
|
width: rem(22px);
|
|
padding-inline: 0;
|
|
}
|
|
|
|
.option:hover .card,
|
|
.option:focus-visible .card,
|
|
.option[data-active="true"] .card {
|
|
border-color: var(--mantine-primary-color-filled);
|
|
box-shadow: var(--mantine-shadow-md);
|
|
}
|
|
|
|
@media (max-width: $mantine-breakpoint-sm) {
|
|
.modalContent {
|
|
height: calc(100dvh - var(--modal-y-offset) * 2);
|
|
}
|
|
|
|
.modalBody,
|
|
.content {
|
|
min-height: 0;
|
|
height: 100%;
|
|
}
|
|
|
|
.results {
|
|
flex: 1;
|
|
}
|
|
}
|