diff --git a/src/client/app/common/views/components/ui/textarea.vue b/src/client/app/common/views/components/ui/textarea.vue index c1814231d5..0bdd4aadd0 100644 --- a/src/client/app/common/views/components/ui/textarea.vue +++ b/src/client/app/common/views/components/ui/textarea.vue @@ -145,6 +145,9 @@ root(fill) font-size 13px opacity 0.7 + &:empty + display none + * margin 0 diff --git a/src/client/app/test/views/index.vue b/src/client/app/test/views/index.vue index be75f8ae8f..8e5db93c48 100644 --- a/src/client/app/test/views/index.vue +++ b/src/client/app/test/views/index.vue @@ -6,9 +6,14 @@ <ui-textarea v-model="mfm"> <span>MFM</span> </ui-textarea> - <div> - <misskey-flavored-markdown :text="mfm" :i="$store.state.i"/> - </div> + </section> + <section> + <header>Preview</header> + <misskey-flavored-markdown :text="mfm" :i="$store.state.i"/> + </section> + <section> + <header style="margin-bottom:0;">AST</header> + <ui-textarea v-model="mfmAst" readonly tall style="margin-top:16px;"></ui-textarea> </section> </ui-card> @@ -16,8 +21,9 @@ <div slot="title">Dialog Generator</div> <section class="fit-top"> <ui-select v-model="dialogType" placeholder=""> - <option value="info">Info</option> + <option value="info">Information</option> <option value="success">Success</option> + <option value="warning">Warning</option> <option value="error">Error</option> </ui-select> <ui-input v-model="dialogTitle"> @@ -35,6 +41,8 @@ <script lang="ts"> import Vue from 'vue'; +import parse from '../../../../mfm/parse'; +import * as JSON5 from 'json5'; export default Vue.extend({ data() { @@ -47,6 +55,12 @@ export default Vue.extend({ }; }, + computed: { + mfmAst(): any { + return JSON5.stringify(parse(this.mfm), null, 2); + } + }, + methods: { showDialog() { this.$root.alert({