Improve responsiveness of channel name and topic.

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

View File

@ -35,7 +35,11 @@
<span type="button" aria-label="Save topic"></span>
</span>
</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
v-if="channel.topic"
:network="network"

View File

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