docs: add a "Gallery" page (#10968)

* docs: add a gallery page

* Adding image gallery

* linted

* add more screenshots

* a few more screenshots
This commit is contained in:
Maxime Beauchemin
2020-09-21 22:27:03 -07:00
committed by GitHub
parent 96a61e327e
commit 8e4a1c8356
68 changed files with 280 additions and 1095 deletions

View File

@@ -22,14 +22,13 @@ import Img from 'gatsby-image';
interface Props {
imageName?: string;
type?: string;
width?: string;
height?: string;
otherProps?: any;
}
const Image = ({
imageName, type, width, height, ...otherProps
imageName, width, height, ...otherProps
}: Props) => {
const data = useStaticQuery(graphql`
query {
@@ -82,30 +81,10 @@ const Image = ({
}
}
}
getAllImages: allImageSharp {
edges {
node {
fixed(height: 50) {
...GatsbyImageSharpFixed
originalName
}
}
}
}
}
`);
const filter = data.getAllImages.edges.filter(
(n) => n.node.fixed.originalName === imageName,
);
const imgStyle = width && height ? { width, height } : {};
return type === 'db' ? (
<Img fixed={filter[0]?.node?.fixed} style={imgStyle} imgStyle={imgStyle} />
) : (
<Img fixed={data[imageName]?.childImageSharp?.fixed} {...otherProps} />
);
return <Img fixed={data[imageName]?.childImageSharp?.fixed} {...otherProps} />;
};
export default Image;