tyler.durden/dashy
1
0
Fork 0
mirror of https://github.com/Lissy93/dashy.git synced 2025-04-08 17:06:18 +02:00
Code Issues Packages Projects Releases Wiki Activity

Adds sytnax highlighting to the YAML export

Browse Source
This commit is contained in:
Alicia Sykes 2021-05-31 16:10:12 +01:00
parent fdde53588e
commit 0edf235178
2 changed files with 21 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -11,6 +11,7 @@
"axios": "^0.21.1",
"connect": "^3.7.0",
"crypto-js": "^4.0.0",
"highlight.js": "^11.0.0",
"register-service-worker": "^1.6.2",
"remedial": "^1.0.8",
"serve-static": "^1.14.1",

20
src/components/Configuration/ConfigContainer.vue
View File

@ -57,6 +57,10 @@
<script>
import hljs from 'highlight.js/lib/core';
import yaml from 'highlight.js/lib/languages/yaml';
import 'highlight.js/styles/mono-blue.css';
import JsonToYaml from '@/utils/JsonToYaml';
import { localStorageKeys, modalNames } from '@/utils/defaults';
import EditSiteMeta from '@/components/Configuration/EditSiteMeta';
@ -127,6 +131,11 @@ export default {
}
},
},
mounted() {
hljs.registerLanguage('yaml', yaml);
const highlighted = hljs.highlight(this.jsonParser(this.config), { language: 'yaml' }).value;
document.getElementById('conf-yaml').innerHTML = highlighted;
},
};
</script>
@ -135,6 +144,7 @@ export default {
pre {
color: var(--config-code-color);
font-weight: bold !important;
padding: 0.5rem 1rem;
}
@ -172,6 +182,12 @@ a.config-button, button.config-button {
div.code-container {
background: var(--config-code-background);
#conf-yaml {
font-family: 'Inconsolata', sans-serif;
.hljs-attr {
font-weight: bold !important;
}
}
.yaml-action-buttons {
position: absolute;
top: 0.5rem;
@ -282,4 +298,8 @@ a.hyperlink-wrapper {
background: var(--config-settings-color);
}
}
#conf-yaml .hljs-attr {
color: #9c03f5;
}
</style>