feat: implemented footer
This commit is contained in:
parent
4c1e38ec41
commit
5c820f16c2
@ -13,6 +13,10 @@
|
|||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
color: #646cff;
|
color: #646cff;
|
||||||
|
45
src/layout/footer.tsx
Normal file
45
src/layout/footer.tsx
Normal file
@ -0,0 +1,45 @@
|
|||||||
|
import styles from '../styles/footer.module.scss'
|
||||||
|
|
||||||
|
export const Footer = () => {
|
||||||
|
return (
|
||||||
|
<div className={styles.secMainFooterWrapper}>
|
||||||
|
<div className={styles.secMainFooter}>
|
||||||
|
<p className={styles.secMainFooterPara}>
|
||||||
|
Built with
|
||||||
|
<a
|
||||||
|
className={styles.secMainFooterParaLink}
|
||||||
|
href='https://github.com/nostr-protocol/nostr'
|
||||||
|
target='_blank'
|
||||||
|
>
|
||||||
|
Nostr
|
||||||
|
</a>{' '}
|
||||||
|
by
|
||||||
|
<a
|
||||||
|
className={styles.secMainFooterParaLink}
|
||||||
|
href='https://primal.net/p/npub18n4ysp43ux5c98fs6h9c57qpr4p8r3j8f6e32v0vj8egzy878aqqyzzk9r'
|
||||||
|
target='_blank'
|
||||||
|
>
|
||||||
|
Freakoverse
|
||||||
|
</a>
|
||||||
|
, with the support of{' '}
|
||||||
|
<a className={styles.secMainFooterParaLink} href='backers.html'>
|
||||||
|
Supporters
|
||||||
|
</a>
|
||||||
|
and Nostr developer
|
||||||
|
<a
|
||||||
|
className={styles.secMainFooterParaLink}
|
||||||
|
href='https://nostrdev.com'
|
||||||
|
target='_blank'
|
||||||
|
>
|
||||||
|
NostrDev
|
||||||
|
</a>
|
||||||
|
. Check our
|
||||||
|
<a className={styles.secMainFooterParaLink} href='backup.html'>
|
||||||
|
Backup Plan
|
||||||
|
</a>
|
||||||
|
.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
@ -1,10 +1,12 @@
|
|||||||
import { Header } from './header'
|
|
||||||
import mainStyles from '../styles/main.module.scss'
|
import mainStyles from '../styles/main.module.scss'
|
||||||
|
import { Footer } from './footer'
|
||||||
|
import { Header } from './header'
|
||||||
|
|
||||||
export const Layout = () => {
|
export const Layout = () => {
|
||||||
return (
|
return (
|
||||||
<div className={mainStyles.bodyMain}>
|
<div className={mainStyles.bodyMain}>
|
||||||
<Header />
|
<Header />
|
||||||
|
<Footer />
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
37
src/styles/footer.module.scss
Normal file
37
src/styles/footer.module.scss
Normal file
@ -0,0 +1,37 @@
|
|||||||
|
.secMainFooterWrapper {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: end;
|
||||||
|
border-top: solid 1px rgba(255, 255, 255, 0.05);
|
||||||
|
|
||||||
|
.secMainFooter {
|
||||||
|
width: 100%;
|
||||||
|
padding: 15px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
color: rgba(255, 255, 255, 0.1);
|
||||||
|
|
||||||
|
.secMainFooterPara {
|
||||||
|
text-align: center;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.secMainFooterParaLink {
|
||||||
|
transition: ease 0.4s;
|
||||||
|
color: rgba(255, 255, 255, 0.1);
|
||||||
|
text-decoration: unset;
|
||||||
|
font-weight: bold;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
transition: ease 0.4s;
|
||||||
|
color: rgba(173, 90, 255, 0.75);
|
||||||
|
text-decoration: unset;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user