Hi @Gorgc,
It’s not beauty, but that’s works :
TEMPLATE
<div>
<i
aria-hidden="true"
v-show="showWarning"
role="presentation"
class="absolute-top-right q-pt-xs q-pr-sm material-icons q-icon notranslate text-negative"
style="font-size: 25px"
>error</i>
<q-editor
v-model="message"
:style="styleWYSIWYG"
@blur="checkMessage"
:toolbar="[
// Your config
]"
:fonts="{
// Your config
}"
/>
</div>
SCRIPT
export default {
name: "",
data() {
return {
message : "",
styleWYSIWYG: "border: 1px solid;border-color: #D1CDC8;border-radius:5px;",
styleWarningWYSIWYG: "border: 2px solid;border-color: #C10015;border-radius:5px;",
styleBasicWYSIWYG: "border: 1px solid;border-color: #D1CDC8;border-radius:5px;",
showWarning: false,
};
},
methods: {
checkMessage() {
if (this.message == "") {
this.styleWYSIWYG = this.styleWarningWYSIWYG;
this.showWarning = true;
} else {
this.styleWYSIWYG = this.styleBasicWYSIWYG;
this.showWarning = false;
}
},
}
}