skorotkiewicz/yosup
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

web: styled read thread button

Browse source
This commit is contained in:
Thomas Mathews 2022-11-18 17:57:32 -08:00 • committed by William Casarin
parent 70aab4a27c
commit 52b5dfa3e6
3 changed files with 12 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

8
web/css/styles.css
View file

@ -277,6 +277,14 @@ details.cw summary {
.thread-collapsed { .thread-collapsed {
padding: 15px; padding: 15px;
} }
.thread-summary {
text-align: center;
}
.thread-summary img.icon {
opacity: 0.6;
position: relative;
top: 1px;
}
/* Modal */ /* Modal */
.modal { .modal {

1
web/icon/read-more.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M55.1 241.9L192 120.2l136 121.6c4.563 4.094 10.28 6.125 16 6.125c6.594 0 13.16-2.687 17.88-7.1c8.844-9.874 8-25.06-1.875-33.87L208 70.14c-9.125-8.187-22.88-8.187-32 0L23.99 206.1C14.12 214.9 13.28 230.1 22.12 240C30.93 249.9 46.15 250.7 55.1 241.9zM208 262.1c-9.125-8.187-22.88-8.187-32 0l-152 135.1c-9.875 8.812-10.72 23.1-1.875 33.87c8.813 9.906 24.03 10.72 33.88 1.875L192 312.2l136 121.6c4.563 4.094 10.28 6.125 16 6.125c6.594 0 13.16-2.687 17.88-7.1c8.844-9.874 8-25.06-1.875-33.87L208 262.1z"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 745 B

5
web/js/ui/render.js
View file

@ -33,8 +33,9 @@ function render_thread_collapsed(model, ev, opts)
if (opts.is_composing) if (opts.is_composing)
return "" return ""
return `<div onclick="expand_thread('${ev.id}')" class="thread-collapsed"> return `<div onclick="expand_thread('${ev.id}')" class="thread-collapsed">
<div class="thread-summary clickable"> <div class="thread-summary clickable event-message">
▲ More Read More
<img class="icon small" src="icon/read-more.svg"/>
</div> </div>
</div>` </div>`
} }