diff options
Diffstat (limited to 'apps/files/src/components/CustomSvgIconRender.vue')
| -rw-r--r-- | apps/files/src/components/CustomSvgIconRender.vue | 63 |
1 files changed, 63 insertions, 0 deletions
diff --git a/apps/files/src/components/CustomSvgIconRender.vue b/apps/files/src/components/CustomSvgIconRender.vue new file mode 100644 index 00000000000..f025319946f --- /dev/null +++ b/apps/files/src/components/CustomSvgIconRender.vue @@ -0,0 +1,63 @@ +<!-- + - @copyright Copyright (c) 2019 Gary Kim <gary@garykim.dev> + - + - @author Gary Kim <gary@garykim.dev> + - + - @license GNU AGPL version 3 or any later version + - + - This program is free software: you can redistribute it and/or modify + - it under the terms of the GNU Affero General Public License as + - published by the Free Software Foundation, either version 3 of the + - License, or (at your option) any later version. + - + - This program is distributed in the hope that it will be useful, + - but WITHOUT ANY WARRANTY; without even the implied warranty of + - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + - GNU Affero General Public License for more details. + - + - You should have received a copy of the GNU Affero General Public License + - along with this program. If not, see <http://www.gnu.org/licenses/>. + - + --> +<template> + <span class="custom-svg-icon" /> +</template> + +<script> +// eslint-disable-next-line import/named +import { sanitize } from 'dompurify' + +export default { + name: 'CustomSvgIconRender', + props: { + svg: { + type: String, + required: true, + }, + }, + mounted() { + this.$el.innerHTML = sanitize(this.svg) + }, +} +</script> +<style lang="scss" scoped> +.custom-svg-icon { + display: flex; + align-items: center; + align-self: center; + justify-content: center; + justify-self: center; + width: 44px; + height: 44px; + opacity: 1; + + ::v-deep svg { + // mdi icons have a size of 24px + // 22px results in roughly 16px inner size + height: 22px; + width: 22px; + fill: currentColor; + } +} + +</style> |