navbar layout
This commit is contained in:
parent
84b69fc481
commit
d2c84dbacc
@ -139,7 +139,8 @@ export default {
|
|||||||
JOIN "Item" ON ltree2text(subpath("Item"."path", 0, -1)) = p."path"
|
JOIN "Item" ON ltree2text(subpath("Item"."path", 0, -1)) = p."path"
|
||||||
${LEFT_JOIN_SATS})
|
${LEFT_JOIN_SATS})
|
||||||
SELECT * FROM base ORDER BY sort_path`)
|
SELECT * FROM base ORDER BY sort_path`)
|
||||||
return nestComments(flat, item.id)[0]
|
const comments = nestComments(flat, item.id)[0]
|
||||||
|
return comments
|
||||||
},
|
},
|
||||||
sats: async (item, args, { models }) => {
|
sats: async (item, args, { models }) => {
|
||||||
const { sum: { sats } } = await models.vote.aggregate({
|
const { sum: { sats } } = await models.vote.aggregate({
|
||||||
|
@ -20,12 +20,12 @@ export default function Header () {
|
|||||||
<>
|
<>
|
||||||
<Nav.Item>
|
<Nav.Item>
|
||||||
<Link href={'/' + session.user.name} passHref>
|
<Link href={'/' + session.user.name} passHref>
|
||||||
<Nav.Link>@{session.user.name}</Nav.Link>
|
<Nav.Link className={styles.navLink}>@{session.user.name}</Nav.Link>
|
||||||
</Link>
|
</Link>
|
||||||
</Nav.Item>
|
</Nav.Item>
|
||||||
<Nav.Item>
|
{/* <Nav.Item>
|
||||||
<Nav.Link onClick={signOut}>logout</Nav.Link>
|
<Nav.Link onClick={signOut} className={styles.navLink}>logout</Nav.Link>
|
||||||
</Nav.Item>
|
</Nav.Item> */}
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
} else {
|
} else {
|
||||||
@ -35,31 +35,29 @@ export default function Header () {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Navbar bg='primary' className={styles.navbar}>
|
<Container className='px-sm-0'>
|
||||||
<Container>
|
<Navbar className={styles.navbar}>
|
||||||
<Link href='/' passHref>
|
<Nav className='w-100 justify-content-sm-between justify-content-start flex-wrap align-items-center' activeKey={router.asPath.split('?')[0]}>
|
||||||
<Navbar.Brand className={styles.brand}>STACKER NEWS</Navbar.Brand>
|
<Link href='/' passHref>
|
||||||
</Link>
|
<Navbar.Brand className={`${styles.brand} mr-2 mr-sm-0`}>STACKER NEWS</Navbar.Brand>
|
||||||
<Nav className='mr-auto align-items-center' activeKey={router.asPath.split('?')[0]}>
|
</Link>
|
||||||
<Nav.Item>
|
<Nav.Item>
|
||||||
<Link href='/recent' passHref>
|
<Link href='/recent' passHref>
|
||||||
<Nav.Link>recent</Nav.Link>
|
<Nav.Link className={styles.navLink}>recent</Nav.Link>
|
||||||
</Link>
|
</Link>
|
||||||
</Nav.Item>
|
</Nav.Item>
|
||||||
<Nav.Item>
|
<Nav.Item>
|
||||||
<Link href='/post' passHref>
|
<Link href='/post' passHref>
|
||||||
<Nav.Link>post</Nav.Link>
|
<Nav.Link className={styles.navLink}>post</Nav.Link>
|
||||||
</Link>
|
</Link>
|
||||||
</Nav.Item>
|
</Nav.Item>
|
||||||
<Nav.Item>
|
<Nav.Item>
|
||||||
<Nav.Link href='https://bitcoinerjobs.co' target='_blank'>jobs</Nav.Link>
|
<Nav.Link href='https://bitcoinerjobs.co' target='_blank' className={styles.navLink}>jobs</Nav.Link>
|
||||||
</Nav.Item>
|
</Nav.Item>
|
||||||
</Nav>
|
|
||||||
<Nav className='ml-auto align-items-center' activeKey={router.asPath.split('?')[0]}>
|
|
||||||
<Corner />
|
<Corner />
|
||||||
</Nav>
|
</Nav>
|
||||||
</Container>
|
</Navbar>
|
||||||
</Navbar>
|
</Container>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
@ -4,10 +4,15 @@
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
line-height: 100%;
|
line-height: 100%;
|
||||||
margin-bottom: -.3rem;
|
margin-bottom: -.3rem;
|
||||||
|
margin-right: 0;
|
||||||
|
text-shadow: 0 0 10px #FADA5E;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navLink {
|
||||||
|
padding: 0.25rem 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar {
|
.navbar {
|
||||||
padding: 0rem 1.75rem;
|
padding: .5rem 0;
|
||||||
background-color: transparent !important;
|
background-color: transparent !important;
|
||||||
background-image: linear-gradient(#FADA5E, #FADA5E, transparent)
|
|
||||||
}
|
}
|
@ -13,31 +13,30 @@ export default function Item ({ item, rank, children }) {
|
|||||||
</div>)
|
</div>)
|
||||||
: <div />}
|
: <div />}
|
||||||
<div className={styles.item}>
|
<div className={styles.item}>
|
||||||
<UpVote itemId={item.id} meSats={item.meSats} />
|
<UpVote itemId={item.id} meSats={item.meSats} className={styles.upvote} />
|
||||||
<div className={styles.hunk}>
|
<div className={styles.hunk}>
|
||||||
<div className={`${styles.main} flex-wrap flex-md-nowrap`}>
|
<div className={`${styles.main} flex-wrap flex-md-nowrap`}>
|
||||||
<Link href={`/items/${item.id}`} passHref>
|
<Link href={`/items/${item.id}`} passHref>
|
||||||
<a className={`${styles.title} text-reset flex-md-fill flex-md-shrink-0 mr-2`}>{item.title}</a>
|
<a className={`${styles.title} text-reset flex-md-shrink-0 mr-2`}>{item.title}</a>
|
||||||
</Link>
|
</Link>
|
||||||
{item.url && <a className={styles.link} href={item.url}>{item.url.replace(/(^\w+:|^)\/\//, '')}</a>}
|
{item.url && <a className={styles.link} href={item.url}>{item.url.replace(/(^\w+:|^)\/\//, '')}</a>}
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.other}>
|
<div className={`${styles.other}`}>
|
||||||
<span>{item.sats} sats</span>
|
<span>{item.sats} sats</span>
|
||||||
{!!item.boost &&
|
<span> \ </span>
|
||||||
<>
|
<span>{item.boost} boost</span>
|
||||||
<span> \ </span>
|
|
||||||
<span>{item.boost} boost</span>
|
|
||||||
</>}
|
|
||||||
<span> \ </span>
|
<span> \ </span>
|
||||||
<Link href={`/items/${item.id}`} passHref>
|
<Link href={`/items/${item.id}`} passHref>
|
||||||
<a className='text-reset'>{item.ncomments} comments</a>
|
<a className='text-reset'>{item.ncomments} comments</a>
|
||||||
</Link>
|
</Link>
|
||||||
<span> \ </span>
|
<span> \ </span>
|
||||||
<Link href={`/${item.user.name}`} passHref>
|
<span>
|
||||||
<a>@{item.user.name}</a>
|
<Link href={`/${item.user.name}`} passHref>
|
||||||
</Link>
|
<a>@{item.user.name}</a>
|
||||||
<span> </span>
|
</Link>
|
||||||
<span>{timeSince(new Date(item.createdAt))}</span>
|
<span> </span>
|
||||||
|
<span>{timeSince(new Date(item.createdAt))}</span>
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -25,6 +25,7 @@
|
|||||||
|
|
||||||
.hunk {
|
.hunk {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.main {
|
.main {
|
||||||
|
@ -10,7 +10,7 @@ export default function Layout ({ noContain, children }) {
|
|||||||
{noContain
|
{noContain
|
||||||
? children
|
? children
|
||||||
: (
|
: (
|
||||||
<Container className='my-2 py-2 px-sm-0'>
|
<Container className='my-1 px-sm-0'>
|
||||||
{children}
|
{children}
|
||||||
</Container>
|
</Container>
|
||||||
)}
|
)}
|
||||||
|
@ -8,7 +8,7 @@ $theme-colors: (
|
|||||||
"boost" : #7A0CE9,
|
"boost" : #7A0CE9,
|
||||||
);
|
);
|
||||||
|
|
||||||
$body-bg: #fafafa;
|
$body-bg: #f5f5f5;
|
||||||
$border-radius: .4rem;
|
$border-radius: .4rem;
|
||||||
$enable-transitions: false;
|
$enable-transitions: false;
|
||||||
$enable-gradients: false;
|
$enable-gradients: false;
|
||||||
|
Loading…
x
Reference in New Issue
Block a user