kevin/KevinK.dev.js
1
0
Fork 0
mirror of https://github.com/Unkn0wnCat/KevinK.dev.js.git synced 2025-06-10 06:32:06 +02:00
Code Issues Projects Releases Wiki Activity

Add Projects-Module

Browse source
This commit is contained in:
Kevin Kandlbinder 2020-12-21 21:23:52 +01:00
parent 8757b1afb3
commit 688c63910c
13 changed files with 546 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

47
src/pages/projects.js
View file

@ -2,16 +2,55 @@ import React from "react"
import Layout from "../layouts/default";
import { Trans, Link, useI18next } from "gatsby-plugin-react-i18next"
export default function ProjectsPage() {
import styles from "./projects.module.scss";
export const query = graphql`
query GetProjects($language: String!) {
allProjectsJson(filter: {lang: {eq: $language}}) {
nodes {
lang
urlname
name
image {
publicURL
}
shortDescription
}
}
}
`
export default function ProjectsPage({data}) {
const {t} = useI18next();
return (
<Layout module="projects" title={t("projects")}>
<Layout module="projects" title={t("projects")} description={t("projectsDescription")}>
<section>
<div>
<article>
<h1><Trans>projects</Trans></h1>
</div>
<p><Trans>projectsDescription</Trans></p>
<div className={styles.projectList}>
{data.allProjectsJson.nodes.map((project) => {
return (
<div className={styles.projectCard}>
{/*<div className="projectCardActivityIndicator activityIndicatorBlue">Live</div>*/}
<div className={styles.projectCardImage} style={{ backgroundImage: "url("+project.image.publicURL+")" }}></div>
<div className={styles.projectCardMeta}>
<span className={styles.projectCardTitle}>{project.name}</span>
<span className={styles.projectCardTeaser}>{project.shortDescription}</span>
</div>
<div className={styles.projectCardCTAContainer}>
<div className={styles.projectCardCTA}><Link to={"/projects/"+project.urlname}><Trans>projectView</Trans></Link></div>
</div>
</div>
);
})}
</div>
{/*<pre>{JSON.stringify(data, null, 2)}</pre>*/}
</article>
</section>
</Layout>
);