add G shortcut to jump to gallery

This commit is contained in:
Chuck Dries 2021-06-20 19:54:52 -07:00
parent 4e7fd5cc9d
commit b02a548b17
2 changed files with 8 additions and 4 deletions

View File

@ -32,6 +32,9 @@ const GalleryImage = ({ data, pageContext }) => {
} }
return; return;
} }
case 'KeyG': {
navigate('/photogallery/');
}
} }
}; };
document.addEventListener('keydown', keyListener); document.addEventListener('keydown', keyListener);
@ -74,15 +77,15 @@ const GalleryImage = ({ data, pageContext }) => {
<Link <Link
className="hover:underline text-vibrant-light hover:text-muted-light mx-1" className="hover:underline text-vibrant-light hover:text-muted-light mx-1"
to="/photogallery/" to="/photogallery/"
>gallery</Link> >gallery <span className="bg-gray-300 text-black">g</span></Link>
{pageContext.prevImage && <Link {pageContext.prevImage && <Link
className="hover:underline text-vibrant-light hover:text-muted-light mx-1" className="hover:underline text-vibrant-light hover:text-muted-light mx-1"
to={`/photogallery/${pageContext.prevImage}/`} to={`/photogallery/${pageContext.prevImage}/`}
>previous</Link>} >previous <span className="bg-gray-300 text-black">&#11104;</span></Link>}
{pageContext.nextImage && <Link {pageContext.nextImage && <Link
className="hover:underline text-vibrant-light hover:text-muted-light mx-1" className="hover:underline text-vibrant-light hover:text-muted-light mx-1"
to={`/photogallery/${pageContext.nextImage}/`} to={`/photogallery/${pageContext.nextImage}/`}
>next</Link>} >next <span className="bg-gray-300 text-black">&#11106;</span></Link>}
</nav> </nav>
<div className={classnames('flex', orientationClasses)}> <div className={classnames('flex', orientationClasses)}>
<div className="flex-grow-0"> <div className="flex-grow-0">

View File

@ -92,7 +92,8 @@ const IndexPage = ({ data: { allFile: { edges } } }) => {
</Helmet> </Helmet>
{/* WIP: ipad portrait hits md breakpoint, looks bad */} {/* WIP: ipad portrait hits md breakpoint, looks bad */}
<main <main
className={classnames('font-serif hero', ar > 1 ? 'landscape:grid portrait:flex portrait:flex-col' : 'portrait:grid landscape:flex landscape:flex-row-reverse')} className={classnames('font-serif hero', ar > 1
? 'landscape:grid portrait:flex portrait:flex-col' : 'portrait:grid landscape:flex landscape:flex-row-reverse')}
> >
{isClient ? {isClient ?
<GatsbyImage <GatsbyImage