Skip to content

Instantly share code, notes, and snippets.

@3200pro
Last active July 19, 2020 20:58
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save 3200pro/9af6d603d828d88cc81b8616ee31f7a8 to your computer and use it in GitHub Desktop.
Save 3200pro/9af6d603d828d88cc81b8616ee31f7a8 to your computer and use it in GitHub Desktop.
Gatsby +Sanity: Darkmode image that allow alternate image (Sanity Schema Code)
/** @jsx jsx */
import { jsx, useColorMode } from "theme-ui"
import { buildImageObj } from '../../lib/helpers'
import { imageUrlFor } from '../../lib/image-url'
function DarkModeImage (props) {
const [colorMode] = useColorMode()
const SanityImageToggle = (colorMode == 'light') ? props.primaryImage : props.darkmodeImage
return (
<figure>
<img src={imageUrlFor(buildImageObj(SanityImageToggle)).url()} alt={props.alt}/>
</figure>
)
}
export default DarkModeImage
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment