tanner/qotnews
1
0
Fork 1
Code Issues Pull Requests Releases Wiki Activity

Show exerpt of hidden comments

Browse Source
This commit is contained in:
Tanner Collin 2020-10-27 00:41:36 +00:00
parent 99d3a234f4
commit 72802a6fcf
2 changed files with 22 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
webclient/src/Comments.js
View File

@ -93,7 +93,7 @@ class Article extends React.Component {
</p> </p>
</div> </div>
<div className='text' dangerouslySetInnerHTML={{ __html: c.text }} /> <div className={collapsed ? 'text hidden' : 'text'} dangerouslySetInnerHTML={{ __html: c.text }} />
{hidden && hasChildren ? {hidden && hasChildren ?
<div className='comment lined info pointer' onClick={() => this.expandComment(cid)}>[show {this.countComments(c)-1} more]</div> <div className='comment lined info pointer' onClick={() => this.expandComment(cid)}>[show {this.countComments(c)-1} more]</div>

30
webclient/src/Style-light.css
View File

@ -159,6 +159,27 @@ span.source {
margin-top: -0.5rem; margin-top: -0.5rem;
} }
.comment .text.hidden > p {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: none;
color: #828282;
}
.comment .text.hidden > p:first-child {
display: block;
}
.comment .collapser {
padding-left: 0.5rem;
padding-right: 1.5rem;
}
.comment .pointer {
cursor: pointer;
}
.toggleDot { .toggleDot {
position: fixed; position: fixed;
bottom: 1rem; bottom: 1rem;
@ -197,12 +218,3 @@ span.source {
.search form { .search form {
display: inline; display: inline;
} }
.collapser {
padding-left: 0.5rem;
padding-right: 1.5rem;
}
.pointer {
cursor: pointer;
}