layout background colour blur

asset/screenshot/screenshot-005.json

@@ -1 +1 @@
-{"nightTab":true,"version":"7.0.0","state":{"layout":{"area":{"header":{"width":100,"justify":"center"},"bookmark":{"width":100,"justify":"center"}},"alignment":"center-center","order":"header-bookmark","direction":"vertical","size":100,"width":90,"padding":40,"gutter":20,"breakpoint":"xs","scrollbar":"auto","title":"","overscroll":false},"header":{"item":{"justify":"center"},"greeting":{"show":false,"type":"good","custom":"","name":"","size":100,"newLine":false},"transitional":{"show":false,"type":"timeanddate","size":100,"newLine":false},"clock":{"hour":{"show":true,"display":"number"},"minute":{"show":true,"display":"number"},"second":{"show":false,"display":"number"},"separator":{"show":true,"text":""},"meridiem":{"show":true},"hour24":{"show":false},"size":150,"newLine":false},"date":{"day":{"show":true,"display":"word","weekStart":"monday","length":"short"},"date":{"show":true,"display":"number","ordinal":false},"month":{"show":true,"display":"word","length":"short","ordinal":true},"year":{"show":true,"display":"number"},"separator":{"show":true,"text":""},"format":"date-month","size":150,"newLine":false},"search":{"show":false,"width":{"by":"auto","size":30},"focus":false,"engine":{"selected":"google","custom":{"name":"","url":"","queryName":""}},"text":{"justify":"center"},"size":100,"newLine":false,"newTab":false},"order":["clock","date"],"edit":false},"bookmark":{"size":100,"url":{"show":true},"line":{"show":true},"shadow":{"show":true},"hoverScale":{"show":true},"orientation":"bottom","style":"list","newTab":false,"edit":false,"add":false,"show":false,"item":{}},"group":{"area":{"justify":"left"},"name":{"size":100},"order":"header-body","openAll":{"size":100},"edit":false,"add":false},"toolbar":{"location":"corner","position":"top-right","size":100,"accent":{"show":false},"add":{"show":false},"edit":{"show":false},"newLine":false},"theme":{"color":{"range":{"primary":{"h":0,"s":69}},"contrast":{"start":15,"end":80},"shades":14},"accent":{"hsl":{"h":35,"s":100,"l":50},"rgb":{"r":255,"g":150,"b":0},"random":{"active":false,"style":"any"},"cycle":{"active":false,"speed":300,"step":10}},"font":{"display":{"name":"Big Shoulders Display","weight":400,"style":"normal"},"ui":{"name":"Montserrat","weight":400,"style":"normal"}},"background":{"type":"image","color":{"hsl":{"h":221,"s":47,"l":17},"rgb":{"r":23,"g":36,"b":64}},"gradient":{"angle":30,"start":{"hsl":{"h":358,"s":100,"l":15},"rgb":{"r":77,"g":0,"b":3}},"end":{"hsl":{"h":9,"s":99,"l":40},"rgb":{"r":203,"g":31,"b":1}}},"image":{"url":"https://github.com/zombieFox/nightTabAssets/blob/main/images/1628355202943.jpeg?raw=true","blur":0,"grayscale":0,"scale":100,"accent":0,"opacity":15,"vignette":{"opacity":25,"start":90,"end":35}},"video":{"url":"","blur":0,"grayscale":0,"scale":100,"accent":0,"opacity":100,"vignette":{"opacity":0,"start":90,"end":70}}},"opacity":{"general":10},"layout":{"color":{"by":"theme","opacity":10,"hsl":{"h":0,"s":0,"l":0},"rgb":{"r":0,"g":0,"b":0}},"divider":{"size":1}},"header":{"color":{"by":"theme","opacity":10,"hsl":{"h":0,"s":0,"l":0},"rgb":{"r":0,"g":0,"b":0}},"search":{"opacity":10}},"bookmark":{"color":{"by":"theme","opacity":10,"hsl":{"h":0,"s":0,"l":0},"rgb":{"r":0,"g":0,"b":0}},"item":{"border":0,"opacity":10}},"group":{"openAll":{"opacity":10}},"toolbar":{"opacity":10},"style":"dark","radius":60,"shadow":100,"shade":{"opacity":10,"blur":0},"custom":{"all":[],"edit":false}},"search":false,"modal":false,"menu":false},"bookmark":[]}
+{"nightTab":true,"version":"7.0.0","state":{"layout":{"area":{"header":{"width":100,"justify":"center"},"bookmark":{"width":100,"justify":"center"}},"alignment":"center-center","order":"header-bookmark","direction":"vertical","size":100,"width":90,"padding":40,"gutter":20,"breakpoint":"xs","scrollbar":"auto","title":"","overscroll":false},"header":{"item":{"justify":"center"},"greeting":{"show":false,"type":"good","custom":"","name":"","size":100,"newLine":false},"transitional":{"show":false,"type":"timeanddate","size":100,"newLine":false},"clock":{"hour":{"show":true,"display":"number"},"minute":{"show":true,"display":"number"},"second":{"show":false,"display":"number"},"separator":{"show":true,"text":""},"meridiem":{"show":true},"hour24":{"show":false},"size":150,"newLine":false},"date":{"day":{"show":true,"display":"word","weekStart":"monday","length":"short"},"date":{"show":true,"display":"number","ordinal":false},"month":{"show":true,"display":"word","length":"short","ordinal":true},"year":{"show":true,"display":"number"},"separator":{"show":true,"text":""},"format":"date-month","size":150,"newLine":false},"search":{"show":false,"width":{"by":"auto","size":30},"focus":false,"engine":{"selected":"google","custom":{"name":"","url":"","queryName":""}},"text":{"justify":"center"},"size":100,"newLine":false,"newTab":false},"order":["clock","date"],"edit":false},"bookmark":{"size":100,"url":{"show":true},"line":{"show":true},"shadow":{"show":true},"hoverScale":{"show":true},"orientation":"bottom","style":"list","newTab":false,"edit":false,"add":false,"show":false,"item":{}},"group":{"area":{"justify":"left"},"name":{"size":100},"order":"header-body","openAll":{"size":100},"edit":false,"add":false},"toolbar":{"location":"corner","position":"top-right","size":100,"accent":{"show":false},"add":{"show":false},"edit":{"show":false},"newLine":false},"theme":{"color":{"range":{"primary":{"h":0,"s":69}},"contrast":{"start":15,"end":80},"shades":14},"accent":{"hsl":{"h":35,"s":100,"l":50},"rgb":{"r":255,"g":150,"b":0},"random":{"active":false,"style":"any"},"cycle":{"active":false,"speed":300,"step":10}},"font":{"display":{"name":"Big Shoulders Display","weight":400,"style":"normal"},"ui":{"name":"Montserrat","weight":400,"style":"normal"}},"background":{"type":"image","color":{"hsl":{"h":221,"s":47,"l":17},"rgb":{"r":23,"g":36,"b":64}},"gradient":{"angle":30,"start":{"hsl":{"h":358,"s":100,"l":15},"rgb":{"r":77,"g":0,"b":3}},"end":{"hsl":{"h":9,"s":99,"l":40},"rgb":{"r":203,"g":31,"b":1}}},"image":{"url":"https://github.com/zombieFox/nightTabAssets/blob/main/images/1628355202943.jpeg?raw=true","blur":0,"grayscale":0,"scale":100,"accent":0,"opacity":15,"vignette":{"opacity":25,"start":90,"end":35}},"video":{"url":"","blur":0,"grayscale":0,"scale":100,"accent":0,"opacity":100,"vignette":{"opacity":0,"start":90,"end":70}}},"opacity":{"general":10},"layout":{"color":{"by":"theme","blur":0,"opacity":10,"hsl":{"h":0,"s":0,"l":0},"rgb":{"r":0,"g":0,"b":0}},"divider":{"size":1}},"header":{"color":{"by":"theme","opacity":10,"hsl":{"h":0,"s":0,"l":0},"rgb":{"r":0,"g":0,"b":0}},"search":{"opacity":10}},"bookmark":{"color":{"by":"theme","opacity":10,"hsl":{"h":0,"s":0,"l":0},"rgb":{"r":0,"g":0,"b":0}},"item":{"border":0,"opacity":10}},"group":{"openAll":{"opacity":10}},"toolbar":{"opacity":10},"style":"dark","radius":60,"shadow":100,"shade":{"opacity":10,"blur":0},"custom":{"all":[],"edit":false}},"search":false,"modal":false,"menu":false},"bookmark":[]}

