chore(client): tweak style

This commit is contained in:
syuilo 2022-07-04 01:12:36 +09:00
parent ad4d2cec91
commit 284aa8b8ca
2 changed files with 15 additions and 3 deletions

View file

@ -6,7 +6,7 @@
<span v-for="note in notes" :key="note.id" class="item">
<img class="avatar" :src="note.user.avatarUrl" decoding="async"/>
<MkA class="text" :to="notePage(note)">
<Mfm :text="getNoteSummary(note)" :plain="true" :nowrap="true" :custom-emojis="note.emojis"/>
<Mfm class="text" :text="getNoteSummary(note)" :plain="true" :nowrap="true" :custom-emojis="note.emojis"/>
</MkA>
<span class="divider"></span>
</span>
@ -91,11 +91,18 @@ useInterval(tick, Math.max(5000, props.refreshIntervalSec * 1000), {
margin-right: 8px;
}
> .text {
> .text {
display: inline-block;
vertical-align: bottom;
}
}
> .divider {
display: inline-block;
width: 0.5px;
height: 16px;
margin: 0 1em;
margin: 0 2em;
background: currentColor;
opacity: 0;
}

View file

@ -29,25 +29,30 @@ const XUserList = defineAsyncComponent(() => import('./statusbar-user-list.vue')
<style lang="scss" scoped>
.dlrsnxqu {
--height: 24px;
--nameMargin: 10px;
background: var(--panel);
font-size: 0.85em;
&.verySmall {
--nameMargin: 7px;
--height: 16px;
font-size: 0.75em;
}
&.small {
--nameMargin: 8px;
--height: 20px;
font-size: 0.8em;
}
&.large {
--nameMargin: 12px;
--height: 26px;
font-size: 0.875em;
}
&.veryLarge {
--nameMargin: 14px;
--height: 30px;
font-size: 0.9em;
}
@ -62,7 +67,7 @@ const XUserList = defineAsyncComponent(() => import('./statusbar-user-list.vue')
contain: strict;
> .name {
padding: 0 6px;
padding: 0 var(--nameMargin);
font-weight: bold;
color: var(--accent);
}