stacker.news/components/footer.js

54 lines
1.7 KiB
JavaScript
Raw Normal View History

2021-06-02 23:15:28 +00:00
import { useQuery } from '@apollo/client'
import gql from 'graphql-tag'
2021-06-02 23:31:07 +00:00
import { Container } from 'react-bootstrap'
2021-06-02 23:15:28 +00:00
import { CopyInput } from './form'
2021-06-04 01:55:23 +00:00
import styles from './footer.module.css'
2021-06-30 23:01:28 +00:00
import Texas from '../svgs/texas.svg'
import Github from '../svgs/github-fill.svg'
import Twitter from '../svgs/twitter-fill.svg'
2021-07-15 23:06:21 +00:00
import Link from 'next/link'
2021-06-02 23:15:28 +00:00
export default function Footer () {
const query = gql`
{
connectAddress
}
`
const { data } = useQuery(query)
return (
<footer>
2021-07-12 21:45:16 +00:00
<Container className='my-3 mt-5'>
2021-06-30 23:01:28 +00:00
{data &&
2021-06-02 23:31:07 +00:00
<div
2021-06-30 23:01:28 +00:00
className={`text-small mx-auto mb-2 ${styles.connect}`}
2021-06-02 23:31:07 +00:00
>
2021-06-02 23:15:28 +00:00
<span className='nav-item text-muted mr-2'>connect:</span>
<CopyInput
size='sm'
2021-06-02 23:31:07 +00:00
groupClassName='mb-0 w-100'
2021-06-02 23:15:28 +00:00
readOnly
placeholder={data.connectAddress}
/>
2021-06-30 23:01:28 +00:00
</div>}
2021-07-15 23:06:21 +00:00
<Link href='/faq' passHref>
<a className='text-dark d-inline-flex'>
FAQ
</a>
</Link>
<span className='text-muted mx-2'> \ </span>
2021-06-30 23:01:28 +00:00
<small>
<a className='text-dark d-inline-flex' href='https://github.com/stackernews/stacker.news'>
This is free open source software <Github width={20} height={20} className='mx-1' />
</a>
<span className='d-inline-flex text-muted'>
made with sound love in Austin <Texas className='mx-1' width={20} height={20} />
by <a href='https://twitter.com/k00bideh' className='text-twitter d-inline-flex'><Twitter width={20} height={20} className='ml-1' />@k00bideh</a>
</span>
</small>
</Container>
2021-06-02 23:15:28 +00:00
</footer>
)
}