tinymce / tinymce-vue

Official TinyMCE Vue component
MIT License
2.01k stars 202 forks source link

Height doesnt get applied? #382

Open LaupWing opened 1 year ago

LaupWing commented 1 year ago
<template>
   <div 
      class="my-4 w-full cursor-pointer relative hover:border-highlight border"
      :class="template.is_new 
         ? 'border-highlight shadow shadow-highlight' 
         : 'border-border' 
      "
      @click="showModal = true"
   >
      <TemplatesModal
         v-if="showModal"
         :template="template"
         @close="showModal = false"
         @saved="$emit('saved', $event)"
      />
      <div class="pointer-events-none">
         <Editor
            v-model="template.content"
            :disabled="true"
            :init="settings"
            :apiKey="config.tiny_api_key"
         />
      </div>
   </div>
</template>

<script setup lang="ts">
export interface Props {
   template: Template
}
import type { Template } from "@/typings"
import Editor from "@tinymce/tinymce-vue"
import { ref } from "vue"
import { TemplatesModal } from "@/components/Modals"
import config from "@/config"

defineEmits(["saved"])

const settings = {
   plugins: "autoresize",
   menubar: false,
   statusbar: false,
   height: "auto" // 500 also doesnt work,
   toolbar: false,
   auto_resize: true,
   resize: "both",
   content_style: config.templates.templateCss,
}

defineProps<Props>()

const showModal = ref(false)

</script>
LaupWing commented 1 year ago

There is an automatic height assigned to the editor element

TinyITAdmin commented 1 year ago

Ref: INT-3187