supernets/hardlounge
supernets/hardlounge
4
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Improve responsiveness of channel name and topic.

Browse Source 
This commit makes two changes:

1. Long channel names are truncated.
2. Topics cannot be shrinked into non-existence.
This commit is contained in:
itsjohncs 2021-10-22 13:52:51 -07:00
parent 3ba7fb6de4
commit 56d4a6afde
2 changed files with 15 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
client/components/Chat.vue
View File

@ -35,7 +35,11 @@
<span type="button" aria-label="Save topic"></span> <span type="button" aria-label="Save topic"></span>
</span> </span>
</div> </div>
<span v-else :title="channel.topic" class="topic" @dblclick="editTopic" <span
v-else
:title="channel.topic"
:class="{topic: true, empty: !channel.topic}"
@dblclick="editTopic"
><ParsedMessage ><ParsedMessage
v-if="channel.topic" v-if="channel.topic"
:network="network" :network="network"

11
client/css/style.css
View File

@ -1051,7 +1051,10 @@ textarea.input {
.header .title { .header .title {
font-size: 15px; font-size: 15px;
padding-left: 6px; padding-left: 6px;
flex-shrink: 0; flex-shrink: 1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} }
.topic-container { .topic-container {
@ -1067,6 +1070,12 @@ textarea.input {
flex-grow: 1; flex-grow: 1;
overflow: hidden; overflow: hidden;
font-size: 14px; font-size: 14px;
flex-shrink: 99999999;
min-width: 25px;
}
.header .topic.empty {
min-width: 0;
} }
.header .topic-input { .header .topic-input {