diff --git a/src/app.css b/src/app.css index 0340a567..1eed3ff1 100644 --- a/src/app.css +++ b/src/app.css @@ -881,6 +881,9 @@ button.carousel-dot:is(.active, [disabled].active) { .media-post-link .button-label { display: none; } +body:has(.status-deck) .media-post-link { + display: none; +} @media (min-width: calc(40em + 350px)) { .media-post-link .button-label { diff --git a/src/components/media-modal.jsx b/src/components/media-modal.jsx index ab39fae0..4adb542b 100644 --- a/src/components/media-modal.jsx +++ b/src/components/media-modal.jsx @@ -1,7 +1,6 @@ import { getBlurHashAverageColor } from 'fast-blurhash'; import { useEffect, useLayoutEffect, useRef, useState } from 'preact/hooks'; import { useHotkeys } from 'react-hotkeys-hook'; -import { useMatch } from 'react-router-dom'; import Icon from './icon'; import Link from './link'; @@ -16,10 +15,6 @@ function MediaModal({ onClose = () => {}, }) { const carouselRef = useRef(null); - // NOTE: Optional path segment doesn't work yet - // https://github.com/remix-run/react-router/issues/10039 - // const isStatusLocation = useMatch('/:instance?/s/:id'); - const isStatusLocation = useMatch('/:instance/s/:id') || useMatch('/s/:id'); const [currentIndex, setCurrentIndex] = useState(index); const carouselFocusItem = useRef(null); @@ -169,22 +164,20 @@ function MediaModal({ )} - {!isStatusLocation && ( - { - // if small screen (not media query min-width 40em + 350px), run onClose - if ( - !window.matchMedia('(min-width: calc(40em + 350px))').matches - ) { - onClose(); - } - }} - > - See post » - - )}{' '} + { + // if small screen (not media query min-width 40em + 350px), run onClose + if ( + !window.matchMedia('(min-width: calc(40em + 350px))').matches + ) { + onClose(); + } + }} + > + See post » + {' '}