asset/screenshot/screenshot-009.json

@@ -1 +1 @@
-{"nightTab":true,"version":"7.0.0","state":{"layout":{"area":{"header":{"width":100,"justify":"center"},"bookmark":{"width":100,"justify":"center"}},"alignment":"center-center","order":"header-bookmark","direction":"vertical","size":100,"width":100,"padding":40,"gutter":20,"breakpoint":"xs","scrollbar":"auto","title":"","overscroll":false},"header":{"item":{"justify":"right"},"greeting":{"show":false,"type":"good","custom":"","name":"","size":100,"newLine":false},"transitional":{"show":false,"type":"timeanddate","size":100,"newLine":false},"clock":{"hour":{"show":true,"display":"number"},"minute":{"show":true,"display":"number"},"second":{"show":false,"display":"number"},"separator":{"show":true,"text":""},"meridiem":{"show":false},"hour24":{"show":true},"size":100,"newLine":false},"date":{"day":{"show":true,"display":"word","weekStart":"monday","length":"long"},"date":{"show":true,"display":"number","ordinal":true},"month":{"show":true,"display":"word","length":"long","ordinal":true},"year":{"show":false,"display":"number"},"separator":{"show":true,"text":""},"format":"date-month","size":100,"newLine":false},"search":{"show":false,"width":{"by":"auto","size":30},"focus":false,"engine":{"selected":"google","custom":{"name":"","url":"","queryName":""}},"text":{"justify":"center"},"size":100,"newLine":false,"newTab":false},"order":["clock","date","toolbar"],"edit":false},"bookmark":{"size":100,"url":{"show":true},"line":{"show":true},"shadow":{"show":true},"hoverScale":{"show":true},"orientation":"bottom","style":"block","newTab":false,"edit":false,"add":false,"show":false,"item":{}},"group":{"area":{"justify":"left"},"name":{"size":100},"order":"header-body","openAll":{"size":100},"edit":false,"add":false},"toolbar":{"location":"header","position":"bottom-right","size":100,"accent":{"show":false},"add":{"show":false},"edit":{"show":false},"newLine":false},"theme":{"color":{"range":{"primary":{"h":200,"s":27}},"contrast":{"start":11,"end":77},"shades":14},"accent":{"hsl":{"h":180,"s":100,"l":50},"rgb":{"r":0,"g":255,"b":255},"random":{"active":false,"style":"any"},"cycle":{"active":false,"speed":300,"step":10}},"font":{"display":{"name":"Unica One","weight":400,"style":"normal"},"ui":{"name":"Inria Sans","weight":400,"style":"normal"}},"background":{"type":"video","color":{"rgb":{"r":0,"g":0,"b":0},"hsl":{"h":0,"s":0,"l":0}},"gradient":{"angle":160,"start":{"hsl":{"h":206,"s":16,"l":40},"rgb":{"r":86,"g":104,"b":118}},"end":{"hsl":{"h":219,"s":28,"l":12},"rgb":{"r":22,"g":28,"b":39}}},"image":{"url":"","blur":0,"grayscale":0,"scale":100,"accent":10,"opacity":60,"vignette":{"opacity":0,"start":90,"end":70}},"video":{"url":"https://github.com/zombieFox/nightTabAssets/blob/main/videos/1626342605376.mp4?raw=true","blur":0,"grayscale":0,"scale":100,"accent":20,"opacity":80,"vignette":{"opacity":70,"start":90,"end":25}}},"opacity":{"general":0},"layout":{"color":{"by":"theme","opacity":10,"hsl":{"h":0,"s":0,"l":0},"rgb":{"r":0,"g":0,"b":0}},"divider":{"size":1}},"header":{"color":{"by":"custom","opacity":20,"hsl":{"h":0,"s":0,"l":0},"rgb":{"r":0,"g":0,"b":0}},"search":{"opacity":0}},"bookmark":{"color":{"by":"theme","opacity":10,"hsl":{"h":0,"s":0,"l":0},"rgb":{"r":0,"g":0,"b":0}},"item":{"border":0,"opacity":0}},"group":{"openAll":{"opacity":0}},"toolbar":{"opacity":0},"style":"dark","radius":25,"shadow":50,"shade":{"opacity":2,"blur":0},"custom":{"all":[],"edit":false}},"search":false,"modal":false,"menu":false,"autoSuggest":false},"bookmark":[]}
+{"nightTab":true,"version":"7.0.0","state":{"layout":{"area":{"header":{"width":100,"justify":"center"},"bookmark":{"width":100,"justify":"center"}},"alignment":"center-center","order":"header-bookmark","direction":"vertical","size":100,"width":100,"padding":40,"gutter":20,"breakpoint":"xs","scrollbar":"auto","title":"","overscroll":false},"header":{"item":{"justify":"right"},"greeting":{"show":false,"type":"good","custom":"","name":"","size":100,"newLine":false},"transitional":{"show":false,"type":"timeanddate","size":100,"newLine":false},"clock":{"hour":{"show":true,"display":"number"},"minute":{"show":true,"display":"number"},"second":{"show":false,"display":"number"},"separator":{"show":true,"text":""},"meridiem":{"show":false},"hour24":{"show":true},"size":100,"newLine":false},"date":{"day":{"show":true,"display":"word","weekStart":"monday","length":"long"},"date":{"show":true,"display":"number","ordinal":true},"month":{"show":true,"display":"word","length":"long","ordinal":true},"year":{"show":false,"display":"number"},"separator":{"show":true,"text":""},"format":"date-month","size":100,"newLine":false},"search":{"show":false,"width":{"by":"auto","size":30},"focus":false,"engine":{"selected":"google","custom":{"name":"","url":"","queryName":""}},"text":{"justify":"center"},"size":100,"newLine":false,"newTab":false},"order":["clock","date","toolbar"],"edit":false},"bookmark":{"size":100,"url":{"show":true},"line":{"show":true},"shadow":{"show":true},"hoverScale":{"show":true},"orientation":"bottom","style":"block","newTab":false,"edit":false,"add":false,"show":false,"item":{}},"group":{"area":{"justify":"left"},"name":{"size":100},"order":"header-body","openAll":{"size":100},"edit":false,"add":false},"toolbar":{"location":"header","position":"bottom-right","size":100,"accent":{"show":false},"add":{"show":false},"edit":{"show":false},"newLine":false},"theme":{"color":{"range":{"primary":{"h":200,"s":27}},"contrast":{"start":11,"end":77},"shades":14},"accent":{"hsl":{"h":180,"s":100,"l":50},"rgb":{"r":0,"g":255,"b":255},"random":{"active":false,"style":"any"},"cycle":{"active":false,"speed":300,"step":10}},"font":{"display":{"name":"Unica One","weight":400,"style":"normal"},"ui":{"name":"Inria Sans","weight":400,"style":"normal"}},"background":{"type":"video","color":{"rgb":{"r":0,"g":0,"b":0},"hsl":{"h":0,"s":0,"l":0}},"gradient":{"angle":160,"start":{"hsl":{"h":206,"s":16,"l":40},"rgb":{"r":86,"g":104,"b":118}},"end":{"hsl":{"h":219,"s":28,"l":12},"rgb":{"r":22,"g":28,"b":39}}},"image":{"url":"","blur":0,"grayscale":0,"scale":100,"accent":10,"opacity":60,"vignette":{"opacity":0,"start":90,"end":70}},"video":{"url":"https://github.com/zombieFox/nightTabAssets/blob/main/videos/1626342605376.mp4?raw=true","blur":0,"grayscale":0,"scale":100,"accent":20,"opacity":80,"vignette":{"opacity":70,"start":90,"end":25}}},"opacity":{"general":0},"layout":{"color":{"by":"custom","blur":60,"opacity":15,"hsl":{"h":0,"s":0,"l":0},"rgb":{"r":0,"g":0,"b":0}},"divider":{"size":1}},"header":{"color":{"by":"theme","opacity":10,"hsl":{"h":0,"s":0,"l":0},"rgb":{"r":0,"g":0,"b":0}},"search":{"opacity":0}},"bookmark":{"color":{"by":"theme","opacity":10,"hsl":{"h":0,"s":0,"l":0},"rgb":{"r":0,"g":0,"b":0}},"item":{"border":0,"opacity":0}},"group":{"openAll":{"opacity":0}},"toolbar":{"opacity":0},"style":"dark","radius":25,"shadow":50,"shade":{"opacity":2,"blur":0},"custom":{"all":[],"edit":false}},"search":false,"modal":false,"menu":false,"autoSuggest":false},"bookmark":[]}

