diff --git a/pages/index.tsx b/pages/index.tsx index b6d5414..06f54ff 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -1,14 +1,35 @@ import type { NextPage } from "next"; import Layout from "../components/Blog/Layout"; -import type { ContentList } from "../lib/content/types"; +import type { ContentList, Project, Diary } from "../lib/content/types"; import ProjectCard from "../components/Blog/Card"; import { getContentList } from "../lib/content/generateBackend"; import styles from "../styles/Blog/Front.module.scss"; +// https://stackoverflow.com/a/6274381 +function shuffle(a: any[]) { + for (let i = a.length - 1; i > 0; i--) { + const j = Math.floor(Math.random() * (i + 1)); + [a[i], a[j]] = [a[j], a[i]]; + } + return a; +} + const Blog: NextPage<{ content: ContentList }> = ({content}) => { + const clearDescription = (description: string) => { + const linkRegex = /#%\{([a-z0-9 \.-\/:]*)\|([a-z0-9 \/:\.-]*)\}/ig; + const cmdRegex = /%\{([a-z0-9 \.-\/:]*)}/ig; + + return description.replace(linkRegex, "$1").replace(cmdRegex, "\"$1\""); + }; + const generateCards = (type: string) => { - return
{content.filter(p => p.type === type).map(p => )}
; + return
{ + (shuffle(content.filter(p => p.type === type)) as (Project|Diary)[]) + .map(p => + + )} +
; }; return <> diff --git a/styles/Blog/Blog.module.scss b/styles/Blog/Blog.module.scss index a6e5911..b1294db 100644 --- a/styles/Blog/Blog.module.scss +++ b/styles/Blog/Blog.module.scss @@ -36,4 +36,11 @@ border-bottom-left-radius: 1em; border-bottom-right-radius: 1em; } + + h1 { + color: var(--blog_color-accent); + } + h2, h3, h4, h5, h6 { + color: var(--blog_color-accent-dark); + } }