4

Github style: 优化博客页面样式 · juzhiyuan/blog@a62060d · GitHub

 2 years ago
source link: https://github.com/juzhiyuan/blog/commit/a62060d41e3538aca49628cd7180c9bdf1ae1128
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

优化博客页面样式 · juzhiyuan/blog@a62060d · GitHubPermalink

Browse files

style: 优化博客页面样式

juzhiyuan

committed 18 hours ago

1 parent c4ee97b commit a62060d41e3538aca49628cd7180c9bdf1ae1128
Showing with 38 additions and 5 deletions.

@@ -1,5 +1,6 @@

type Post = {

title: string;

date: string;

content: string;

slug: string;

filePath: string;

@@ -1,10 +1,12 @@

import { GetStaticPaths, GetStaticProps } from "next";

import Link from "next/link";

import Head from "next/head";

import fs from "fs";

import matter from "gray-matter";

import { Container, Heading } from "@chakra-ui/react";

import { Container, Heading, Text, Flex } from "@chakra-ui/react";

import { getAllPosts, markdownToHTML } from "../../helper";

import styles from "./styles.module.css";

export const getStaticProps: GetStaticProps = async (context) => {

const { slug } = context.params as { slug: string };

@@ -34,15 +36,26 @@ export const getStaticPaths: GetStaticPaths = async () => {

};

};

const BlogPost = ({ title, content }: Post) => {

const BlogPost = ({ title, content, date }: Post) => {

return (

<>

<Head>

<title>{title}</title>

</Head>

<Container>

<Heading>{title}</Heading>

<div dangerouslySetInnerHTML={{ __html: content }} />

<Container mt="4" mb="10">

<Heading size="lg">{title}</Heading>

<Flex mt="1" mb="1">

<Text as="u">

<Link href="/">琚致远</Link>

</Text>

 

<Text>{date}</Text>

</Flex>

<article

dangerouslySetInnerHTML={{ __html: content }}

className={styles.article}

/>

</Container>

</>

);


report

Recommend

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK