fix(ui): improve theme selector dismissal behavior on mobile
This commit is contained in:
@@ -9,3 +9,10 @@
|
|||||||
@apply min-h-[100dvh] w-full overflow-hidden bg-base-100 text-base-content overscroll-y-none;
|
@apply min-h-[100dvh] w-full overflow-hidden bg-base-100 text-base-content overscroll-y-none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Fix for iOS click/blur events */
|
||||||
|
@media (hover: none) {
|
||||||
|
body {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -2388,13 +2388,19 @@
|
|||||||
}
|
}
|
||||||
@layer base {
|
@layer base {
|
||||||
html, body {
|
html, body {
|
||||||
height: 100%;
|
min-height: 100dvh;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
overscroll-behavior-y: none;
|
||||||
background-color: var(--color-base-100);
|
background-color: var(--color-base-100);
|
||||||
color: var(--color-base-content);
|
color: var(--color-base-content);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media (hover: none) {
|
||||||
|
body {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
@layer base {
|
@layer base {
|
||||||
:where(:root),:root:has(input.theme-controller[value=light]:checked),[data-theme=light] {
|
:where(:root),:root:has(input.theme-controller[value=light]:checked),[data-theme=light] {
|
||||||
color-scheme: light;
|
color-scheme: light;
|
||||||
|
|||||||
@@ -52,6 +52,11 @@ pub fn StatusBar() -> impl IntoView {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Close the dropdown by blurring the active element
|
||||||
|
if let Some(active) = doc.active_element() {
|
||||||
|
let _ = active.blur();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
{theme}
|
{theme}
|
||||||
|
|||||||
Reference in New Issue
Block a user