forked from
pds.ls/pdsls
atmosphere explorer
replace isTouchDevice with canHover
+14
-16
+2
-2
src/components/hover-card/base.tsx
+2
-2
src/components/hover-card/base.tsx
···
1
1
import { A } from "@solidjs/router";
2
2
import { createSignal, JSX, onCleanup, Show } from "solid-js";
3
3
import { Portal } from "solid-js/web";
4
-
import { isTouchDevice } from "../../layout";
4
+
import { canHover } from "../../layout";
5
5
6
6
interface HoverCardProps {
7
7
/** Link href - if provided, renders an A tag */
···
112
112
{props.label}
113
113
</A>
114
114
)}
115
-
<Show when={show() && !isTouchDevice}>
115
+
<Show when={show() && canHover}>
116
116
<Portal>
117
117
<div
118
118
ref={setupResizeObserver}
+2
-2
src/components/search.tsx
+2
-2
src/components/search.tsx
···
10
10
onMount,
11
11
Show,
12
12
} from "solid-js";
13
-
import { isTouchDevice } from "../layout";
13
+
import { canHover } from "../layout";
14
14
import { resolveLexiconAuthority, resolveLexiconAuthorityDirect } from "../utils/api";
15
15
import { appHandleLink, appList, AppUrl } from "../utils/app-urls";
16
16
import { createDebouncedValue } from "../utils/hooks/debounced";
···
99
99
<Button onClick={() => setShowSearch(!showSearch())}>
100
100
<span class="iconify lucide--search"></span>
101
101
<span>Search</span>
102
-
<Show when={!isTouchDevice}>
102
+
<Show when={canHover}>
103
103
<kbd class="font-sans text-neutral-400 dark:text-neutral-500">
104
104
{/Mac/i.test(navigator.platform) ? "⌘" : "⌃"}K
105
105
</kbd>
+2
-2
src/components/tooltip.tsx
+2
-2
src/components/tooltip.tsx
···
1
1
import { JSX, Show } from "solid-js";
2
-
import { isTouchDevice } from "../layout";
2
+
import { canHover } from "../layout";
3
3
4
4
const Tooltip = (props: { text: string; children: JSX.Element }) => (
5
5
<span class="group/tooltip relative inline-flex items-center">
6
6
{props.children}
7
-
<Show when={!isTouchDevice}>
7
+
<Show when={canHover}>
8
8
<span
9
9
style={`transform: translate(-50%, 28px)`}
10
10
class={`dark:shadow-dark-700 dark:bg-dark-300 pointer-events-none absolute left-[50%] z-20 hidden min-w-fit rounded border-[0.5px] border-neutral-300 bg-white p-1 text-center font-sans text-xs font-normal whitespace-nowrap text-neutral-900 shadow-md select-none group-hover/tooltip:inline first-letter:capitalize dark:border-neutral-600 dark:text-neutral-200`}
+1
-1
src/layout.tsx
+1
-1
src/layout.tsx
···
14
14
import { resolveHandle } from "./utils/api.js";
15
15
import { plcDirectory } from "./views/settings.jsx";
16
16
17
-
export const isTouchDevice = "ontouchstart" in window || navigator.maxTouchPoints > 1;
17
+
export const canHover = window.matchMedia("(hover: hover) and (pointer: fine)").matches;
18
18
19
19
const headers: Record<string, string> = {
20
20
"did:plc:ia76kvnndjutgedggx2ibrem": "bunny.jpg",
+3
-5
src/views/repo.tsx
+3
-5
src/views/repo.tsx
···
29
29
removeNotification,
30
30
updateNotification,
31
31
} from "../components/notification.jsx";
32
-
import { isTouchDevice } from "../layout.jsx";
32
+
import { canHover } from "../layout.jsx";
33
33
import {
34
34
didDocCache,
35
35
type HandleResolveResult,
···
419
419
</ErrorBoundary>
420
420
</Show>
421
421
<Show when={nsids() && (!location.hash || location.hash.startsWith("#collections"))}>
422
-
<div
423
-
class={`flex flex-col ${isTouchDevice ? "pb-12" : "pb-16"} text-sm wrap-anywhere`}
424
-
>
422
+
<div class={`flex flex-col ${canHover ? "pb-16" : "pb-12"} text-sm wrap-anywhere`}>
425
423
<Show
426
424
when={Object.keys(nsids() ?? {}).length != 0}
427
425
fallback={<span class="mt-3 text-center text-base">No collections found.</span>}
···
745
743
</Show>
746
744
747
745
<Show when={nsids() && (!location.hash || location.hash.startsWith("#collections"))}>
748
-
<div class={`fixed ${isTouchDevice ? "bottom-8" : "bottom-12"} z-10 w-full max-w-lg`}>
746
+
<div class={`fixed ${canHover ? "bottom-12" : "bottom-8"} z-10 w-full max-w-lg`}>
749
747
<div
750
748
class="dark:bg-dark-200 dark:shadow-dark-700 mx-3 flex cursor-text items-center gap-2 rounded-lg border border-neutral-200 bg-white px-3 shadow-sm dark:border-neutral-700"
751
749
onClick={(e) => {