PaiGramTeam/luoxu-api-pub
3
0
Fork 0
mirror of https://github.com/PaiGramTeam/luoxu-api-pub.git synced 2024-11-25 09:27:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #2 from rocka/patch/ellipsis-name

Browse Source 
fix name and text overflow on mobile devices
This commit is contained in:
依云 2022-01-07 12:33:40 +08:00 committed by GitHub
commit 4fbc7572db
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 8 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/Message.svelte
View File

@ -48,8 +48,8 @@
</script>
<div class="message">
<img src="{getContext('LUOXU_URL')}/avatar/{msg.from_id}.jpg" height="64" width="64" alt="{msg.from_name} 的头像"/>
<div>
<img class="avatar" src="{getContext('LUOXU_URL')}/avatar/{msg.from_id}.jpg" height="64" width="64" alt="{msg.from_name} 的头像"/>
<div class="content">
<div class="name">{msg.from_name || ' '}</div>
<div class="text">{@html msg.html}</div>
<div class="time">{groupinfo[msg.group_id][1]} <a href={msgurl}><time datetime={iso_date} title={title}>{relative_dt}</time></a></div>
@ -66,12 +66,17 @@
border-radius: 5px;
display: flex;
}
img {
.avatar {
padding-right: 0.5em;
}
.content {
overflow: hidden;
}
.name {
white-space: nowrap;
color: #1e90ff;
overflow: hidden;
text-overflow: ellipsis;
}
.text {
white-space: pre-wrap;