waveterm/docusaurus-og
0
0
Fork 0
mirror of https://github.com/wavetermdev/docusaurus-og.git synced 2026-08-05 13:46:35 -07:00
Code Issues Packages Projects Releases Wiki Activity

update footer

Browse Source
This commit is contained in:
jinhojang6
2023-05-26 21:02:41 +09:00
parent 83a8f60fdd
commit e31ed36a94
3 changed files with 125 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/logos-docusaurus-theme/src/client/css/custom.scss
+3
View File
@@ -310,6 +310,9 @@ small {
.footer {
border-top: 1px solid rgb(var(--lsd-text-primary));
width: 100vw;
margin-left: -32px;
padding: 24px 32px;
}
.footer__logo {
packages/logos-docusaurus-theme/src/client/theme/Footer/Layout/index.tsx
+97 -9
View File
@@ -1,22 +1,110 @@
import React from 'react'
import clsx from 'clsx'
import { Grid, GridItem } from '@logos-theme/components/Grid/Grid'
import { Typography } from '@acid-info/lsd-react'
import styles from './style.module.css'
export default function FooterLayout({ style, links, logo, copyright }) {
export default function FooterLayout({ style, copyright }) {
return (
<footer
className={clsx('footer', {
'footer--dark': style === 'dark',
})}
>
<div className="container container-fluid">
{links}
{(logo || copyright) && (
<div className="footer__bottom text--center">
{logo && <div className="margin-bottom--sm">{logo}</div>}
{copyright}
<Grid>
<GridItem className="w-6">
<Typography component="div" variant="body2">
Copyright © 2023 Logos
</Typography>
<Typography component="div" variant="body2">
Built with Docusaurus.
</Typography>
</GridItem>
<GridItem className="w-1" />
<GridItem className="w-6">
<div className={styles.section}>
<div>
<Typography component="div" variant="body2">
Learn
</Typography>
<div className={styles.flexRow}>
<Typography component="a" href="/" variant="body2">
Introduction
</Typography>
<Typography component="a" href="/" variant="body2">
Installation
</Typography>
<Typography component="a" href="/" variant="body2">
Migrate from v1 to v2
</Typography>
</div>
</div>
<div>
<Typography component="div" variant="body2">
Community
</Typography>
<div className={styles.flexRow}>
<Typography component="a" href="/" variant="body2">
Stack Overflow
</Typography>
<Typography component="a" href="/" variant="body2">
Feature Requests
</Typography>
<Typography component="a" href="/" variant="body2">
Discord
</Typography>
<Typography component="a" href="/" variant="body2">
Help
</Typography>
</div>
</div>
</div>
)}
</div>
</GridItem>
<GridItem className="w-1" />
<GridItem className="w-6">
<div className={styles.section}>
<div>
<Typography component="div" variant="body2">
More
</Typography>
<div className={styles.flexRow}>
<Typography component="a" href="/" variant="body2">
Blog
</Typography>
<Typography component="a" href="/" variant="body2">
Changelog
</Typography>
<Typography component="a" href="/" variant="body2">
Github
</Typography>
<Typography component="a" href="/" variant="body2">
Twitter
</Typography>
</div>
</div>
<div>
<Typography component="div" variant="body2">
Legal
</Typography>
<div className={styles.flexRow}>
<Typography component="a" href="/" variant="body2">
Privacy
</Typography>
<Typography component="a" href="/" variant="body2">
Terms
</Typography>
<Typography component="a" href="/" variant="body2">
Data policy
</Typography>
<Typography component="a" href="/" variant="body2">
Cookie policy
</Typography>
</div>
</div>
</div>
</GridItem>
<GridItem className="w-4" />
</Grid>
</footer>
)
}
packages/logos-docusaurus-theme/src/client/theme/Footer/Layout/style.module.css
+25
View File
@@ -0,0 +1,25 @@
.flexRow {
display: flex;
align-items: center;
gap: 8px;
white-space: nowrap;
}
.flexRow a:not(:last-child) {
&:after {
content: '•';
margin-left: 8px;
text-decoration: none;
display: inline-block;
}
}
.flexRow a {
text-decoration: underline;
}
.section {
display: flex;
flex-direction: column;
gap: 32px;
}