search

AT-UI / at-ui

A fresh and flat UI-Kit specially for desktop application, made with ♥ by Vue.js 2.0 (DEPRECATED)
https://at.aotu.io
MIT License
2.34k stars 230 forks source link

How can I add newline in Modals and Notifications? #119

Closed eastrd closed 6 years ago

eastrd commented 6 years ago

For example,

<at-button type="info" size="large" icon="icon-book" hollow @click="pop_up_handbook" > Instructions

methods: { pop_up_handbook () { this.$Modal.info({ title: 'Search Engine Syntax', content: 'Hi\nThis is an example\n :)' }) } } }

The problem is, in the string in "content", if I use <br />, it will not be unescaped... If I use \n, it will be interpreted as "space" instead of "newline".

I have tried to search for solutions online, but as far as I could find, were to use v-html instead... However I couldn't figure out a way to use v-html here...

Thank you.

eastrd commented 6 years ago

Finally solved by adding white-space: pre; to the <p>'s CSS!