Fix pattern image

website/src/components/landing.js

@@ -24,8 +24,8 @@ function getPattern(nightly, legacy) {
 
 export const LandingHeader = ({ nightly, legacy, style = {}, children }) => {
     const { pattern, overlay } = getPattern(nightly, legacy)
-    const wrapperStyle = { backgroundImage: `url(${pattern})` }
-    const contentStyle = { backgroundImage: `url(${overlay})`, ...style }
+    const wrapperStyle = { backgroundImage: `url(${pattern.src})` }
+    const contentStyle = { backgroundImage: `url(${overlay.src})`, ...style }
     return (
         <header className={classes['header']}>
             <div className={classes['header-wrapper']} style={wrapperStyle}>

website/src/components/main.js

@@ -39,7 +39,7 @@ export default function Main({
         <main className={mainClassNames}>
             {wrapContent ? <Content Component="article">{children}</Content> : children}
             {asides && (
-                <div className={classes.asides} style={{ backgroundImage: `url(${pattern}` }} />
+                <div className={classes.asides} style={{ backgroundImage: `url(${pattern.src}` }} />
             )}
             {footer}
         </main>

website/src/components/seo.js

@@ -8,7 +8,6 @@ import socialImageUniverse from '../images/social_universe.jpg'
 import socialImageNightly from '../images/social_nightly.jpg'
 import socialImageLegacy from '../images/social_legacy.jpg'
 import siteMetadata from '../../meta/site.json'
-import { siteUrl } from '../../meta/dynamicMeta'
 
 function getPageTitle(title, sitename, slogan, sectionTitle, nightly, legacy) {
     if (sectionTitle && title) {
@@ -48,7 +47,7 @@ export default function SEO({
         nightly,
         legacy
     )
-    const socialImage = siteUrl + getImage(section, nightly, legacy)
+    const socialImage = getImage(section, nightly, legacy).src
     const meta = [
         {
             name: 'description',

website/src/widgets/landing.js

@@ -60,7 +60,7 @@ for entity in doc.ents:
 const Landing = () => {
     const codeExample = getCodeExample(nightly)
     return (
-        <>
+        <Layout>
             <LandingHeader nightly={nightly} legacy={legacy}>
                 <LandingTitle>
                     Industrial-Strength
@@ -112,7 +112,7 @@ const Landing = () => {
                     small
                 >
                     <Link to="https://explosion.ai/custom-solutions" hidden>
-                        <img src={tailoredPipelinesImage} alt="spaCy Tailored Pipelines" />
+                        <img src={tailoredPipelinesImage.src} alt="spaCy Tailored Pipelines" />
                     </Link>
                     <strong>
                         Get a custom spaCy pipeline, tailor-made for your NLP problem by
@@ -158,7 +158,7 @@ const Landing = () => {
                     <Link to="https://prodi.gy" hidden>
                         {/** Update image */}
                         <img
-                            src={prodigyImage}
+                            src={prodigyImage.src}
                             alt="Prodigy: Radically efficient machine teaching"
                         />
                     </Link>
@@ -199,7 +199,7 @@ const Landing = () => {
             <LandingGrid cols={2}>
                 <LandingCol>
                     <Link to="/usage/projects" hidden>
-                        <img src={projectsImage} />
+                        <img src={projectsImage.src} />
                     </Link>
                     <br />
                     <br />
@@ -253,7 +253,7 @@ const Landing = () => {
                 >
                     <Link to="https://course.spacy.io" hidden>
                         <img
-                            src={courseImage}
+                            src={courseImage.src}
                             alt="Advanced NLP with spaCy: A free online course"
                         />
                     </Link>
@@ -285,7 +285,7 @@ const Landing = () => {
                     <Benchmarks />
                 </LandingCol>
             </LandingGrid>
-        </>
+        </Layout>
     )
 }
 

website/src/widgets/styleguide.js

@@ -64,7 +64,7 @@ export const Colors = () => (
 export const Patterns = () => {
     const imgStyle = (name) => ({
         height: 125,
-        background: `url(${patterns[name]}) center/150% repeat`,
+        background: `url(${patterns[name].src}) center/150% repeat`,
     })
     const textStyle = { fontSize: 'var(--font-size-xs)', color: 'var(--color-subtle-dark)' }
     const linkStyle = { color: 'var(--color-dark)' }