hexo-theme-solitude 2.1.6 → 2.1.8

package/source/css/_page/_about/about.styl

@@ -30,7 +30,7 @@ if "motto" in $about
   @import "buff"
   @import "maxim"
 
-if "game1" in $about
+if "game" in $about
   @import "game"
 
 if "personalities" in $about

package/source/css/_page/_about/game.styl

@@ -1,11 +1,10 @@
 #about-page
-  .author-content-item.game-apex
+  .author-content-item.game
     min-height 300px
     overflow hidden
     color var(--efu-white)
 
     &::after
-      box-shadow 0 -69px 203px 11px #04120f inset
       position absolute
       content ''
       width 100%
@@ -22,18 +21,4 @@
       z-index 2
       display flex
       flex-direction column
-      padding 1rem 2rem
-
-  .author-content-item.game-jl
-    min-height 300px
-    overflow hidden
-    color var(--efu-white)
-
-    &::after
-      box-shadow 0 -69px 203px 11px #415dc9 inset
-      position absolute
-      content ''
-      width 100%
-      height 100%
-      top 0
-      left 0
+      padding 1rem 2rem

package/source/css/_page/error.styl

@@ -42,10 +42,9 @@
         flex 1 1 0
         height 100%
         width 600px
-        border-top-left-radius 8px
-        border-bottom-left-radius 8px
+        border-radius 8px 0 0 8px
         background-color var(--efu-main)
-        background-position center center
+        background-position center
         background-size cover
 
         +maxWidth768()

package/source/css/_page/links.styl

@@ -19,10 +19,10 @@
   opacity 1
   backdrop-filter saturate(180%) blur(20px)
 
-.flink#article-container
+.flink.article-container
   margin-top 1rem
 
-#article-container
+.article-container
 
   .flink-desc
     margin 0

package/source/css/_page/other.styl

@@ -214,6 +214,7 @@ div#banners
   .card-content
     position absolute
     width 100%
+    z-index 2
     height 100%
     top 0
     left 0

package/source/css/_page/says.styl

@@ -29,6 +29,7 @@ if hexo-config('says.home_mini')
       background var(--efu-background)
       border none
       padding 0 .2rem
+
   i.bber-logo,
   i.bber-gotobb
     transition .3s
@@ -80,9 +81,9 @@ if hexo-config('says.enable')
             opacity .6
 
         .goComment
-          position: absolute
-          top: 0
-          right: 0
+          position absolute
+          top 0
+          right 0
 
     div
       &.bber-content

package/source/css/_tags/gallery.styl

@@ -1,4 +1,4 @@
-#article-container
+.article-container
   figure.gallery-group
     position: relative
     overflow: hidden

package/source/css/_tags/tabs.styl

@@ -1,5 +1,5 @@
 
-#article-container .tabs
+.article-container .tabs
   position relative
   border 1px solid var(--tab-border-color)
 
@@ -91,7 +91,7 @@
 .tab-item-content
   background var(--efu-card-bg)
 
-#article-container .tabs
+.article-container .tabs
 
   > .tab-contents .tab-item-content.active
     animation tabshow 0s

package/source/js/covercolor/api.js

