feat: implemented footer

This commit is contained in:
daniyal 2024-07-11 00:30:03 +05:00
parent 4c1e38ec41
commit 5c820f16c2
4 changed files with 89 additions and 1 deletions

View File

@ -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
View 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&nbsp;
<a
className={styles.secMainFooterParaLink}
href='https://github.com/nostr-protocol/nostr'
target='_blank'
>
Nostr
</a>{' '}
by&nbsp;
<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>
&nbsp;and Nostr developer&nbsp;
<a
className={styles.secMainFooterParaLink}
href='https://nostrdev.com'
target='_blank'
>
NostrDev
</a>
. Check our&nbsp;
<a className={styles.secMainFooterParaLink} href='backup.html'>
Backup Plan
</a>
.
</p>
</div>
</div>
)
}

View File

@ -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>
) )
} }

View 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;
}
}
}
}
}