ui: enhance resource load

packages/ui-default/entry.js

@@ -29,20 +29,32 @@ document.addEventListener('DOMContentLoaded', async () => {
   // eslint-disable-next-line camelcase
   try { __webpack_public_path__ = UiContext.cdn_prefix; } catch (e) { }
 
-  // Locale & langs
-  const { version, payload } = JSON.parse(localStorage.getItem('hydro-constant') || '{}');
-  if (version === UiContext.constantVersion) {
-    eval(payload[0]); // eslint-disable-line no-eval
-    payload.shift();
-    window.Hydro.preload = payload;
-  } else {
+  const local = JSON.parse(localStorage.getItem('hydro-constant') || '{}');
+  let { data } = local;
+  if (local.version !== UiContext.constantVersion) {
     const res = await fetch(`/constant?version=${UiContext.constantVersion}`);
-    const data = await res.json();
-    eval(data.payload[0]); // eslint-disable-line no-eval
-    localStorage.setItem('hydro-constant', JSON.stringify(data));
-    data.payload.shift();
-    window.Hydro.preload = data.payload;
+    data = await res.json();
+    localStorage.setItem('hydro-constant', JSON.stringify({ data, version: UiContext.constantVersion }));
   }
+  eval(data[0]); // eslint-disable-line no-eval
+  data.shift();
+  window.Hydro.preload = data;
+
+  const e = document.createElement('style');
+  const dark = UiContext.domain.nav_logo_dark || UiContext.nav_logo_dark;
+  const dark2x = UiContext.domain.nav_logo_dark_2x || UiContext.nav_logo_dark_2x;
+  e.innerHTML = `
+    ${dark ? `.nav__logo { background-image: url(${dark}) !important }` : ''}
+    ${dark2x ? `
+      @media
+      only screen and (-webkit-min-device-pixel-ratio: 1.5), 
+      only screen and (min-resolution: 1.5dppx),
+      only screen and (min-resolution: 144dpi) {
+        .nav__logo, .header--mobile__domain {
+          background-image: url(${dark2x}) !important
+        }
+      }` : ''}`;
+  document.body.appendChild(e);
 
   import('./hydro');
 }, false);