fix(client): make emoji stand out more on reaction button

Fix #8520
Close #8521

Co-Authored-By: Johann150 <20990607+Johann150@users.noreply.github.com>
This commit is contained in:
syuilo 2022-05-19 23:23:12 +09:00
parent 68f9341e95
commit b811de53b6

View file

@ -7,8 +7,8 @@
:class="{ reacted: note.myReaction == reaction, canToggle }" :class="{ reacted: note.myReaction == reaction, canToggle }"
@click="toggleReaction()" @click="toggleReaction()"
> >
<XReactionIcon :reaction="reaction" :custom-emojis="note.emojis"/> <XReactionIcon class="icon" :reaction="reaction" :custom-emojis="note.emojis"/>
<span>{{ count }}</span> <span class="count">{{ count }}</span>
</button> </button>
</template> </template>
@ -141,12 +141,16 @@ export default defineComponent({
background: var(--accent); background: var(--accent);
} }
> span { > .count {
color: var(--fgOnAccent); color: var(--fgOnAccent);
} }
> .icon {
filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.5));
}
} }
> span { > .count {
font-size: 0.9em; font-size: 0.9em;
line-height: 32px; line-height: 32px;
margin: 0 0 0 4px; margin: 0 0 0 4px;