usbharu
/
misskey
mirror of https://github.com/misskey-dev/misskey.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

flash: sticky buttons 

* sticky save buttons

* fix

* add spacer

* fix design
This commit is contained in:
FineArchs 2024-08-18 07:35:54 +09:00 committed by GitHub
parent e790aa0548
commit 761b0a3ac2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 22 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
packages/frontend/src/pages/flash/flash-edit.vue
View File

@ -11,6 +11,12 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkInput v-model="title"> <MkInput v-model="title">
<template #label>{{ i18n.ts._play.title }}</template> <template #label>{{ i18n.ts._play.title }}</template>
</MkInput> </MkInput>
<MkSelect v-model="visibility">
<template #label>{{ i18n.ts.visibility }}</template>
<template #caption>{{ i18n.ts._play.visibilityDescription }}</template>
<option :key="'public'" :value="'public'">{{ i18n.ts.public }}</option>
<option :key="'private'" :value="'private'">{{ i18n.ts.private }}</option>
</MkSelect>
<MkTextarea v-model="summary" :mfmAutocomplete="true" :mfmPreview="true"> <MkTextarea v-model="summary" :mfmAutocomplete="true" :mfmPreview="true">
<template #label>{{ i18n.ts._play.summary }}</template> <template #label>{{ i18n.ts._play.summary }}</template>
</MkTextarea> </MkTextarea>
@ -18,19 +24,19 @@ SPDX-License-Identifier: AGPL-3.0-only
<MkCodeEditor v-model="script" lang="is"> <MkCodeEditor v-model="script" lang="is">
<template #label>{{ i18n.ts._play.script }}</template> <template #label>{{ i18n.ts._play.script }}</template>
</MkCodeEditor> </MkCodeEditor>
<MkSelect v-model="visibility"> </div>
<template #label>{{ i18n.ts.visibility }}</template> </MkSpacer>
<template #caption>{{ i18n.ts._play.visibilityDescription }}</template> <template #footer>
<option :key="'public'" :value="'public'">{{ i18n.ts.public }}</option> <div :class="$style.footer">
<option :key="'private'" :value="'private'">{{ i18n.ts.private }}</option> <MkSpacer>
</MkSelect>
<div class="_buttons"> <div class="_buttons">
<MkButton primary @click="save"><i class="ti ti-check"></i> {{ i18n.ts.save }}</MkButton> <MkButton primary @click="save"><i class="ti ti-check"></i> {{ i18n.ts.save }}</MkButton>
<MkButton @click="show"><i class="ti ti-eye"></i> {{ i18n.ts.show }}</MkButton> <MkButton @click="show"><i class="ti ti-eye"></i> {{ i18n.ts.show }}</MkButton>
<MkButton v-if="flash" danger @click="del"><i class="ti ti-trash"></i> {{ i18n.ts.delete }}</MkButton> <MkButton v-if="flash" danger @click="del"><i class="ti ti-trash"></i> {{ i18n.ts.delete }}</MkButton>
</div> </div>
</div>
</MkSpacer> </MkSpacer>
</div>
</template>
</MkStickyContainer> </MkStickyContainer>
</template> </template>
@ -459,3 +465,8 @@ definePageMetadata(() => ({
title: flash.value ? `${i18n.ts._play.edit}: ${flash.value.title}` : i18n.ts._play.new, title: flash.value ? `${i18n.ts._play.edit}: ${flash.value.title}` : i18n.ts._play.new,
})); }));
</script> </script>
<style lang="scss" module>
.footer {
background: var(--panel);
}
</style>