refactor(client): use css modules

This commit is contained in:
syuilo 2023-01-10 08:48:37 +09:00
parent 72dfbfcf35
commit f3c0af7e23
3 changed files with 7 additions and 8 deletions

View file

@ -80,7 +80,6 @@ export default defineComponent({
} else {
if (props.ad && item._shouldInsertAd_) {
return [h(MkAd, {
class: 'a', // advertise()
key: item.id + ':ad',
prefer: ['horizontal', 'horizontal-big'],
}), el];

View file

@ -4,7 +4,7 @@
v-show="!isDeleted"
ref="el"
v-hotkey="keymap"
:class="[$style.root, { [$style.isRenote]: isRenote }]"
:class="$style.root"
:tabindex="!isDeleted ? '-1' : null"
>
<MkNoteSub v-if="appearNote.reply" :note="appearNote.reply" :class="$style.replyTo"/>

View file

@ -8,9 +8,9 @@
</template>
<template #default="{ items: notes }">
<div class="giivymft" :class="{ noGap }">
<MkDateSeparatedList ref="notes" v-slot="{ item: note }" :items="notes" :direction="pagination.reversed ? 'up' : 'down'" :reversed="pagination.reversed" :no-gap="noGap" :ad="true" class="notes">
<XNote :key="note._featuredId_ || note._prId_ || note.id" class="qtqtichx" :note="note"/>
<div :class="[$style.root, { [$style.noGap]: noGap }]">
<MkDateSeparatedList ref="notes" v-slot="{ item: note }" :items="notes" :direction="pagination.reversed ? 'up' : 'down'" :reversed="pagination.reversed" :no-gap="noGap" :ad="true" :class="$style.notes">
<XNote :key="note._featuredId_ || note._prId_ || note.id" :class="$style.note" :note="note"/>
</MkDateSeparatedList>
</div>
</template>
@ -36,8 +36,8 @@ defineExpose({
});
</script>
<style lang="scss" scoped>
.giivymft {
<style lang="scss" module>
.root {
&.noGap {
> .notes {
background: var(--panel);
@ -48,7 +48,7 @@ defineExpose({
> .notes {
background: var(--bg);
.qtqtichx {
.note {
background: var(--panel);
border-radius: var(--radius);
}