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

restyle ad to be clearer

This commit is contained in:
keyan 2023-08-16 17:53:51 -05:00
parent c9a409845c
commit 7235a4a54f
3 changed files with 19 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
components/item.js
View File

@ -15,6 +15,7 @@ import ItemInfo from './item-info'
import { commentsViewedAt } from '../lib/new-comments' import { commentsViewedAt } from '../lib/new-comments'
import { useRouter } from 'next/router' import { useRouter } from 'next/router'
import { Badge } from 'react-bootstrap' import { Badge } from 'react-bootstrap'
import AdIcon from '../svgs/advertisement-fill.svg'
export function SearchTitle ({ title }) { export function SearchTitle ({ title }) {
return reactStringReplace(title, /:high\[([^\]]+)\]/g, (match, i) => { return reactStringReplace(title, /:high\[([^\]]+)\]/g, (match, i) => {
@ -40,7 +41,11 @@ export default function Item ({ item, rank, belowTitle, right, full, children, s
<div className={`${styles.item} ${siblingComments ? 'pt-2' : ''}`}> <div className={`${styles.item} ${siblingComments ? 'pt-2' : ''}`}>
{item.position {item.position
? <Pin width={24} height={24} className={styles.pin} /> ? <Pin width={24} height={24} className={styles.pin} />
: item.meDontLike ? <Flag width={24} height={24} className={styles.dontLike} /> : <UpVote item={item} className={styles.upvote} pendingSats={pendingSats} setPendingSats={setPendingSats} />} : item.meDontLike
? <Flag width={24} height={24} className={styles.dontLike} />
: Number(item.user?.id) === AD_USER_ID
? <AdIcon width={24} height={24} className={styles.ad} />
: <UpVote item={item} className={styles.upvote} pendingSats={pendingSats} setPendingSats={setPendingSats} />}
<div className={styles.hunk}> <div className={styles.hunk}>
<div className={`${styles.main} flex-wrap`}> <div className={`${styles.main} flex-wrap`}>
<Link <Link
@ -78,7 +83,7 @@ export default function Item ({ item, rank, belowTitle, right, full, children, s
</div> </div>
<ItemInfo <ItemInfo
full={full} item={item} pendingSats={pendingSats} full={full} item={item} pendingSats={pendingSats}
embellishUser={Number(item?.user?.id) === AD_USER_ID && <Badge bg='primary'>AD</Badge>} embellishUser={Number(item?.user?.id) === AD_USER_ID && <Badge className={styles.newComment} bg={null}>AD</Badge>}
/> />
{belowTitle} {belowTitle}
</div> </div>

14
components/item.module.css
View File

@ -50,13 +50,21 @@ a.title:visited {
fill: #a5a5a5; fill: #a5a5a5;
margin-right: .4rem; margin-right: .4rem;
margin-left: -.2rem; margin-left: -.2rem;
flex-shrink: 0;
}
.ad {
fill: #a5a5a5ac;
margin-right: .4rem;
margin-left: -.2rem;
flex-shrink: 0;
} }
.dontLike { .dontLike {
fill: #a5a5a5; fill: #a5a5a5;
margin-right: .2rem; margin-right: .35rem;
padding: 2px; margin-left: -.2rem;
margin-left: 1px; flex-shrink: 0;
} }
.case { .case {

1
svgs/advertisement-line.svg Normal file
View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12.598 16 9.39893 8H7.39893L5.39893 13 5.39795 13.002 4.19897 16H6.35303L6.75293 15H10.043L10.443 16H12.598ZM7.552 13 8.39893 10.8851 9.24402 13H7.552ZM17 8H19V16H16C14.3431 16 13 14.6569 13 13 13 11.3431 14.3431 10 16 10H17V8ZM16 12C15.4478 12 15 12.4478 15 13 15 13.5522 15.4478 14 16 14H17V12H16ZM21 3H3C2.44775 3 2 3.44775 2 4V20C2 20.5522 2.44775 21 3 21H21C21.5522 21 22 20.5522 22 20V4C22 3.44775 21.5522 3 21 3ZM4 19V5H20V19H4Z"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 520 B