diff --git a/src/components/Configuration/ConfigContainer.vue b/src/components/Configuration/ConfigContainer.vue index a36a1b85..2a3a3f74 100644 --- a/src/components/Configuration/ConfigContainer.vue +++ b/src/components/Configuration/ConfigContainer.vue @@ -37,10 +37,8 @@ You are using a very small screen, and some screens in this menu may not be optimal
Note:
- All changes made here are stored locally. To apply globally, either export your config - into your conf.yml file, or use the cloud backup/ restore feature. + It is recommend to make a backup of your conf.yml file, before making any changes.{{this.jsonParser(this.config)}}
+ {{yaml}}
@@ -104,6 +104,9 @@ export default {
sections: function getSections() {
return this.config.sections;
},
+ yaml() {
+ return this.jsonParser(this.config);
+ },
},
components: {
EditSiteMeta,
@@ -157,6 +160,16 @@ export default {
}, 1900);
}
},
+ /* Generates a new file, with the YAML contents, and triggers a download */
+ downloadConfigFile(filename, filecontents) {
+ const element = document.createElement('a');
+ element.setAttribute('href', `data:text/plain;charset=utf-8, ${encodeURIComponent(filecontents)}`);
+ element.setAttribute('download', filename);
+ element.style.display = 'none';
+ document.body.appendChild(element);
+ element.click();
+ document.body.removeChild(element);
+ },
},
mounted() {
hljs.registerLanguage('yaml', yaml);
@@ -288,14 +301,16 @@ a.hyperlink-wrapper {
border: 1px dashed var(--config-settings-color);
border-radius: var(--curve-factor);
text-align: left;
- opacity: 0.95;
+ opacity: var(--dimming-factor);
color: var(--config-settings-color);
background: var(--config-settings-background);
+ cursor: default;
p.sub-title {
font-weight: bold;
margin: 0;
display: inline;
}
+ &:hover { opacity: 1; }
display: none;
@include tablet-up { display: block; }
}