Add option to reset colors

src/UI/UIWindowThemeDialog.js

@@ -46,6 +46,22 @@ const UIWindowThemeDialog = async function UIWindowThemeDialog () {
     });
     const w_body = w.querySelector('.window-body');
 
+    const Button = ({ label }) => {
+        const el = document.createElement('button');
+        el.textContent = label ?? i18n('reset');
+        el.classList.add('button', 'button-block');
+        return {
+            appendTo (parent) {
+                parent.appendChild(el);
+                return this;
+            },
+            onPress (cb) {
+                el.addEventListener('click', cb);
+                return this;
+            },
+        };
+    }
+
     const Slider = ({ name, label, min, max, initial, step }) => {
         label = label ?? name;
         const wrap = document.createElement('div');
@@ -83,6 +99,13 @@ const UIWindowThemeDialog = async function UIWindowThemeDialog () {
         svc_theme.apply(state);
     };
 
+    Button({ label: i18n('reset_colors') })
+        .appendTo(w_body)
+        .onPress(() => {
+            svc_theme.reset();
+        })
+        ;
+
     Slider({
         label: i18n('hue'),
         name: 'hue', min: 0, max: 360,

src/i18n/translations/en.js

@@ -167,6 +167,7 @@ const en = {
         replace: 'Replace',
         replace_all: 'Replace All',
         resend_confirmation_code: "Re-send Confirmation Code",
+        reset_colors: "Reset Colors",
         restore: "Restore",
         saturation: 'Saturation',
         save_account: 'Save account',

src/services/ThemeService.js

@@ -5,6 +5,13 @@ const PUTER_THEME_DATA_FILENAME = '~/.__puter_gui.json';
 
 const SAVE_COOLDOWN_TIME = 1000;
 
+const default_values = {
+    sat: 41.18,
+    hue: 210,
+    lig: 93.33,
+    alpha: 0.8,
+};
+
 export class ThemeService extends Service {
     async _init () {
         this.state = {
@@ -58,6 +65,12 @@ export class ThemeService extends Service {
         }
     }
 
+    reset () {
+        this.state = default_values;
+        this.reload_();
+        puter.fs.delete(PUTER_THEME_DATA_FILENAME);
+    }
+
     apply (values) {
         this.state = {
             ...this.state,