@@ -1,35 +1,47 @@
 const coverColor = () => {
-    const page_color = PAGE_CONFIG.color
-    if (page_color){
-        setThemeColors(page_color);
+    const pageColor = PAGE_CONFIG.color;
+    if (pageColor) {
+        setThemeColors(pageColor);
         return;
     }
+    
     const path = document.getElementById("post-cover")?.src;
-    path ? handleApiColor(path) : setDefaultThemeColors();
+    if (path) {
+        handleApiColor(path);
+    } else {
+        setDefaultThemeColors();
+    }
 }
 
 function handleApiColor(path) {
     const cacheGroup = JSON.parse(localStorage.getItem('Solitude')) || {};
-    cacheGroup.postcolor && cacheGroup.postcolor[path] ? setThemeColors(cacheGroup.postcolor[path].value) : img2color(path);
+    if (cacheGroup.postcolor?.[path]) {
+        setThemeColors(cacheGroup.postcolor[path].value);
+    } else {
+        img2color(path);
+    }
 }
 
 function img2color(src) {
-    fetch(coverColorConfig.api + encodeURIComponent(src))
-        .then(response => response.json())
+    fetch(`${coverColorConfig.api}${encodeURIComponent(src)}`)
+        .then(response => {
+            if (!response.ok) throw new Error('Network response was not ok');
+            return response.json();
+        })
         .then(data => {
             setThemeColors(data.RGB);
             cacheColor(src, data.RGB);
         })
-        .catch(console.error);
+        .catch(error => console.error('Error fetching color:', error));
 }
 
 function setThemeColors(value) {
     if (value) {
         const [r, g, b] = value.match(/\w\w/g).map(x => parseInt(x, 16));
         document.documentElement.style.setProperty('--efu-main', value);
-        document.documentElement.style.setProperty('--efu-main-op', value + '23');
-        document.documentElement.style.setProperty('--efu-main-op-deep', value + 'dd');
-        document.documentElement.style.setProperty('--efu-main-none', value + '00');
+        document.documentElement.style.setProperty('--efu-main-op', `${value}23`);
+        document.documentElement.style.setProperty('--efu-main-op-deep', `${value}dd`);
+        document.documentElement.style.setProperty('--efu-main-none', `${value}00`);
         adjustBrightness(r, g, b);
         document.getElementById("coverdiv").classList.add("loaded");
         initThemeColor();
@@ -49,13 +61,16 @@ function setDefaultThemeColors() {
 function cacheColor(src, color) {
     const cacheGroup = JSON.parse(localStorage.getItem('Solitude')) || {};
     cacheGroup.postcolor = cacheGroup.postcolor || {};
-    cacheGroup.postcolor[src] = {value: color, expiration: Date.now() + coverColorConfig.time};
+    cacheGroup.postcolor[src] = { value: color, expiration: Date.now() + coverColorConfig.time };
     localStorage.setItem('Solitude', JSON.stringify(cacheGroup));
 }
 
 function adjustBrightness(r, g, b) {
-    if (Math.round(((r * 299) + (g * 587) + (b * 114)) / 1000) < 125) {
-        [...document.getElementsByClassName('card-content')].forEach(item => item.style.setProperty('--efu-card-bg', 'var(--efu-white)'));
+    const brightness = Math.round(((r * 299) + (g * 587) + (b * 114)) / 1000);
+    if (brightness < 125) {
+        [...document.getElementsByClassName('card-content')].forEach(item => {
+            item.style.setProperty('--efu-card-bg', 'var(--efu-white)');
+        });
         [...document.getElementsByClassName('author-info__sayhi')].forEach(item => {
             item.style.setProperty('background', 'var(--efu-white-op)');
             item.style.setProperty('color', 'var(--efu-white)');

package/source/js/covercolor/ave.js

@@ -1,38 +1,49 @@
 const coverColor = () => {
-    const page_color = PAGE_CONFIG.color
-    if (page_color){
-        setThemeColors(page_color);
-        return;
+    const pageColor = PAGE_CONFIG.color;
+    if (pageColor) {
+        setThemeColors(pageColor);
+    } else {
+        const path = document.getElementById("post-cover")?.src;
+        path ? handleApiColor(path) : setDefaultThemeColors();
     }
-    const path = document.getElementById("post-cover")?.src;
-    path ? handleApiColor(path) : setDefaultThemeColors();
 }
 
 const handleApiColor = (path) => {
-    const cacheGroup = JSON.parse(localStorage.getItem('Solitude')) || {};
-    const color = cacheGroup.postcolor?.[path]?.value;
-    color ? setThemeColors(color) : img2color(path);
+    const cacheGroup = JSON.parse(localStorage.getItem('Solitude')) || { postcolor: {} };
+    const color = cacheGroup.postcolor[path]?.value;
+    if (color) {
+        setThemeColors(color);
+    } else {
+        img2color(path);
+    }
 }
 
 const img2color = (src) => {
     fetch(`${src}?imageAve`)
-        .then(response => response.json())
+        .then(response => {
+            if (!response.ok) throw new Error('Network response was not ok');
+            return response.json();
+        })
         .then(({ RGB }) => {
-            RGB = `#${RGB.slice(2)}`;
-            setThemeColors(RGB);
-            cacheColor(src, RGB);
+            const formattedRGB = `#${RGB.slice(2)}`;
+            setThemeColors(formattedRGB);
+            cacheColor(src, formattedRGB);
         })
-        .catch(console.error);
+        .catch(error => console.error('Error fetching color:', error));
 }
 
 const setThemeColors = (value) => {
     if (!value) return setDefaultThemeColors();
     const [r, g, b] = value.match(/\w\w/g).map(x => parseInt(x, 16));
-    const [main, op, opDeep, none] = [`${value}`, `${value}23`, `${value}dd`, `${value}00`];
-    document.documentElement.style.setProperty('--efu-main', main);
-    document.documentElement.style.setProperty('--efu-main-op', op);
-    document.documentElement.style.setProperty('--efu-main-op-deep', opDeep);
-    document.documentElement.style.setProperty('--efu-main-none', none);
+    const themeColors = {
+        main: value,
+        op: `${value}23`,
+        opDeep: `${value}dd`,
+        none: `${value}00`
+    };
+    Object.entries(themeColors).forEach(([key, color]) => {
+        document.documentElement.style.setProperty(`--efu-${key}`, color);
+    });
     adjustBrightness(r, g, b);
     document.getElementById("coverdiv").classList.add("loaded");
     initThemeColor();
@@ -40,7 +51,9 @@ const setThemeColors = (value) => {
 
 const setDefaultThemeColors = () => {
     const vars = ['--efu-theme', '--efu-theme-op', '--efu-theme-op-deep', '--efu-theme-none'];
-    vars.forEach((varName, i) => document.documentElement.style.setProperty(['--efu-main', '--efu-main-op', '--efu-main-op-deep', '--efu-main-none'][i], `var(${varName})`));
+    vars.forEach((varName, i) => {
+        document.documentElement.style.setProperty(['--efu-main', '--efu-main-op', '--efu-main-op-deep', '--efu-main-none'][i], `var(${varName})`);
+    });
     initThemeColor();
 }
 
@@ -51,10 +64,11 @@ const cacheColor = (src, color) => {
 }
 
 const adjustBrightness = (r, g, b) => {
-    if (Math.round(((r * 299) + (g * 587) + (b * 114)) / 1000) < 125) {
-        document.querySelectorAll('.card-content').forEach(item =>
-            item.style.setProperty('--efu-card-bg', 'var(--efu-white)')
-        );
+    const brightness = Math.round(((r * 299) + (g * 587) + (b * 114)) / 1000);
+    if (brightness < 125) {
+        document.querySelectorAll('.card-content').forEach(item => {
+            item.style.setProperty('--efu-card-bg', 'var(--efu-white)');
+        });
         document.querySelectorAll('.author-info__sayhi').forEach(item => {
             item.style.setProperty('background', 'var(--efu-white-op)');
             item.style.setProperty('color', 'var(--efu-white)');

package/source/js/covercolor/local.js

@@ -1,75 +1,83 @@
 const coverColor = () => {
-    const page_color = PAGE_CONFIG.color
-    if (page_color){
-        setThemeColors(page_color);
-        return;
+    const pageColor = PAGE_CONFIG.color || document.getElementById("post-cover")?.src;
+    if (pageColor) {
+        return localColor(pageColor);
     }
-    const path = document.getElementById("post-cover")?.src;
-    path ? localColor(path) : setDefaultThemeColors();
+    setDefaultThemeColors();
 }
 
-function setDefaultThemeColors() {
-    document.documentElement.style.setProperty('--efu-main', 'var(--efu-theme)');
-    document.documentElement.style.setProperty('--efu-main-op', 'var(--efu-theme-op)');
-    document.documentElement.style.setProperty('--efu-main-op-deep', 'var(--efu-theme-op-deep)');
-    document.documentElement.style.setProperty('--efu-main-none', 'var(--efu-theme-none)');
+const setDefaultThemeColors = () => {
+    const themeVars = {
+        '--efu-main': 'var(--efu-theme)',
+        '--efu-main-op': 'var(--efu-theme-op)',
+        '--efu-main-op-deep': 'var(--efu-theme-op-deep)',
+        '--efu-main-none': 'var(--efu-theme-none)'
+    };
+    Object.entries(themeVars).forEach(([key, value]) => {
+        document.documentElement.style.setProperty(key, value);
+    });
     initThemeColor();
 }
 
 const localColor = path => {
-    var colorThief = new ColorThief();
+    const colorThief = new ColorThief();
     const img = new Image();
     img.crossOrigin = "Anonymous";
-    img.onload = () => setThemeColors(rgbToHex(colorThief.getColor(img)));
+    img.onload = () => setThemeColors(rgbToHex(colorThief.getColor(img)), ...colorThief.getColor(img));
     img.onerror = () => console.error('Image Error');
     img.src = path;
 }
 
 const rgbToHex = ([r, g, b]) => {
-  const hex = '#' + [r, g, b].map(x => {
-    const component = Math.floor(x * 0.8);
-    const hexValue = component.toString(16);
-    return hexValue.length === 1 ? '0' + hexValue : hexValue;
-  }).join('');
-  return hex;
+    return '#' + [r, g, b].map(x => {
+        const component = Math.floor(x * 0.8);
+        return component.toString(16).padStart(2, '0');
+    }).join('');
 }
 
-function setThemeColors(value, r = null, g = null, b = null) {
-    if (value) {
-        document.documentElement.style.setProperty('--efu-main', value);
-        document.documentElement.style.setProperty('--efu-main-op', value + '23');
-        document.documentElement.style.setProperty('--efu-main-op-deep', value + 'dd');
-        document.documentElement.style.setProperty('--efu-main-none', value + '00');
+const setThemeColors = (value, r = null, g = null, b = null) => {
+    if (!value) return setDefaultThemeColors();
 
-        if (r && g && b) {
-            let brightness = Math.round(((parseInt(r) * 299) + (parseInt(g) * 587) + (parseInt(b) * 114)) / 1000);
-            if (brightness < 125) {
-                let cardContents = document.getElementsByClassName('card-content');
-                for (let i = 0; i < cardContents.length; i++) {
-                    cardContents[i].style.setProperty('--efu-card-bg', 'var(--efu-white)');
-                }
+    const themeColors = {
+        '--efu-main': value,
+        '--efu-main-op': value + '23',
+        '--efu-main-op-deep': value + 'dd',
+        '--efu-main-none': value + '00'
+    };
+    Object.entries(themeColors).forEach(([key, color]) => {
+        document.documentElement.style.setProperty(key, color);
+    });
 
-                let authorInfo = document.getElementsByClassName('author-info__sayhi');
-                for (let i = 0; i < authorInfo.length; i++) {
-                    authorInfo[i].style.setProperty('background', 'var(--efu-white-op)');
-                    authorInfo[i].style.setProperty('color', 'var(--efu-white)');
-                }
-
-                value = LightenDarkenColor(value, 50);
-                document.documentElement.style.setProperty('--efu-main', value);
-                document.documentElement.style.setProperty('--efu-main-op', value + '23');
-                document.documentElement.style.setProperty('--efu-main-op-deep', value + 'dd');
-                document.documentElement.style.setProperty('--efu-main-none', value + '00');
-            }
+    if (r && g && b) {
+        const brightness = Math.round(((parseInt(r) * 299) + (parseInt(g) * 587) + (parseInt(b) * 114)) / 1000);
+        if (brightness < 125) {
+            adjustCardStyles();
+            value = LightenDarkenColor(value, 50);
+            setThemeColors(value);
         }
+    }
+
+    document.getElementById("coverdiv").classList.add("loaded");
+    initThemeColor();
+}
 
-        document.getElementById("coverdiv").classList.add("loaded");
-        initThemeColor();
-    } else {
-        document.documentElement.style.setProperty('--efu-main', 'var(--efu-theme)');
-        document.documentElement.style.setProperty('--efu-main-op', 'var(--efu-theme-op)');
-        document.documentElement.style.setProperty('--efu-main-op-deep', 'var(--efu-theme-op-deep)');
-        document.documentElement.style.setProperty('--efu-main-none', 'var(--efu-theme-none)');
-        initThemeColor();
+function LightenDarkenColor(col, amt) {
+    var usePound = false;
+    if (col[0] === "#") {
+        col = col.slice(1);
+        usePound = true;
     }
 }
+
+const adjustCardStyles = () => {
+    const cardContents = document.getElementsByClassName('card-content');
+    Array.from(cardContents).forEach(item => {
+        item.style.setProperty('--efu-card-bg', 'var(--efu-white)');
+    });
+
+    const authorInfo = document.getElementsByClassName('author-info__sayhi');
+    Array.from(authorInfo).forEach(item => {
+        item.style.setProperty('background', 'var(--efu-white-op)');
+        item.style.setProperty('color', 'var(--efu-white)');
+    });
+}