Automatically align projects on home page

dependabot/npm_and_yarn/typescript-eslint/parser-4.33.0
Guusvanmeerveld 3 years ago
parent 2779e07851
commit 250cae301e

@ -2,7 +2,11 @@ import { FC } from 'react';
import ProjectType from '@models/project'; import ProjectType from '@models/project';
const Project: FC<ProjectType> = ({ name, description, buttons, cover, right }) => { interface ProjectComponent extends ProjectType {
right: boolean;
}
const Project: FC<ProjectComponent> = ({ name, description, buttons, cover, right }) => {
return ( return (
<div className="project"> <div className="project">
<div className="content"> <div className="content">

@ -18,7 +18,6 @@
"name": "Tempo", "name": "Tempo",
"description": "Tempo is a 'simple' Discord bot which can be used to play YouTube, SoundCloud and even Spotify songs. It's made in pure TypeScript and has plentiful settings.", "description": "Tempo is a 'simple' Discord bot which can be used to play YouTube, SoundCloud and even Spotify songs. It's made in pure TypeScript and has plentiful settings.",
"cover": "tempo.png", "cover": "tempo.png",
"right": true,
"buttons": [ "buttons": [
{ {
"link": "https://tempo.g-vm.nl", "link": "https://tempo.g-vm.nl",
@ -47,7 +46,6 @@
{ {
"name": "Magister Auto-Login", "name": "Magister Auto-Login",
"description": "Magister Auto-Login is a chrome extension that automatically logs into Magister 6 for you.", "description": "Magister Auto-Login is a chrome extension that automatically logs into Magister 6 for you.",
"right": true,
"buttons": [ "buttons": [
{ {
"link": "https://chrome.google.com/webstore/detail/magister-auto-login/cekhhgcjpkahghpgeafhmkkjhidodplk?hl=nl", "link": "https://chrome.google.com/webstore/detail/magister-auto-login/cekhhgcjpkahghpgeafhmkkjhidodplk?hl=nl",

@ -2,7 +2,6 @@ export default interface Project {
name: string; name: string;
description: string; description: string;
cover?: string; cover?: string;
right?: boolean;
buttons: Button[]; buttons: Button[];
} }

@ -33,9 +33,10 @@ const Home: NextPage = () => (
Projects Projects
</div> </div>
{projects.map((project) => ( {projects.map((project, i) => {
<Project key={project.name} {...project} /> const props = { ...project, right: (i + 1) % 2 == 0 };
))} return <Project key={project.name} {...props} />;
})}
</div> </div>
</div> </div>
</Layout> </Layout>

Loading…
Cancel
Save