mirror of
https://github.com/kremalicious/portfolio.git
synced 2024-12-23 01:29:41 +01:00
project description fix
This commit is contained in:
parent
ddc41c8466
commit
fe700dcf5c
@ -1,4 +1,4 @@
|
|||||||
import React, { Component } from 'react'
|
import React from 'react'
|
||||||
import PropTypes from 'prop-types'
|
import PropTypes from 'prop-types'
|
||||||
import Helmet from 'react-helmet'
|
import Helmet from 'react-helmet'
|
||||||
import ReactMarkdown from 'react-markdown'
|
import ReactMarkdown from 'react-markdown'
|
||||||
@ -14,66 +14,52 @@ import SEO from '../components/atoms/SEO'
|
|||||||
|
|
||||||
import styles from './Project.module.scss'
|
import styles from './Project.module.scss'
|
||||||
|
|
||||||
const ProjectMeta = props => {
|
const ProjectMeta = ({ links, techstack }) => (
|
||||||
const { links, techstack } = props
|
<footer className={styles.project__meta}>
|
||||||
|
{!!links && <ProjectLinks links={links} />}
|
||||||
|
{!!techstack && <ProjectTechstack techstack={techstack} />}
|
||||||
|
</footer>
|
||||||
|
)
|
||||||
|
|
||||||
return (
|
const ProjectImages = ({ projectImages, title }) => (
|
||||||
<footer className={styles.project__meta}>
|
|
||||||
{!!links && <ProjectLinks links={links} />}
|
|
||||||
{!!techstack && <ProjectTechstack techstack={techstack} />}
|
|
||||||
</footer>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
const ProjectImages = props => (
|
|
||||||
<FullWidth>
|
<FullWidth>
|
||||||
{props.projectImages.map(({ node }) => (
|
{projectImages.map(({ node }) => (
|
||||||
<div className={styles.spacer} key={node.id}>
|
<div className={styles.spacer} key={node.id}>
|
||||||
<ProjectImage fluid={node.fluid} alt={props.title} />
|
<ProjectImage fluid={node.fluid} alt={title} />
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
</FullWidth>
|
</FullWidth>
|
||||||
)
|
)
|
||||||
|
|
||||||
class Project extends Component {
|
const Project = ({ data, location }) => {
|
||||||
constructor(props) {
|
const meta = data.dataYaml
|
||||||
super(props)
|
const project = data.projectsYaml
|
||||||
|
const projectImages = data.projectImages.edges
|
||||||
|
const { title, links, techstack } = project
|
||||||
|
const description = data.projectsYaml.description
|
||||||
|
const descriptionWithLineBreaks = description.split('\n').join('\n\n')
|
||||||
|
|
||||||
const description = this.props.data.projectsYaml.description
|
return (
|
||||||
|
<Layout location={location}>
|
||||||
|
<Helmet title={title} />
|
||||||
|
|
||||||
this.state = {
|
<SEO project={project} meta={meta} />
|
||||||
descriptionWithLineBreaks: description.split('\n').join('\n\n')
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
render() {
|
<article className={styles.project}>
|
||||||
const meta = this.props.data.dataYaml
|
<Content>
|
||||||
const project = this.props.data.projectsYaml
|
<h1 className={styles.project__title}>{title}</h1>
|
||||||
const projectImages = this.props.data.projectImages.edges
|
<ReactMarkdown
|
||||||
const { title, links, techstack } = project
|
source={descriptionWithLineBreaks}
|
||||||
|
className={styles.project__description}
|
||||||
|
/>
|
||||||
|
<ProjectImages projectImages={projectImages} title={title} />
|
||||||
|
<ProjectMeta links={links} techstack={techstack} />
|
||||||
|
</Content>
|
||||||
|
</article>
|
||||||
|
|
||||||
return (
|
<ProjectNav slug={project.slug} />
|
||||||
<Layout location={this.props.location}>
|
</Layout>
|
||||||
<Helmet title={title} />
|
)
|
||||||
|
|
||||||
<SEO project={project} meta={meta} />
|
|
||||||
|
|
||||||
<article className={styles.project}>
|
|
||||||
<Content>
|
|
||||||
<h1 className={styles.project__title}>{title}</h1>
|
|
||||||
<ReactMarkdown
|
|
||||||
source={this.state.descriptionWithLineBreaks}
|
|
||||||
className={styles.project__description}
|
|
||||||
/>
|
|
||||||
<ProjectImages projectImages={projectImages} title={title} />
|
|
||||||
<ProjectMeta links={links} techstack={techstack} />
|
|
||||||
</Content>
|
|
||||||
</article>
|
|
||||||
|
|
||||||
<ProjectNav slug={project.slug} />
|
|
||||||
</Layout>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
ProjectMeta.propTypes = {
|
ProjectMeta.propTypes = {
|
||||||
|
Loading…
Reference in New Issue
Block a user