form to backup and restore

_pages.php

@@ -41,7 +41,9 @@ pg('help',  'cfg page-help',  'help', '/help');
 pg('about', 'cfg page-about', 'about', '/about');
 pg('term',  'term',           '', '/', 'title.term');
 
-pg('reset_screen',  'api',     '', '/api/v1/clear', 'title.term');
+pg('reset_screen',  'api',     '', '/api/v1/clear');
+pg('ini_export',  'api',     '', '/cfg/system/export');
+pg('ini_import',  'api',     '', '/cfg/system/import');
 
 pg('index',  'api',           '', '/', '');
 

lang/common.php

@@ -16,4 +16,6 @@ return [
 	'menu.restore_hard' => '',
 	'menu.reset_screen' => '',
 	'menu.index' => '',
+	'menu.ini_export' => '',
+	'menu.ini_import' => '',
 ];

lang/en.php

@@ -229,6 +229,11 @@ return [
 	'persist.restore_hard_explain' =>
 		'(This clears the WiFi config! Does not affect saved defaults or admin password.)',
 
+	'backup.title' => 'Back-up Config File',
+	'backup.explain' => 'All config except the admin password can be backed up and restored using an INI file.',
+	'backup.export' => 'Export to file',
+	'backup.import' => 'Import!',
+
 	// UART settings form
 
 	'uart.title' => 'Serial Port Parameters',

pages/cfg_system.php

@@ -27,6 +27,29 @@
 	</div>
 </div>
 
+<!-- Backup -->
+<div class="Box str mobcol">
+	<h2 tabindex=0><?= tr('backup.title') ?></h2>
+
+	<div class="Row explain nomargintop">
+		<?= tr('backup.explain') ?>
+	</div>
+
+	<div class="Row buttons2">
+		<a class="button"
+		   href="<?= e(url('ini_export')) ?>">
+			<?= tr('backup.export') ?>
+		</a>
+	</div>
+
+	<div class="Row buttons2">
+		<form method="POST" action="<?= e(url('ini_import')) ?>" enctype='multipart/form-data'>
+			<span class="filewrap"><input accept=".ini,text/plain" type="file" name="file"></span>
+			<input type="submit" value="<?= tr('backup.import') ?>">
+		</form>
+	</div>
+</div>
+
 <!-- Overclock -->
 <form class="Box str mobcol" action="<?= e(url('system_set')) ?>" method="GET" id="form-hw">
 	<h2 tabindex=0><?= tr('hwtuning.title') ?></h2>

sass/form/_form_layout.scss

@@ -110,6 +110,13 @@ form { @include naked(); }
 		border-top: 2px solid rgba(255, 255, 255, 0.1);
 	}
 
+	.filewrap {
+		background: $c-form-field-bg;
+		padding: 6px 10px;
+		border-radius: 3px;
+		border: 1px solid #666666;
+	}
+
 	textarea {
 		display: inline-block;
 		vertical-align: top;