mirror of
https://github.com/koodiklinikka/koodiklinikka.fi.git
synced 2026-02-10 19:51:25 +00:00
Refactoring patient projects
This commit is contained in:
@@ -2,10 +2,10 @@ import React from "react";
|
||||
import "../styles/style.styl";
|
||||
import "../styles/icons.less";
|
||||
import Head from "next/head";
|
||||
import InviteForm from '../components/InviteForm';
|
||||
import Members from '../components/Members';
|
||||
import Feed from '../components/Feed';
|
||||
|
||||
import InviteForm from "../components/InviteForm";
|
||||
import Members from "../components/Members";
|
||||
import Feed from "../components/Feed";
|
||||
import { projects } from './patientProjects'
|
||||
const Hero = () => (
|
||||
<div className="header">
|
||||
<video
|
||||
@@ -32,6 +32,20 @@ const Hero = () => (
|
||||
</div>
|
||||
);
|
||||
|
||||
const PatientProject = ({ title, description, url, image }) => (
|
||||
<div className="bread">
|
||||
<div className="column column2-5">
|
||||
<a href={url} target="_blank">
|
||||
<img src={image} style={{ width: "7rem"}} />
|
||||
</a>
|
||||
</div>
|
||||
<div className="column column3-5">
|
||||
<h4>{title}</h4>
|
||||
<p>{description}</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
const IndexContent = () => (
|
||||
<>
|
||||
<div className="content with-feed">
|
||||
@@ -107,62 +121,9 @@ const IndexContent = () => (
|
||||
</div>
|
||||
<div className="row">
|
||||
<h2>Potilaiden projekteja</h2>
|
||||
<div className="bread">
|
||||
<div className="column column2-5">
|
||||
<a href="https://redom.js.org" target="_blank">
|
||||
<img src="/static/images/redom.svg" />
|
||||
</a>
|
||||
</div>
|
||||
<div className="column column3-5">
|
||||
<h4>RE:DOM</h4>
|
||||
<p>
|
||||
Tiny (2 KB) turboboosted JavaScript library for creating user
|
||||
interfaces. Develop web apps with 100 % JavaScript and web
|
||||
standards.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="bread">
|
||||
<div className="column column2-5">
|
||||
<a href="https://codestats.net/" target="_blank">
|
||||
<img
|
||||
src="/static/images/codestats.png"
|
||||
className="project-image__codestats"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
<div className="column column3-5">
|
||||
<h4>Code::Stats</h4>
|
||||
<p>
|
||||
Code::Stats is a free stats tracking service for programmers
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="bread">
|
||||
<div className="column column2-5">
|
||||
<a href="https://reactabular.js.org/" target="_blank">
|
||||
<img
|
||||
src="/static/images/reactabular.png"
|
||||
className="project-image__codestats"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
<div className="column column3-5">
|
||||
<h4>Reactabular</h4>
|
||||
<p>A framework for building the React table you need</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="bread">
|
||||
<div className="column column2-5">
|
||||
<a href="https://avain.app" target="_blank">
|
||||
<img src="/static/images/avain.svg" style={{ width: "7rem" }} />
|
||||
</a>
|
||||
</div>
|
||||
<div className="column column3-5">
|
||||
<h4>Avain.app</h4>
|
||||
<p>Secure one-time password manager (PWA + Web Crypto)</p>
|
||||
</div>
|
||||
</div>
|
||||
{projects.map(project => (
|
||||
<PatientProject key={project.url} {...project} />
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
<div id="feed">
|
||||
|
||||
27
pages/patientProjects.js
Normal file
27
pages/patientProjects.js
Normal file
@@ -0,0 +1,27 @@
|
||||
export const projects = [
|
||||
{
|
||||
title: "RE:DOM",
|
||||
description:
|
||||
" Tiny (2 KB) turboboosted JavaScript library for creating user interfaces. Develop web apps with 100 % JavaScript and web standards.",
|
||||
url: "https://redom.js.org",
|
||||
image: "/static/images/redom.svg",
|
||||
},
|
||||
{
|
||||
title: "Code::Stats",
|
||||
description: "Code::Stats is a free stats tracking service for programmers",
|
||||
url: "https://codestats.net/",
|
||||
image: "/static/images/codestats.png",
|
||||
},
|
||||
{
|
||||
title: "Reactabular",
|
||||
description: "A framework for building the React table you need",
|
||||
url: "https://reactabular.js.org/",
|
||||
image: "/static/images/reactabular.png",
|
||||
},
|
||||
{
|
||||
title: "Avain.app",
|
||||
description: "Secure one-time password manager (PWA + Web Crypto)",
|
||||
url: "https://avain.app",
|
||||
image: "/static/images/avain.svg",
|
||||
},
|
||||
];
|
||||
Reference in New Issue
Block a user