hexo-theme-solitude 2.1.5 → 2.1.7

package/source/css/_highlight/index.styl

@@ -78,6 +78,15 @@ figure
         font-size 1.15em
         user-select none
 
+      .caption
+        position absolute
+        right 3.5rem
+        font-size 14px
+        color var(--efu-secondtext)
+
+        +maxWidth768()
+          display none
+
     .code-expand-btn
       background var(--efu-hltools-bg)
       transition .3s

package/source/css/_highlight/prismjs/diff.styl

@@ -39,6 +39,12 @@ pre[class*='language-']
   .inserted
     color $highlight-inserted
 
+  .addition
+    color $highlight-inserted
+
+  .deletion
+    color $highlight-deleted
+
   [data-theme='dark'] &
     .keyword
     .function
@@ -77,4 +83,10 @@ pre[class*='language-']
       color $highlight-deleted
 
     .inserted
-      color $highlight-inserted
+      color $highlight-inserted
+    
+    .addition
+      color $highlight-inserted
+
+    .deletion
+      color $highlight-deleted

package/source/css/_layout/article-container.styl

@@ -1,4 +1,4 @@
-#article-container
+.post-content
   overflow-wrap break-word
   +maxWidth768()
     overflow hidden

package/source/css/_layout/recent-post.styl

@@ -23,7 +23,7 @@ if hexo-config('index_post_list.direction') == "column"
 
       +maxWidth1300()
         margin-bottom .5rem
-        #tag &
+        #tag &:first-child
           margin-top: 2.5rem
 
       +maxWidth768()
@@ -255,7 +255,7 @@ else if hexo-config('index_post_list.direction') == "row"
       flex-direction row
       width 100%
       box-shadow var(--efu-shadow-border)
-      #tag &
+      #tag &:first-child
           margin-top: 2.5rem
 
       +maxWidth768()

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,23 +1,26 @@
 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)));
@@ -26,50 +29,47 @@ const localColor = 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();
-    } 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();
     }
+
+    document.getElementById("coverdiv").classList.add("loaded");
+    initThemeColor();
+}
+
+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)');
+    });
 }