src/component/customThemeTile/index.js

@@ -128,6 +128,8 @@ export const CustomThemeTile = function({
 
         themeSetting.control.layout.color.color.update();
 
+        themeSetting.control.layout.color.blur.update();
+
         themeSetting.control.layout.color.opacity.update();
 
         themeSetting.control.layout.color.collapse.update();
@@ -258,6 +260,7 @@ export const CustomThemeTile = function({
           'theme.layout.color.hsl.s',
           'theme.layout.color.hsl.l',
           'theme.layout.color.opacity',
+          'theme.layout.color.blur',
           'theme.layout.divider.size',
           'theme.header.color.rgb.r',
           'theme.header.color.rgb.g',

src/component/layout/index.css

@@ -43,6 +43,7 @@
 .is-theme-layout-color-by-custom .layout {
   background-color: hsla(var(--theme-layout-color-hsl-h), calc(var(--theme-layout-color-hsl-s) * 1%), calc(var(--theme-layout-color-hsl-l) * 1%), calc(var(--theme-layout-color-opacity) / 100));
   border-radius: calc(var(--theme-radius) * 0.01em);
+  backdrop-filter: blur(calc(var(--theme-layout-color-blur) * 0.01em));
 }
 
 .is-theme-layout-color-by-custom.is-theme-header-color-by-custom .layout,

src/component/menuContent/themeSetting/index.js

@@ -242,6 +242,50 @@ themeSetting.disable = () => {
 
   };
 
+  switch (state.get.current().theme.layout.color.by) {
+
+    case 'theme':
+      themeSetting.control.layout.color.color.disable();
+      themeSetting.control.layout.color.opacity.disable();
+      themeSetting.control.layout.color.blur.disable();
+      break;
+
+    case 'custom':
+      themeSetting.control.layout.color.color.enable();
+      themeSetting.control.layout.color.opacity.enable();
+      themeSetting.control.layout.color.blur.enable();
+      break;
+
+  };
+
+  switch (state.get.current().theme.header.color.by) {
+
+    case 'theme':
+      themeSetting.control.header.color.color.disable();
+      themeSetting.control.header.color.opacity.disable();
+      break;
+
+    case 'custom':
+      themeSetting.control.header.color.color.enable();
+      themeSetting.control.header.color.opacity.enable();
+      break;
+
+  };
+
+  switch (state.get.current().theme.bookmark.color.by) {
+
+    case 'theme':
+      themeSetting.control.bookmark.color.color.disable();
+      themeSetting.control.bookmark.color.opacity.disable();
+      break;
+
+    case 'custom':
+      themeSetting.control.bookmark.color.color.enable();
+      themeSetting.control.bookmark.color.opacity.enable();
+      break;
+
+  };
+
 };
 
 themeSetting.preset = (parent) => {
@@ -1810,9 +1854,27 @@ themeSetting.layout = (parent) => {
     }
   });
 
+  themeSetting.control.layout.color.blur = new Control_slider({
+    object: state.get.current(),
+    path: 'theme.layout.color.blur',
+    id: 'theme.layout-blur',
+    labelText: 'Background blur',
+    value: state.get.current().theme.layout.color.blur,
+    defaultValue: state.get.default().theme.layout.color.blur,
+    min: state.get.minMax().theme.layout.color.blur.min,
+    max: state.get.minMax().theme.layout.color.blur.max,
+    action: () => {
+      applyCSSVar([
+        'theme.layout.color.blur'
+      ]);
+      data.save();
+    }
+  });
+
   themeSetting.control.layout.color.area = node('div', [
     themeSetting.control.layout.color.color.wrap(),
-    themeSetting.control.layout.color.opacity.wrap()
+    themeSetting.control.layout.color.opacity.wrap(),
+    themeSetting.control.layout.color.blur.wrap()
   ]);
 
   themeSetting.control.layout.color.collapse = new Collapse({

src/component/presetThemeTile/index.js

@@ -123,6 +123,8 @@ export const PresetThemeTile = function({
 
         themeSetting.control.layout.color.color.update();
 
+        themeSetting.control.layout.color.blur.update();
+
         themeSetting.control.layout.color.opacity.update();
 
         themeSetting.control.layout.color.collapse.update();
@@ -265,7 +267,7 @@ export const PresetThemeTile = function({
           'theme.layout.color.hsl.s',
           'theme.layout.color.hsl.l',
           'theme.layout.color.opacity',
-          'theme.layout.divider.size',
+          'theme.layout.color.blur',
           'theme.header.color.rgb.r',
           'theme.header.color.rgb.g',
           'theme.header.color.rgb.b',

src/component/state/index.js

@@ -97,8 +97,8 @@ state.default = {
       video: { url: '', blur: 0, grayscale: 0, scale: 100, accent: 0, opacity: 100, vignette: { opacity: 0, start: 90, end: 70 } }
     },
     opacity: { general: 100 },
-    layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
-    header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
+    layout: { color: { by: 'theme', hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 }, blur: 0, opacity: 10 }, divider: { size: 0 } },
+    header: { color: { by: 'theme', hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 }, opacity: 10 }, search: { opacity: 100 } },
     bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
     group: { openAll: { opacity: 100 } },
     toolbar: { opacity: 100 },
@@ -163,6 +163,7 @@ state.minMax = {
       color: {
         hsl: { h: { min: 0, max: 359 }, s: { min: 0, max: 100 }, l: { min: 0, max: 100 } },
         rgb: { r: { min: 0, max: 255 }, g: { min: 0, max: 255 }, b: { min: 0, max: 255 } },
+        blur: { min: 0, max: 200 },
         opacity: { min: 0, max: 100 }
       },
       divider: { size: { min: 0, max: 10 } }

src/component/theme/index.js

@@ -511,6 +511,7 @@ theme.init = () => {
     'theme.layout.color.hsl.s',
     'theme.layout.color.hsl.l',
     'theme.layout.color.opacity',
+    'theme.layout.color.blur',
     'theme.layout.divider.size',
     'theme.header.color.rgb.r',
     'theme.header.color.rgb.g',

src/component/themePreset/acrid/index.js

@@ -19,7 +19,7 @@ export const acrid = {
   style: 'dark',
   shade: { opacity: 20, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/aerial/index.js

@@ -19,9 +19,9 @@ export const aerial = {
   style: 'dark',
   shade: { opacity: 2, blur: 0 },
   opacity: { general: 0 },
-  layout: { color: { by: 'custom', opacity: 20, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 1 } },
-  header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 10 } },
-  bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 10 } },
+  layout: { color: { by: 'custom', blur: 30, opacity: 40, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 1 } },
+  header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 0 } },
+  bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 0 } },
   group: { openAll: { opacity: 0 } },
   toolbar: { opacity: 0 }
 };

src/component/themePreset/azure/index.js

@@ -19,7 +19,7 @@ export const azure = {
   style: 'dark',
   shade: { opacity: 10, blur: 10 },
   opacity: { general: 0 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 0 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 30 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/bean/index.js

@@ -19,7 +19,7 @@ export const bean = {
   style: 'dark',
   shade: { opacity: 10, blur: 0 },
   opacity: { general: 0 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 0 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/comet/index.js

@@ -19,7 +19,7 @@ export const comet = {
   style: 'dark',
   shade: { opacity: 15, blur: 0 },
   opacity: { general: 0 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 20 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 20 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/corsair/index.js

@@ -19,7 +19,7 @@ export const corsair = {
   style: 'dark',
   shade: { opacity: 30, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/dash/index.js

@@ -19,7 +19,7 @@ export const dash = {
   style: 'light',
   shade: { opacity: 50, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/deco/index.js

@@ -19,7 +19,7 @@ export const deco = {
   style: 'dark',
   shade: { opacity: 10, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/earthquake/index.js

@@ -19,7 +19,7 @@ export const earthquake = {
   style: 'dark',
   shade: { opacity: 80, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/funkadelic/index.js

@@ -19,7 +19,7 @@ export const funkadelic = {
   style: 'dark',
   shade: { opacity: 80, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/grimm/index.js

@@ -19,7 +19,7 @@ export const grimm = {
   style: 'dark',
   shade: { opacity: 90, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/hive/index.js

@@ -19,7 +19,7 @@ export const hive = {
   style: 'dark',
   shade: { opacity: 0, blur: 0 },
   opacity: { general: 0 },
-  layout: { color: { by: 'custom', opacity: 20, hsl: { h: 35, s: 100, l: 61 }, rgb: { r: 255, g: 172, b: 56 } }, divider: { size: 0 } },
+  layout: { color: { by: 'custom', blur: 30, opacity: 20, hsl: { h: 35, s: 100, l: 61 }, rgb: { r: 255, g: 172, b: 56 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 0 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 1, opacity: 0 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/hypnos/index.js

@@ -19,7 +19,7 @@ export const hypnos = {
   style: 'dark',
   shade: { opacity: 20, blur: 0 },
   opacity: { general: 0 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 0 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 40 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/infrared/index.js

@@ -19,7 +19,7 @@ export const infrared = {
   style: 'dark',
   shade: { opacity: 0, blur: 5 },
   opacity: { general: 0 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 0 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 1, opacity: 0 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/kapow/index.js

@@ -19,7 +19,7 @@ export const kapow = {
   style: 'dark',
   shade: { opacity: 40, blur: 4 },
   opacity: { general: 0 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 0 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 1, opacity: 80 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/koto/index.js

@@ -19,7 +19,7 @@ export const koto = {
   style: 'dark',
   shade: { opacity: 0, blur: 10 },
   opacity: { general: 0 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 0 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/lex/index.js

@@ -19,7 +19,7 @@ export const lex = {
   style: 'dark',
   shade: { opacity: 90, blur: 0 },
   opacity: { general: 15 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 15 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 15 } },
   group: { openAll: { opacity: 15 } },

src/component/themePreset/macaroon/index.js

@@ -19,7 +19,7 @@ export const macaroon = {
   style: 'light',
   shade: { opacity: 30, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/marker/index.js

@@ -19,7 +19,7 @@ export const marker = {
   style: 'light',
   shade: { opacity: 30, blur: 0 },
   opacity: { general: 20 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 20 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 20 } },
   group: { openAll: { opacity: 20 } },

src/component/themePreset/midnight/index.js

@@ -19,7 +19,7 @@ export const midnight = {
   style: 'dark',
   shade: { opacity: 10, blur: 0 },
   opacity: { general: 0 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 0 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/mint/index.js

@@ -19,7 +19,7 @@ export const mint = {
   style: 'dark',
   shade: { opacity: 40, blur: 20 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/neon/index.js

@@ -19,7 +19,7 @@ export const neon = {
   style: 'dark',
   shade: { opacity: 8, blur: 0 },
   opacity: { general: 0 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 45 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 45 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/nord/index.js

@@ -19,7 +19,7 @@ export const nord = {
   style: 'dark',
   shade: { opacity: 10, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/obsidian/index.js

@@ -19,7 +19,7 @@ export const obsidian = {
   style: 'dark',
   shade: { opacity: 50, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/origin/index.js

@@ -19,7 +19,7 @@ export const origin = {
   style: 'dark',
   shade: { opacity: 0, blur: 10 },
   opacity: { general: 0 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 0 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 1, opacity: 0 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/outrun/index.js

@@ -19,7 +19,7 @@ export const outrun = {
   style: 'dark',
   shade: { opacity: 70, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 1 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 1 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/pepper/index.js

@@ -19,7 +19,7 @@ export const pepper = {
   style: 'dark',
   shade: { opacity: 10, blur: 0 },
   opacity: { general: 25 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 1 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 1 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 25 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 25 } },
   group: { openAll: { opacity: 25 } },

src/component/themePreset/point/index.js

@@ -19,7 +19,7 @@ export const point = {
   style: 'dark',
   shade: { opacity: 4, blur: 0 },
   opacity: { general: 45 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 45 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 45 } },
   group: { openAll: { opacity: 45 } },

src/component/themePreset/pumpkin/index.js

@@ -19,7 +19,7 @@ export const pumpkin = {
   style: 'dark',
   shade: { opacity: 10, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/replica/index.js

@@ -19,7 +19,7 @@ export const replica = {
   style: 'light',
   shade: { opacity: 50, blur: 5 },
   opacity: { general: 0 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 1 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 1 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 0 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 0 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/rumble/index.js

@@ -19,7 +19,7 @@ export const rumble = {
   style: 'dark',
   shade: { opacity: 20, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 1 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 1 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 50 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 50 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/savage/index.js

@@ -19,7 +19,7 @@ export const savage = {
   style: 'dark',
   shade: { opacity: 80, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/scoria/index.js

@@ -19,7 +19,7 @@ export const scoria = {
   style: 'dark',
   shade: { opacity: 0, blur: 90 },
   opacity: { general: 80 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 80 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 80 } },
   group: { openAll: { opacity: 80 } },

src/component/themePreset/snow/index.js

@@ -19,7 +19,7 @@ export const snow = {
   style: 'light',
   shade: { opacity: 60, blur: 0 },
   opacity: { general: 80 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 80 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 2, opacity: 80 } },
   group: { openAll: { opacity: 80 } },

src/component/themePreset/sol/index.js

@@ -19,7 +19,7 @@ export const sol = {
   style: 'light',
   shade: { opacity: 60, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 10 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 10 } },

src/component/themePreset/steel/index.js

@@ -19,7 +19,7 @@ export const steel = {
   style: 'light',
   shade: { opacity: 70, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 100 } },

src/component/themePreset/stria/index.js

@@ -19,7 +19,7 @@ export const stria = {
   style: 'dark',
   shade: { opacity: 0, blur: 10 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 50 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 50 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/terra/index.js

@@ -19,7 +19,7 @@ export const terra = {
   style: 'light',
   shade: { opacity: 4, blur: 4 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/trine/index.js

@@ -19,7 +19,7 @@ export const trine = {
   style: 'dark',
   shade: { opacity: 10, blur: 0 },
   opacity: { general: 100 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 40 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 100 } },
   group: { openAll: { opacity: 40 } },

src/component/themePreset/umbra/index.js

@@ -19,7 +19,7 @@ export const umbra = {
   style: 'dark',
   shade: { opacity: 0, blur: 10 },
   opacity: { general: 0 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 70 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 70 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/vanadium/index.js

@@ -19,7 +19,7 @@ export const vanadium = {
   style: 'dark',
   shade: { opacity: 20, blur: 10 },
   opacity: { general: 100 },
-  layout: { color: { by: 'custom', opacity: 20, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'custom', blur: 0, opacity: 20, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 40 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 40 } },
   group: { openAll: { opacity: 0 } },

src/component/themePreset/viper/index.js

@@ -19,7 +19,7 @@ export const viper = {
   style: 'light',
   shade: { opacity: 0, blur: 0 },
   opacity: { general: 0 },
-  layout: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
+  layout: { color: { by: 'theme', blur: 0, opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } },
   header: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 0 } },
   bookmark: { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, item: { border: 0, opacity: 0 } },
   group: { openAll: { opacity: 0 } },

src/component/update/index.js

@@ -169,7 +169,7 @@ update.mod['7.0.0'] = function(data) {
 
   data.state.theme.toolbar = { opacity: 100 };
 
-  data.state.theme.layout = { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } };
+  data.state.theme.layout = { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 }, blur: 0 }, divider: { size: 0 } };
 
   data.state.theme.header = { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, search: { opacity: 100 } };
 
@@ -390,7 +390,7 @@ update.mod['7.0.0'] = function(data) {
       video: { url: '', blur: 0, grayscale: 0, scale: 100, accent: 0, opacity: 100 }
     };
 
-    item.layout = { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 } }, divider: { size: 0 } };
+    item.layout = { color: { by: 'theme', opacity: 10, hsl: { h: 0, s: 0, l: 0 }, rgb: { r: 0, g: 0, b: 0 }, blur: 0 }, divider: { size: 0 } };
 
     item.opacity = { general: 100 };