diff --git a/src/component/data/index.js b/src/component/data/index.js
index 78fc90e7..0baba798 100644
--- a/src/component/data/index.js
+++ b/src/component/data/index.js
@@ -75,7 +75,7 @@ data.validateFile = (fileList, input, feedback) => {
});
const importModal = new Modal({
- heading: 'Data to import',
+ heading: 'Restoring from a ' + appName + ' backup',
content: importForm.form(),
successText: 'Import',
width: 'small',
diff --git a/src/component/importForm/index.js b/src/component/importForm/index.js
index 8d73e6ca..d0cc726a 100644
--- a/src/component/importForm/index.js
+++ b/src/component/importForm/index.js
@@ -29,7 +29,11 @@ export const ImportForm = function({
this.element = {
form: node('form|class:import-form'),
- description: node('p:Import all or part of the backup:|class:mb-5')
+ description: complexNode({
+ tag: 'p',
+ text: 'You can restore all or parts of the backup file. The following data will be restored:',
+ attr: [{ key: 'class', value: 'mb-5' }]
+ })
};
this.count = {
@@ -46,19 +50,12 @@ export const ImportForm = function({
this.control = {
import: {
- setup: new Control_checkbox({
- object: state,
- path: 'setup',
- id: 'setup',
- labelText: 'Settings',
- description: 'This includes Layout size and position, Header setup and other user settings.'
- }),
bookmark: new Control_checkbox({
object: state,
path: 'bookmark',
id: 'bookmark',
labelText: 'Bookmarks',
- description: [`This includes ${this.count.bookmark()} ${this.count.bookmark() > 1 ? `Bookmarks` : `Bookmark`} in ${dataToImport.bookmark.length} ${dataToImport.bookmark.length > 1 ? `Groups` : `Group`}.`, 'Bookmarks will keep any custom Colours, Accents and Borders when imported.']
+ description: [`This includes ${this.count.bookmark()} ${this.count.bookmark() > 1 ? `Bookmarks` : `Bookmark`} in ${dataToImport.bookmark.length} ${dataToImport.bookmark.length > 1 ? `Groups` : `Group`}.`, 'Bookmarks will keep any custom Colours, Accents and Borders when imported.']
}),
theme: new Control_checkbox({
object: state,
@@ -66,6 +63,13 @@ export const ImportForm = function({
id: 'theme',
labelText: 'Theme',
description: 'This includes the Colour, Accent, Fonts, Background and any saved Custom Themes.'
+ }),
+ setup: new Control_checkbox({
+ object: state,
+ path: 'setup',
+ id: 'setup',
+ labelText: 'Settings',
+ description: 'This includes Layout size and position, Header area size, Bookmark area size and other user settings.'
})
}
};
@@ -76,9 +80,9 @@ export const ImportForm = function({
this.element.form.append(node('div', [
this.element.description,
- this.control.import.setup.wrap(),
this.control.import.bookmark.wrap(),
- this.control.import.theme.wrap()
+ this.control.import.theme.wrap(),
+ this.control.import.setup.wrap()
]));
};