fix notseen badge on thread

This commit is contained in:
grimhilt 2023-04-11 16:19:53 +02:00
parent 3357009d6a
commit 4d7a919054
2 changed files with 12 additions and 3 deletions

View File

@ -74,11 +74,9 @@ const router = useRouter();
.object { .object {
color: var(--secondary-text); color: var(--secondary-text);
line-height: 1.8rem;
font-size: 1.3rem; font-size: 1.3rem;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
width: 100%;
} }
</style> </style>

View File

@ -17,13 +17,14 @@ const router = useRouter();
v-bind:class="store.state.activeRoom == props.threadId ? 'selected' : ''" v-bind:class="store.state.activeRoom == props.threadId ? 'selected' : ''"
class="room" class="room"
> >
{{ room.roomName }} <div class="roomName">{{ room.roomName }}</div>
<Badge class="badge" v-if="room.notSeen > 0" :value="room.notSeen" type="badge-number" /> <Badge class="badge" v-if="room.notSeen > 0" :value="room.notSeen" type="badge-number" />
</div> </div>
</template> </template>
<style scoped> <style scoped>
.room { .room {
display: flex;
box-sizing: border-box; box-sizing: border-box;
contain: content; contain: content;
display: flex; display: flex;
@ -33,6 +34,16 @@ const router = useRouter();
color: var(--secondary-text); color: var(--secondary-text);
} }
.badge {
margin-right: 7px;
}
.roomName {
flex: 1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.room:hover, .room:hover,
.selected { .selected {
background-color: var(--selected); background-color: var(--selected);