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

fix long titles not wrapping on large displays

Browse Source
This commit is contained in:
keyan 2021-07-14 17:24:19 -05:00
parent d826dfd9c9
commit 062d5442b8
2 changed files with 4 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
components/item.js
View File

@ -15,9 +15,9 @@ export default function Item ({ item, rank, children }) {
<div className={styles.item}> <div className={styles.item}>
<UpVote itemId={item.id} meSats={item.meSats} className={styles.upvote} /> <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`}>
<Link href={`/items/${item.id}`} passHref> <Link href={`/items/${item.id}`} passHref>
<a className={`${styles.title} text-reset flex-md-shrink-0 mr-2`}>{item.title}</a> <a className={`${styles.title} text-reset mr-2`}>{item.title}</a>
</Link> </Link>
{item.url && {item.url &&
<a <a

3
components/item.module.css
View File

@ -1,7 +1,7 @@
.title { .title {
font-weight: 500; font-weight: 500;
white-space: normal; white-space: normal;
margin-right: .5rem; max-width: 100%;
} }
.upvote { .upvote {
@ -13,6 +13,7 @@
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
flex: 1 0 128px;
} }
.other { .other {