refactor(client): use css modules
This commit is contained in:
parent
99bdb11d24
commit
c41879c542
10 changed files with 139 additions and 147 deletions
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<MkTooltip ref="tooltip" :showing="showing" :target-element="targetElement" :max-width="340" @closed="emit('closed')">
|
||||
<div class="beeadbfb">
|
||||
<MkReactionIcon :reaction="reaction" class="icon" :no-style="true"/>
|
||||
<div class="name">{{ reaction.replace('@.', '') }}</div>
|
||||
<div :class="$style.root">
|
||||
<MkReactionIcon :reaction="reaction" :class="$style.icon" :no-style="true"/>
|
||||
<div :class="$style.name">{{ reaction.replace('@.', '') }}</div>
|
||||
</div>
|
||||
</MkTooltip>
|
||||
</template>
|
||||
|
@ -23,20 +23,20 @@ const emit = defineEmits<{
|
|||
}>();
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.beeadbfb {
|
||||
<style lang="scss" module>
|
||||
.root {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
> .icon {
|
||||
display: block;
|
||||
width: 60px;
|
||||
font-size: 60px; // unicodeな絵文字についてはwidthが効かないため
|
||||
margin: 0 auto;
|
||||
object-fit: contain;
|
||||
}
|
||||
.icon {
|
||||
display: block;
|
||||
width: 60px;
|
||||
font-size: 60px; // unicodeな絵文字についてはwidthが効かないため
|
||||
margin: 0 auto;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
> .name {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
.name {
|
||||
font-size: 0.9em;
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue