ekzyis/stacker.news
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add jobs rss and style footer popovers consistently

Browse Source
This commit is contained in:
keyan 2023-05-04 16:41:56 -05:00
parent 5e6e6a18e6
commit 833b31980e
3 changed files with 50 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
components/footer.js
View File

@ -81,17 +81,21 @@ const handleThemeChange = (dark) => {
const RssPopover = ( const RssPopover = (
<Popover> <Popover>
<Popover.Content style={{ fontWeight: 500, fontSize: '.9rem' }}> <Popover.Content style={{ fontWeight: 500, fontSize: '.9rem' }}>
<a href='/rss' className='text-dark d-inline-flex'> <a href='/rss' className='nav-link p-0 d-inline-flex'>
home home
</a> </a>
<span className='mx-2 text-dark'> \ </span> <span className='mx-2 text-muted'> \ </span>
<a href='/~bitcoin/rss' className='text-dark d-inline-flex'> <a href='/~bitcoin/rss' className='nav-link p-0 d-inline-flex'>
bitcoin bitcoin
</a> </a>
<span className='mx-2 text-dark'> \ </span> <span className='mx-2 text-muted'> \ </span>
<a href='/~nostr/rss' className='text-dark d-inline-flex'> <a href='/~nostr/rss' className='nav-link p-0 d-inline-flex'>
nostr nostr
</a> </a>
<span className='mx-2 text-muted'> \ </span>
<a href='/~jobs/rss' className='nav-link p-0 d-inline-flex'>
jobs
</a>
</Popover.Content> </Popover.Content>
</Popover> </Popover>
) )
@ -100,14 +104,14 @@ const ChatPopover = (
<Popover> <Popover>
<Popover.Content style={{ fontWeight: 500, fontSize: '.9rem' }}> <Popover.Content style={{ fontWeight: 500, fontSize: '.9rem' }}>
<a <a
href='https://tribes.sphinx.chat/t/stackerzchat' className='text-dark d-inline-flex' href='https://tribes.sphinx.chat/t/stackerzchat' className='nav-link p-0 d-inline-flex'
target='_blank' rel='noreferrer' target='_blank' rel='noreferrer'
> >
sphinx sphinx
</a> </a>
<span className='mx-2 text-dark'> \ </span> <span className='mx-2 text-muted'> \ </span>
<a <a
href='https://t.me/stackernews' className='text-dark d-inline-flex' href='https://t.me/stackernews' className='nav-link p-0 d-inline-flex'
target='_blank' rel='noreferrer' target='_blank' rel='noreferrer'
> >
telegram telegram
@ -120,14 +124,14 @@ const AnalyticsPopover = (
<Popover> <Popover>
<Popover.Content style={{ fontWeight: 500, fontSize: '.9rem' }}> <Popover.Content style={{ fontWeight: 500, fontSize: '.9rem' }}>
<a <a
href='https://plausible.io/stacker.news' className='text-dark d-inline-flex' href='https://plausible.io/stacker.news' className='nav-link p-0 d-inline-flex'
target='_blank' rel='noreferrer' target='_blank' rel='noreferrer'
> >
visitors visitors
</a> </a>
<span className='mx-2 text-dark'> \ </span> <span className='mx-2 text-muted'> \ </span>
<Link href='/users/day' passHref> <Link href='/users/day' passHref>
<a className='text-dark d-inline-flex'> <a className='nav-link p-0 d-inline-flex'>
users users
</a> </a>
</Link> </Link>
@ -181,57 +185,57 @@ export default function Footer ({ noLinks }) {
</div>} </div>}
<div className='mb-0' style={{ fontWeight: 500 }}> <div className='mb-0' style={{ fontWeight: 500 }}>
<Link href='/rewards' passHref> <Link href='/rewards' passHref>
<a className='nav-link p-0 d-inline-flex'> <a className='nav-link p-0 p-0 d-inline-flex'>
rewards rewards
</a> </a>
</Link> </Link>
</div> </div>
<div className='mb-0' style={{ fontWeight: 500 }}> <div className='mb-0' style={{ fontWeight: 500 }}>
<OverlayTrigger trigger='click' placement='top' overlay={AnalyticsPopover} rootClose> <OverlayTrigger trigger='click' placement='top' overlay={AnalyticsPopover} rootClose>
<div className='nav-link p-0 d-inline-flex' style={{ cursor: 'pointer' }}> <div className='nav-link p-0 p-0 d-inline-flex' style={{ cursor: 'pointer' }}>
analytics analytics
</div> </div>
</OverlayTrigger> </OverlayTrigger>
<span className='mx-2 text-muted'> \ </span> <span className='mx-2 text-muted'> \ </span>
<OverlayTrigger trigger='click' placement='top' overlay={ChatPopover} rootClose> <OverlayTrigger trigger='click' placement='top' overlay={ChatPopover} rootClose>
<div className='nav-link p-0 d-inline-flex' style={{ cursor: 'pointer' }}> <div className='nav-link p-0 p-0 d-inline-flex' style={{ cursor: 'pointer' }}>
chat chat
</div> </div>
</OverlayTrigger> </OverlayTrigger>
<span className='mx-2 text-muted'> \ </span> <span className='mx-2 text-muted'> \ </span>
<OverlayTrigger trigger='click' placement='top' overlay={RssPopover} rootClose> <OverlayTrigger trigger='click' placement='top' overlay={RssPopover} rootClose>
<div className='nav-link p-0 d-inline-flex' style={{ cursor: 'pointer' }}> <div className='nav-link p-0 p-0 d-inline-flex' style={{ cursor: 'pointer' }}>
rss rss
</div> </div>
</OverlayTrigger> </OverlayTrigger>
</div> </div>
<div className='mb-2' style={{ fontWeight: 500 }}> <div className='mb-2' style={{ fontWeight: 500 }}>
<Link href='/faq' passHref> <Link href='/faq' passHref>
<a className='nav-link p-0 d-inline-flex'> <a className='nav-link p-0 p-0 d-inline-flex'>
faq faq
</a> </a>
</Link> </Link>
<span className='mx-2 text-muted'> \ </span> <span className='mx-2 text-muted'> \ </span>
<Link href='/guide' passHref> <Link href='/guide' passHref>
<a className='nav-link p-0 d-inline-flex'> <a className='nav-link p-0 p-0 d-inline-flex'>
guide guide
</a> </a>
</Link> </Link>
<span className='mx-2 text-muted'> \ </span> <span className='mx-2 text-muted'> \ </span>
<Link href='/story' passHref> <Link href='/story' passHref>
<a className='nav-link p-0 d-inline-flex'> <a className='nav-link p-0 p-0 d-inline-flex'>
story story
</a> </a>
</Link> </Link>
<span className='mx-2 text-muted'> \ </span> <span className='mx-2 text-muted'> \ </span>
<Link href='/changes' passHref> <Link href='/changes' passHref>
<a className='nav-link p-0 d-inline-flex'> <a className='nav-link p-0 p-0 d-inline-flex'>
changes changes
</a> </a>
</Link> </Link>
<span className='mx-2 text-muted'> \ </span> <span className='mx-2 text-muted'> \ </span>
<Link href='/privacy' passHref> <Link href='/privacy' passHref>
<a className='nav-link p-0 d-inline-flex'> <a className='nav-link p-0 p-0 d-inline-flex'>
privacy privacy
</a> </a>
</Link> </Link>

18
lib/rss.js
View File

@ -1,8 +1,8 @@
import getSSRApolloClient from '../api/ssrApollo' import getSSRApolloClient from '../api/ssrApollo'
const SITE_URL = 'https://stacker.news' const SITE_URL = 'https://stacker.news'
const SITE_TITLE = 'Stacker News' const SITE_TITLE = 'stacker news'
const SITE_SUBTITLE = 'Like Hacker News, but we pay you Bitcoin.' const SITE_SUBTITLE = 'It\'s like Hacker News, but we pay you Bitcoin.'
function escapeXml (unsafe) { function escapeXml (unsafe) {
return unsafe.replace(/[<>&'"]/g, function (c) { return unsafe.replace(/[<>&'"]/g, function (c) {
@ -19,10 +19,14 @@ function escapeXml (unsafe) {
const generateRssItem = (item) => { const generateRssItem = (item) => {
const guid = `${SITE_URL}/items/${item.id}` const guid = `${SITE_URL}/items/${item.id}`
const link = item.url || guid const link = item.url || guid
let title = item.title
if (item.isJob) {
title = item.title + ' \\ ' + item.company + ' \\ ' + `${item.location || ''}${item.location && item.remote ? ' or ' : ''}${item.remote ? 'Remote' : ''}`
}
return ` return `
<item> <item>
<guid>${guid}</guid> <guid>${guid}</guid>
<title>${escapeXml(item.title)}</title> <title>${escapeXml(title)}</title>
<link>${escapeXml(link)}</link> <link>${escapeXml(link)}</link>
<comments>${guid}</comments> <comments>${guid}</comments>
<description><![CDATA[<a href="${guid}">Comments</a>]]></description> <description><![CDATA[<a href="${guid}">Comments</a>]]></description>
@ -31,13 +35,13 @@ const generateRssItem = (item) => {
` `
} }
function generateRssFeed (items) { function generateRssFeed (items, sub = null) {
const itemsList = items.map(generateRssItem) const itemsList = items.map(generateRssItem)
return `<?xml version="1.0" encoding="UTF-8" ?> return `<?xml version="1.0" encoding="UTF-8" ?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"> <rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel> <channel>
<title>${SITE_TITLE}</title> <title>${SITE_TITLE}${sub ? ` ~${sub}` : ''}</title>
<link>${SITE_URL}</link> <link>${SITE_URL}${sub ? `/~${sub}` : ''}</link>
<description>${SITE_SUBTITLE}</description> <description>${SITE_SUBTITLE}</description>
<language>en</language> <language>en</language>
<lastBuildDate>${new Date().toUTCString()}</lastBuildDate> <lastBuildDate>${new Date().toUTCString()}</lastBuildDate>
@ -59,7 +63,7 @@ export default function getGetRssServerSideProps (query, variables = null) {
if (!items || error) return emptyProps if (!items || error) return emptyProps
res.setHeader('Content-Type', 'text/xml; charset=utf-8') res.setHeader('Content-Type', 'text/xml; charset=utf-8')
res.write(generateRssFeed(items)) res.write(generateRssFeed(items, params?.sub))
res.end() res.end()
return emptyProps return emptyProps

15
styles/globals.scss
View File

@ -379,6 +379,21 @@ div[contenteditable] {
padding: .5rem !important; padding: .5rem !important;
} }
.popover {
color: var(--theme-color);
background-color: var(--theme-body);
border-color: var(--theme-borderColor);
}
.popover .arrow::before {
border-top-color: var(--theme-borderColor);
}
.popover .arrow::after {
border-top-color: var(--theme-body);
}
.alert-dismissible .close::after { .alert-dismissible .close::after {
content: 'X'; content: 'X';
} }