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

better horizontal comment density + fix downzap icon width

Browse Source
This commit is contained in:
k00b 2025-08-17 01:41:58 -05:00
parent 6a7796fc87
commit baa92c0ddc
6 changed files with 41 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
components/comment.module.css
View File

@ -18,9 +18,7 @@
.dontLike { .dontLike {
fill: #a5a5a5; fill: #a5a5a5;
margin-right: .35rem; margin-right: 2px;
padding: 2px;
margin-left: 1px;
margin-top: 9px; margin-top: 9px;
cursor: pointer; cursor: pointer;
} }
@ -64,17 +62,21 @@
.children { .children {
margin-top: 0; margin-top: 0;
margin-left: 27px; margin-left: 15px;
} }
.comments { .comments {
margin-left: -.75rem; margin-left: -15px;
} }
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
.comments { .comments {
margin-left: .75rem; margin-left: 0px;
}
.children {
margin-left: 25px;
} }
} }

3
components/dont-link-this.js
View File

@ -7,6 +7,7 @@ import Flag from '@/svgs/flag-fill.svg'
import { useMemo } from 'react' import { useMemo } from 'react'
import getColor from '@/lib/rainbow' import getColor from '@/lib/rainbow'
import { gql, useMutation } from '@apollo/client' import { gql, useMutation } from '@apollo/client'
import styles from './upvote.module.css'
export function DownZap ({ item, ...props }) { export function DownZap ({ item, ...props }) {
const { meDontLikeSats } = item const { meDontLikeSats } = item
@ -20,7 +21,9 @@ export function DownZap ({ item, ...props }) {
<DownZapper <DownZapper
item={item} As={({ ...oprops }) => item={item} As={({ ...oprops }) =>
<div className='upvoteParent'> <div className='upvoteParent'>
<div className={styles.upvoteWrapper}>
<Flag {...props} {...oprops} style={style} /> <Flag {...props} {...oprops} style={style} />
</div>
</div>} </div>}
/> />
) )

3
components/item.module.css
View File

@ -76,10 +76,9 @@ a.title:visited {
.dontLike { .dontLike {
fill: #a5a5a5; fill: #a5a5a5;
margin-right: .35rem;
margin-left: -.2rem;
flex-shrink: 0; flex-shrink: 0;
cursor: pointer; cursor: pointer;
margin-right: 2px;
} }
.case { .case {

12
components/reply.module.css
View File

@ -2,6 +2,7 @@
max-width: 600px; max-width: 600px;
padding-right: 15px; padding-right: 15px;
padding-bottom: 1rem; padding-bottom: 1rem;
margin-left: 12px;
} }
.replyButtons { .replyButtons {
@ -12,6 +13,7 @@
align-items: center; align-items: center;
line-height: 1rem; line-height: 1rem;
vertical-align: middle; vertical-align: middle;
margin-left: 12px;
} }
.replyButtons > * { .replyButtons > * {
@ -48,3 +50,13 @@
margin-top: -1px; margin-top: -1px;
height: auto; height: auto;
} }
@media screen and (min-width: 768px) {
.replyButtons {
margin-left: .99px;
}
.reply {
margin-left: .99px;
}
}

10
fragments/comments.js
View File

@ -152,6 +152,16 @@ export const COMMENTS = gql`
comments { comments {
comments { comments {
...CommentFields ...CommentFields
comments {
comments {
...CommentFields
comments {
comments {
...CommentFields
}
}
}
}
} }
} }
} }

2
lib/constants.js
View File

@ -42,7 +42,7 @@ export const BOUNTY_MAX = 10000000
export const POST_TYPES = ['LINK', 'DISCUSSION', 'BOUNTY', 'POLL'] export const POST_TYPES = ['LINK', 'DISCUSSION', 'BOUNTY', 'POLL']
export const TERRITORY_BILLING_TYPES = ['MONTHLY', 'YEARLY', 'ONCE'] export const TERRITORY_BILLING_TYPES = ['MONTHLY', 'YEARLY', 'ONCE']
export const TERRITORY_GRACE_DAYS = 5 export const TERRITORY_GRACE_DAYS = 5
export const COMMENT_DEPTH_LIMIT = 6 export const COMMENT_DEPTH_LIMIT = 8
export const COMMENTS_LIMIT = 50 export const COMMENTS_LIMIT = 50
export const FULL_COMMENTS_THRESHOLD = 200 export const FULL_COMMENTS_THRESHOLD = 200
export const COMMENTS_OF_COMMENT_LIMIT = 2 export const COMMENTS_OF_COMMENT_LIMIT = 2