diff --git a/package.json b/package.json index 8d5cd449e3996e4e029c2931b41bf9dab73fe6f7..876205ca49ff415ab45d6663e80dd153030149d8 100644 --- a/package.json +++ b/package.json @@ -52,6 +52,7 @@ "localforage": "^1.7.3", "lodash": "^4.17.11", "lodash.debounce": "^4.0.8", + "marked": "^0.8.0", "moment": "^2.24.0", "normalize.css": "7.0.0", "nprogress": "0.2.0", diff --git a/src/views/settings/components/Inputs.vue b/src/views/settings/components/Inputs.vue index 760d2c2cd847989d97cd2eb8cbce790a1f0458c8..1f5a79c6fa6760a5abed9e355db1965a195829c0 100644 --- a/src/views/settings/components/Inputs.vue +++ b/src/views/settings/components/Inputs.vue @@ -77,7 +77,11 @@ <prune-input v-if="setting.key === ':prune'" :data="data[setting.key]" :setting-group="settingGroup" :setting="setting"/> <rate-limit-input v-if="settingGroup.key === ':rate_limit'" :data="data" :setting-group="settingGroup" :setting="setting"/> <!--------------------> - <p v-if="setting.type !== 'keyword'" :class="inputClass" class="expl">{{ setting.description }}</p> + <span + v-if="setting.description && setting.type !== 'keyword'" + :class="inputClass" + class="expl" + v-html="getFormattedDescription(setting.description)"/> </el-form-item> </template> @@ -86,6 +90,7 @@ import i18n from '@/lang' import { AutoLinkerInput, EditableKeywordInput, IconsInput, MascotsInput, MultipleSelect, ProxyUrlInput, PruneInput, RateLimitInput } from './inputComponents' import { processNested } from '@/store/modules/normalizers' import _ from 'lodash' +import marked from 'marked' export default { name: 'Inputs', @@ -203,6 +208,9 @@ export default { type === 'map' || (Array.isArray(type) && type.includes('keyword') && type.findIndex(el => el.includes('list') && el.includes('string')) !== -1) }, + getFormattedDescription(desc) { + return marked(desc) + }, processNestedData(value, group, parentKey, parents) { const { valueForState, valueForUpdatedSettings, diff --git a/src/views/settings/components/Setting.vue b/src/views/settings/components/Setting.vue index fb7b2252bbf3f2487c17667dd45501e8cf7b360d..82f8419f9c7109101bc63932f833f5fed436f458 100644 --- a/src/views/settings/components/Setting.vue +++ b/src/views/settings/components/Setting.vue @@ -1,7 +1,7 @@ <template> <div v-if="!loading"> <el-form-item v-if="settingGroup.description" class="description-container"> - <p class="description">{{ settingGroup.description }}</p> + <span class="description" v-html="getFormattedDescription(settingGroup.description)"/> </el-form-item> <div v-if="settingGroup.key === 'Pleroma.Emails.Mailer'"> <div v-for="setting in settingGroup.children.filter(setting => !setting.group)" :key="setting.key"> @@ -65,6 +65,7 @@ import Inputs from './Inputs' import i18n from '@/lang' import _ from 'lodash' +import marked from 'marked' export default { name: 'Setting', @@ -107,6 +108,9 @@ export default { type.includes('keyword') || key === ':replace' }, + getFormattedDescription(desc) { + return marked(desc) + }, async removeSetting(key) { const config = this.settingGroup.key ? [{ group: this.settingGroup.group, key: this.settingGroup.key, delete: true, subkeys: [key] }] diff --git a/yarn.lock b/yarn.lock index d75e92b1ca3fb3cb6e4aa79aae958494c000164e..9a72fd1c2312b1a56abd645c9cbf1e96c6cf9d34 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6348,6 +6348,11 @@ markdown-it@^8.4.0: mdurl "^1.0.1" uc.micro "^1.0.5" +marked@^0.8.0: + version "0.8.0" + resolved "https://registry.yarnpkg.com/marked/-/marked-0.8.0.tgz#ec5c0c9b93878dc52dd54be8d0e524097bd81a99" + integrity sha512-MyUe+T/Pw4TZufHkzAfDj6HarCBWia2y27/bhuYkTaiUnfDYFnCP3KUN+9oM7Wi6JA2rymtVYbQu3spE0GCmxQ== + md5.js@^1.3.4: version "1.3.5" resolved "https://registry.yarnpkg.com/md5.js/-/md5.js-1.3.5.tgz#b5d07b8e3216e3e27cd728d72f70d1e6a342005f"