usbharu
/
misskey
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

(add) scratchpad: MkStickyContainer

This commit is contained in:
kakkokari-gtyih 2023-10-24 19:54:14 +09:00
parent 868df8a82a
commit a001aa7e3f
1 changed files with 30 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
packages/frontend/src/pages/scratchpad.vue
View File

@ -4,34 +4,38 @@ SPDX-License-Identifier: AGPL-3.0-only
-->
<template>
<MkSpacer :contentMax="800">
<div :class="$style.root">
<div class="_gaps_s">
<div :class="$style.editor" class="_panel">
<MkCodeEditor v-model="code" lang="aiscript"/>
<MkStickyContainer>
<template #header><MkPageHeader/></template>
<MkSpacer :contentMax="800">
<div :class="$style.root">
<div class="_gaps_s">
<div :class="$style.editor" class="_panel">
<MkCodeEditor v-model="code" lang="aiscript"/>
</div>
<MkButton primary @click="run()"><i class="ti ti-player-play"></i></MkButton>
</div>
<MkContainer v-if="root && components.length > 1" :key="uiKey" :foldable="true">
<template #header>UI</template>
<div :class="$style.ui">
<MkAsUi :component="root" :components="components" size="small"/>
</div>
</MkContainer>
<MkContainer :foldable="true" class="">
<template #header>{{ i18n.ts.output }}</template>
<div :class="$style.logs">
<div v-for="log in logs" :key="log.id" class="log" :class="{ print: log.print }">{{ log.text }}</div>
</div>
</MkContainer>
<div class="">
{{ i18n.ts.scratchpadDescription }}
</div>
<MkButton primary @click="run()"><i class="ti ti-player-play"></i></MkButton>
</div>
<MkContainer v-if="root && components.length > 1" :key="uiKey" :foldable="true">
<template #header>UI</template>
<div :class="$style.ui">
<MkAsUi :component="root" :components="components" size="small"/>
</div>
</MkContainer>
<MkContainer :foldable="true" class="">
<template #header>{{ i18n.ts.output }}</template>
<div :class="$style.logs">
<div v-for="log in logs" :key="log.id" class="log" :class="{ print: log.print }">{{ log.text }}</div>
</div>
</MkContainer>
<div class="">
{{ i18n.ts.scratchpadDescription }}
</div>
</div>
</MkSpacer>
</MkSpacer>
</MkStickyContainer>
</template>
<script lang="ts" setup>