worldcone/cherrypick
2
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

tweak 3996b614

Browse source
This commit is contained in:
NoriDev 2023-09-01 17:08:43 +09:00
parent 3996b61420
commit f772619791
2 changed files with 9 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
packages/frontend/src/components/MkFolder.vue
View file

@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
<div ref="rootEl" :class="$style.root" role="group" :aria-expanded="opened">
<MkStickyContainer>
<template #header>
<div :class="[$style.header, { [$style.opened]: opened }]" class="_button" role="button" data-cy-folder-header @click="toggle">
<div :class="[$style.header, { [$style.opened]: opened, [$style.inactive]: inactive }]" class="_button" role="button" data-cy-folder-header @click="toggle">
<div :class="$style.headerIcon"><slot name="icon"></slot></div>
<div :class="$style.headerText">
<div>
@ -19,6 +19,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</div>
<div :class="$style.headerRight">
<span :class="$style.headerRightText"><slot name="suffix"></slot></span>
<i v-if="inactive" class="ti ti-archive icon"></i>
<i v-if="opened" class="ti ti-chevron-up icon"></i>
<i v-else class="ti ti-chevron-down icon"></i>
</div>
@ -56,9 +57,11 @@ import { defaultStore } from '@/store';
const props = withDefaults(defineProps<{
defaultOpen?: boolean;
maxHeight?: number | null;
inactive?: boolean;
}>(), {
defaultOpen: false,
maxHeight: null,
inactive: false,
});
const getBgColor = (el: HTMLElement) => {
@ -155,6 +158,10 @@ onMounted(() => {
&.opened {
border-radius: 6px 6px 0 0;
}
&.inactive {
opacity: 0.7;
}
}
.headerUpper {

3
packages/frontend/src/pages/admin/announcements.vue
View file

@ -10,10 +10,9 @@ SPDX-License-Identifier: AGPL-3.0-only
<div class="_gaps">
<MkInfo v-if="announcements.length > 5" warn>{{ i18n.ts._announcement.tooManyActiveAnnouncementDescription }}</MkInfo>
<MkFolder v-for="announcement in announcements" :key="announcement.id ?? announcement._id" :defaultOpen="announcement.id == null">
<MkFolder v-for="announcement in announcements" :key="announcement.id ?? announcement._id" :defaultOpen="announcement.id == null" :inactive="announcement.id && !announcement.isActive">
<template #label>{{ announcement.title }}</template>
<template #icon>
<i v-if="announcement.id && !announcement.isActive" class="ti ti-archive"></i>
<i v-if="announcement.icon === 'info'" class="ti ti-info-circle"></i>
<i v-else-if="announcement.icon === 'warning'" class="ti ti-alert-triangle" style="color: var(--warn);"></i>
<i v-else-if="announcement.icon === 'error'" class="ti ti-circle-x" style="color: var(--error);"></i>