mirror of
https://github.com/explosion/spaCy.git
synced 2024-11-10 19:57:17 +03:00
Fix images
This commit is contained in:
Marcus Blättermann
parent
fc8c1f33bc
commit
62b9c9c6d7
|
|
@ -122,10 +122,11 @@ export const getStaticProps: GetStaticProps<PropsPage, ParsedUrlQuery> = async (
|
|||
|
||||
const next =
|
||||
section === 'usage'
|
||||
? sidebarUsageFlat.find(
|
||||
(item, index) =>
|
||||
index > 0 && sidebarUsageFlat[index - 1].url === slug && item[0] === '/'
|
||||
)
|
||||
? sidebarUsageFlat.find((item, index) => {
|
||||
return (
|
||||
index > 0 && sidebarUsageFlat[index - 1].url === slug && item.url[0] === '/'
|
||||
)
|
||||
})
|
||||
: undefined
|
||||
|
||||
return {
|
||||
|
|
|
|||
|
|
@ -29,6 +29,7 @@ import tailoredPipelinesImage from '../public/images/spacy-tailored-pipelines_wi
|
|||
import { nightly, legacy } from '../meta/dynamicMeta.mjs'
|
||||
|
||||
import Benchmarks from '../docs/usage/_benchmarks-models.mdx'
|
||||
import { ImageFill } from '../src/components/embed'
|
||||
|
||||
function getCodeExample(nightly) {
|
||||
return `# pip install -U ${nightly ? 'spacy-nightly --pre' : 'spacy'}
|
||||
|
|
@ -113,7 +114,10 @@ const Landing = () => {
|
|||
>
|
||||
<p>
|
||||
<Link to="https://explosion.ai/custom-solutions" hidden>
|
||||
<img src={tailoredPipelinesImage.src} alt="spaCy Tailored Pipelines" />
|
||||
<ImageFill
|
||||
image={tailoredPipelinesImage}
|
||||
alt="spaCy Tailored Pipelines"
|
||||
/>
|
||||
</Link>
|
||||
</p>
|
||||
<p>
|
||||
|
|
@ -159,9 +163,8 @@ const Landing = () => {
|
|||
>
|
||||
<p>
|
||||
<Link to="https://prodi.gy" hidden>
|
||||
{/** Update image */}
|
||||
<img
|
||||
src={prodigyImage.src}
|
||||
<ImageFill
|
||||
image={prodigyImage}
|
||||
alt="Prodigy: Radically efficient machine teaching"
|
||||
/>
|
||||
</Link>
|
||||
|
|
@ -203,7 +206,7 @@ const Landing = () => {
|
|||
<LandingGrid cols={2}>
|
||||
<LandingCol>
|
||||
<Link to="/usage/projects" hidden>
|
||||
<img src={projectsImage.src} />
|
||||
<ImageFill image={projectsImage} />
|
||||
</Link>
|
||||
<br />
|
||||
<br />
|
||||
|
|
@ -259,8 +262,8 @@ const Landing = () => {
|
|||
>
|
||||
<p>
|
||||
<Link to="https://course.spacy.io" hidden>
|
||||
<img
|
||||
src={courseImage.src}
|
||||
<ImageFill
|
||||
image={courseImage}
|
||||
alt="Advanced NLP with spaCy: A free online course"
|
||||
/>
|
||||
</Link>
|
||||
|
|
|
|||
|
|
@ -18,6 +18,7 @@ export default function Card({ title, to, image, header, small, onClick, childre
|
|||
<H5 className={classes.title}>
|
||||
{image && (
|
||||
<div className={classes.image}>
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
<img src={image} width={35} alt="" />
|
||||
</div>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import React, { Fragment } from 'react'
|
||||
import PropTypes from 'prop-types'
|
||||
import classNames from 'classnames'
|
||||
import ImageNext from 'next/image'
|
||||
|
||||
import Link from './link'
|
||||
import Button from './button'
|
||||
|
|
@ -88,6 +89,7 @@ const Image = ({ src, alt, title, href, ...props }) => {
|
|||
return (
|
||||
<figure className="gatsby-resp-image-figure">
|
||||
<Link className={linkClassNames} href={href ?? src} hidden forceExternal>
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
<img className={classes.image} src={src} alt={alt} width={650} height="auto" />
|
||||
</Link>
|
||||
{title && (
|
||||
|
|
@ -99,6 +101,17 @@ const Image = ({ src, alt, title, href, ...props }) => {
|
|||
)
|
||||
}
|
||||
|
||||
const ImageFill = ({ image, ...props }) => {
|
||||
return (
|
||||
<span
|
||||
class={classes['figure-fill']}
|
||||
style={{ paddingBottom: `${(image.height / image.width) * 100}%` }}
|
||||
>
|
||||
<ImageNext src={image.src} {...props} fill />
|
||||
</span>
|
||||
)
|
||||
}
|
||||
|
||||
const GoogleSheet = ({ id, link, height, button = 'View full table' }) => {
|
||||
return (
|
||||
<figure className={classes.root}>
|
||||
|
|
@ -118,4 +131,4 @@ const GoogleSheet = ({ id, link, height, button = 'View full table' }) => {
|
|||
)
|
||||
}
|
||||
|
||||
export { YouTube, SoundCloud, Iframe, Image, GoogleSheet }
|
||||
export { YouTube, SoundCloud, Iframe, Image, ImageFill, GoogleSheet }
|
||||
|
|
|
|||
|
|
@ -10,6 +10,7 @@ import { H1, Label, InlineList, Help } from './typography'
|
|||
import Icon from './icon'
|
||||
|
||||
import classes from '../styles/title.module.sass'
|
||||
import Image from 'next/image'
|
||||
|
||||
const MetaItem = ({ label, url, children, help }) => (
|
||||
<span>
|
||||
|
|
@ -50,6 +51,7 @@ export default function Title({
|
|||
|
||||
{image && (
|
||||
<div className={classes.image}>
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
<img src={image} width={100} height={100} alt="" />
|
||||
</div>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -32,6 +32,13 @@
|
|||
max-width: 100%
|
||||
margin: 0 auto
|
||||
|
||||
.figure-fill
|
||||
display: block
|
||||
position: relative
|
||||
width: 100%
|
||||
img
|
||||
object-fit: contain
|
||||
|
||||
.image-link
|
||||
display: block
|
||||
|
||||
|
|
|
|||
|
|
@ -20,6 +20,7 @@ import { github, MarkdownToReact } from '../components/util'
|
|||
|
||||
import { nightly, legacy } from '../../meta/dynamicMeta.mjs'
|
||||
import universe from '../../meta/universe.json'
|
||||
import Image from 'next/image'
|
||||
|
||||
function filterResources(resources, data) {
|
||||
const sorted = resources.sort((a, b) => a.id.localeCompare(b.id))
|
||||
|
|
@ -80,6 +81,7 @@ const UniverseContent = ({ content = [], categories, theme, pageContext, mdxComp
|
|||
}
|
||||
const url = `/universe/project/${id}`
|
||||
const header = youtube && (
|
||||
// eslint-disable-next-line @next/next/no-img-element
|
||||
<img
|
||||
src={`https://img.youtube.com/vi/${youtube}/0.jpg`}
|
||||
alt=""
|
||||
|
|
@ -92,6 +94,7 @@ const UniverseContent = ({ content = [], categories, theme, pageContext, mdxComp
|
|||
return cover ? (
|
||||
<p key={id}>
|
||||
<Link key={id} to={url} hidden>
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
<img src={cover} alt={title || id} />
|
||||
</Link>
|
||||
</p>
|
||||
|
|
@ -205,6 +208,7 @@ const Project = ({ data, components }) => (
|
|||
`license/${data.github}.svg?style=flat-square`,
|
||||
`stars/${data.github}.svg?style=social&label=Stars`,
|
||||
].map((url, i) => (
|
||||
// eslint-disable-next-line @next/next/no-img-element
|
||||
<img
|
||||
style={{
|
||||
borderRadius: '1em',
|
||||
|
|
@ -236,6 +240,7 @@ const Project = ({ data, components }) => (
|
|||
|
||||
{data.cover && (
|
||||
<p>
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
<img src={data.cover} alt={data.title} width={250} style={{ maxWidth: '50%' }} />
|
||||
</p>
|
||||
)}
|
||||
|
|
@ -266,6 +271,7 @@ const Project = ({ data, components }) => (
|
|||
|
||||
{data.image && (
|
||||
<p>
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
<img src={data.image} style={{ maxWidth: '100%' }} alt="" />
|
||||
</p>
|
||||
)}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user