mirror_css/csslayout
1
0
Fork 0
mirror of https://github.com/phuoc-ng/csslayout.git synced 2025-08-07 22:56:51 +02:00
Code Issues Releases Wiki Activity

feat: Update header and footer

Browse Source
This commit is contained in:
Phuoc Nguyen
2022-08-21 19:59:09 +07:00
parent 78dedd0fc7
commit 3bb07d8358
2 changed files with 7 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
components/FooterBlock.tsx
View File

@@ -5,27 +5,27 @@ export const FooterBlock = () => (
<footer className="block-footer"> <footer className="block-footer">
<div className="block-container"> <div className="block-container">
<Footer> <Footer>
<FooterGroup title="Products"> <FooterGroup title="My products">
<FooterLink href="https://blur.page">Blur Page</FooterLink> <FooterLink href="https://blur.page">Blur Page</FooterLink>
<FooterLink href="https://formvalidation.io">Form Validation</FooterLink> <FooterLink href="https://formvalidation.io">Form Validation</FooterLink>
<FooterLink href="https://intersectionobserver.io">IntersectionObserver Examples</FooterLink> <FooterLink href="https://intersectionobserver.io">IntersectionObserver Examples</FooterLink>
<FooterLink href="https://react-pdf-viewer.dev">React PDF Viewer</FooterLink> <FooterLink href="https://react-pdf-viewer.dev">React PDF Viewer</FooterLink>
</FooterGroup> </FooterGroup>
<FooterGroup title="Open sources"> <FooterGroup title="My open sources">
<FooterLink href="https://1loc.dev">1 LOC</FooterLink> <FooterLink href="https://1loc.dev">1 LOC</FooterLink>
<FooterLink href="https://csslayout.io">CSS Layout</FooterLink> <FooterLink href="https://csslayout.io">CSS Layout</FooterLink>
<FooterLink href="https://getfrontend.tips">Front-end Tips</FooterLink> <FooterLink href="https://getfrontend.tips">Front-end Tips</FooterLink>
<FooterLink href="https://htmldom.dev">HTML DOM</FooterLink> <FooterLink href="https://htmldom.dev">HTML DOM</FooterLink>
<FooterLink href="https://thisthat.dev">this VS that</FooterLink> <FooterLink href="https://thisthat.dev">this VS that</FooterLink>
</FooterGroup> </FooterGroup>
<FooterGroup title="Follow us"> <FooterGroup title="Follow me">
<FooterLink href="https://github.com/1milligram">GitHub</FooterLink> <FooterLink href="https://github.com/phuocng">GitHub</FooterLink>
<FooterLink href="https://twitter.com/nghuuphuoc">Twitter</FooterLink> <FooterLink href="https://twitter.com/nghuuphuoc">Twitter</FooterLink>
</FooterGroup> </FooterGroup>
</Footer> </Footer>
<div className="block-footer__copyright"> <div className="block-footer__copyright">
© 2020 — {new Date().getFullYear()}, 1 milligram. All rights reserved. © 2020 — {new Date().getFullYear()}, Nguyen Huu Phuoc. All rights reserved.
</div> </div>
</div> </div>
</footer> </footer>

4
components/HeaderBlock.tsx
View File

@@ -6,7 +6,7 @@ export const HeaderBlock = () => {
const [totalStars, setTotalStars] = React.useState(0); const [totalStars, setTotalStars] = React.useState(0);
React.useEffect(() => { React.useEffect(() => {
fetch('https://api.github.com/repos/1milligram/csslayout') fetch('https://api.github.com/repos/phuocng/csslayout')
.then((res) => res.json()) .then((res) => res.json())
.then((data) => setTotalStars(data.stargazers_count)) .then((data) => setTotalStars(data.stargazers_count))
.catch(console.log); .catch(console.log);
@@ -27,7 +27,7 @@ export const HeaderBlock = () => {
<Link href="/" passHref> <Link href="/" passHref>
<HeaderLogo /> <HeaderLogo />
</Link> </Link>
<Link href="https://github.com/1milligram/csslayout"> <Link href="https://github.com/phuocng/csslayout">
<a className="block-header__cta">GitHub {totalStars}★</a> <a className="block-header__cta">GitHub {totalStars}★</a>
</Link> </Link>
</div> </div>