Mizah/mizzkey
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

🎨 CWボタンを大きく

Browse source
This commit is contained in:
syuilo 2023-10-10 18:08:54 +09:00
parent d81c833775
commit f5e72f7d3e
2 changed files with 5 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
packages/frontend/src/components/MkCwButton.vue
View file

@ -4,10 +4,7 @@ SPDX-License-Identifier: AGPL-3.0-only
--> -->
<template> <template>
<button class="_button" :class="$style.root" @mousedown="toggle"> <MkButton rounded full small @click="toggle"><b>{{ modelValue ? i18n.ts._cw.hide : i18n.ts._cw.show }}</b><span v-if="!modelValue" :class="$style.label">{{ label }}</span></MkButton>
<b>{{ modelValue ? i18n.ts._cw.hide : i18n.ts._cw.show }}</b>
<span v-if="!modelValue" :class="$style.label">{{ label }}</span>
</button>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
@ -15,6 +12,7 @@ import { computed } from 'vue';
import * as Misskey from 'misskey-js'; import * as Misskey from 'misskey-js';
import { concat } from '@/scripts/array.js'; import { concat } from '@/scripts/array.js';
import { i18n } from '@/i18n.js'; import { i18n } from '@/i18n.js';
import MkButton from '@/components/MkButton.vue';
const props = defineProps<{ const props = defineProps<{
modelValue: boolean; modelValue: boolean;
@ -33,25 +31,12 @@ const label = computed(() => {
] as string[][]).join(' / '); ] as string[][]).join(' / ');
}); });
const toggle = () => { function toggle() {
emit('update:modelValue', !props.modelValue); emit('update:modelValue', !props.modelValue);
}; }
</script> </script>
<style lang="scss" module> <style lang="scss" module>
.root {
display: inline-block;
padding: 4px 8px;
font-size: 0.7em;
color: var(--cwFg);
background: var(--cwBg);
border-radius: 2px;
&:hover {
background: var(--cwHoverBg);
}
}
.label { .label {
margin-left: 4px; margin-left: 4px;

2
packages/frontend/src/components/MkNote.vue
View file

@ -54,7 +54,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<div style="container-type: inline-size;"> <div style="container-type: inline-size;">
<p v-if="appearNote.cw != null" :class="$style.cw"> <p v-if="appearNote.cw != null" :class="$style.cw">
<Mfm v-if="appearNote.cw != ''" style="margin-right: 8px;" :text="appearNote.cw" :author="appearNote.user" :i="$i"/> <Mfm v-if="appearNote.cw != ''" style="margin-right: 8px;" :text="appearNote.cw" :author="appearNote.user" :i="$i"/>
<MkCwButton v-model="showContent" :note="appearNote"/> <MkCwButton v-model="showContent" :note="appearNote" style="margin: 4px 0;"/>
</p> </p>
<div v-show="appearNote.cw == null || showContent" :class="[{ [$style.contentCollapsed]: collapsed }]"> <div v-show="appearNote.cw == null || showContent" :class="[{ [$style.contentCollapsed]: collapsed }]">
<div :class="$style.text"> <div :class="$style.text">