diff --git a/src/timelines/Home.tsx b/src/timelines/Home.tsx index b463d96..0ba7202 100644 --- a/src/timelines/Home.tsx +++ b/src/timelines/Home.tsx @@ -168,6 +168,8 @@ const Home: ParentComponent = (props) => { padding: 0 16px; scroll-snap-align: center; overscroll-behavior-block: none; + contain: strict; + contain-intrinsic-size: 100% 100%; @media (max-width: 600px) { padding: 0; @@ -186,6 +188,10 @@ const Home: ParentComponent = (props) => { padding-left: var(--safe-area-inset-left, 0); padding-right: var(--safe-area-inset-right, 0); + & > * { + content-visibility: auto; + } + @media (max-width: 600px) { grid-auto-columns: 100%; } diff --git a/src/timelines/TootList.tsx b/src/timelines/TootList.tsx index 4100236..9efea10 100644 --- a/src/timelines/TootList.tsx +++ b/src/timelines/TootList.tsx @@ -5,18 +5,15 @@ import { ErrorBoundary, type Ref, createSelector, - createRenderEffect, } from "solid-js"; import { type mastodon } from "masto"; import { vibrate } from "../platform/hardware"; import Thread from "./Thread.jsx"; import { useDefaultSession } from "../masto/clients"; -import { useHeroSignal, useHeroSource } from "../platform/anim"; +import { useHeroSource } from "../platform/anim"; import { HERO as BOTTOM_SHEET_HERO } from "../material/BottomSheet"; import { setCache as setTootBottomSheetCache } from "./TootBottomSheet"; import { useNavigate } from "@solidjs/router"; -import { createElementSize } from "@solid-primitives/resize-observer"; -import "./toot-list.css" const TootList: Component<{ ref?: Ref; @@ -113,22 +110,13 @@ const TootList: Component<{ openFullScreenToot(status, element, true); }; - const listenElementHeight = ( - e: HTMLElement, - updateHeight: (height: number) => void, - ) => { - const size = createElementSize(e); - - createRenderEffect(() => updateHeight(size.height)); - }; - return ( { return

Oops: {String(err)}

; }} > -
+
{(itemId, index) => { const path = props.onUnknownThread(itemId)!; diff --git a/src/timelines/toot-list.css b/src/timelines/toot-list.css deleted file mode 100644 index be1dfd6..0000000 --- a/src/timelines/toot-list.css +++ /dev/null @@ -1,3 +0,0 @@ -.toot-list * { - content-visibility: auto; -} diff --git a/src/timelines/toot.module.css b/src/timelines/toot.module.css index e9caeaf..0985c4b 100644 --- a/src/timelines/toot.module.css +++ b/src/timelines/toot.module.css @@ -243,6 +243,7 @@ border: 1px solid var(--tutu-color-surface-d); transition: outline-width 60ms var(--tutu-anim-curve-std), border-color 60ms var(--tutu-anim-curve-std); contain: strict; + content-visibility: auto; &:hover, &:focus-visible {