refactor: include only necessary styles and remove unused like-button assets

Former-commit-id: c66c868fea27eda8d55dd2d276913ac3ecfbdc58

10 files changed, 237 insertions, 522 deletions

diff --git a/assets/css/components/_post-tabs.scss b/assets/css/components/_post-tabs.scss
new file mode 100644
index 00000000..475fc12d
--- /dev/null
+++ b/assets/css/components/_post-tabs.scss
@@ -0,0 +1,206 @@
+.post-actions-container {
+  margin: 2rem 0 1rem 0;
+}
+
+.post-actions-nav {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 1.5rem;
+}
+
+.left-actions {
+  display: flex;
+  gap: 0.5rem;
+}
+
+.right-actions {
+  display: flex;
+  gap: 0.25rem;
+}
+
+.action-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  min-width: 48px;
+  height: 48px;
+  padding: 0 8px;
+  border: none;
+  background: transparent;
+  color: #666;
+  cursor: pointer;
+  text-decoration: none;
+  position: relative;
+  transition: all 0.2s ease;
+}
+
+.action-btn:hover {
+  background: rgba(0, 0, 0, 0.05);
+  border-radius: 8px;
+}
+
+/* 右侧小按钮样式 */
+.small-btn {
+  min-width: 32px;
+  height: 32px;
+  padding: 0 4px;
+}
+
+.small-btn:hover {
+  background: transparent;
+  opacity: 0.7;
+}
+
+/* 图标样式 */
+.icon {
+  filter: invert(0.4);
+  flex-shrink: 0;
+}
+
+/* Tooltip 样式 */
+.action-btn::before {
+  content: attr(title);
+  position: absolute;
+  bottom: 100%;
+  left: 50%;
+  transform: translateX(-50%) translateY(5px);
+  background: rgba(0, 0, 0, 0.8);
+  color: white;
+  padding: 6px 10px;
+  border-radius: 4px;
+  font-size: 12px;
+  white-space: nowrap;
+  opacity: 0;
+  visibility: hidden;
+  transition: all 0.3s ease;
+  pointer-events: none;
+  margin-bottom: 8px;
+  z-index: 1000;
+}
+
+.action-btn:hover::before {
+  opacity: 1;
+  visibility: visible;
+  transform: translateX(-50%) translateY(0);
+}
+
+.like-button-container {
+  position: relative;
+}
+
+.like-icon {
+  filter: invert(0.4);
+  flex-shrink: 0;
+  transition: all 0.3s ease;
+}
+
+.liked .like-icon {
+  filter: brightness(0) saturate(100%) invert(8%) sepia(100%) saturate(7500%) hue-rotate(0deg) brightness(70%) contrast(150%);
+  animation: heartbeat 1.5s ease-in-out infinite;
+}
+
+.count-badge {
+  font-size: 12px;
+  font-weight: bold;
+  color: #666;
+  min-width: 16px;
+  text-align: center;
+  background: rgba(255, 255, 255, 0.9);
+  border-radius: 10px;
+  padding: 2px 6px;
+  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
+}
+
+.liked .count-badge {
+  color: #8B0000;
+}
+
+.comments-section {
+  margin-top: 1rem;
+}
+
+/* 心脏搏动动画 */
+@keyframes heartbeat {
+  0%, 100% { transform: scale(1); }
+  25% { transform: scale(1.1); }
+  50% { transform: scale(1.2); }
+  75% { transform: scale(1.1); }
+}
+
+/* 暗色主题适配 */
+@media (prefers-color-scheme: dark) {
+  .action-btn {
+    color: #999;
+  }
+
+  .action-btn:hover {
+    background: rgba(255, 255, 255, 0.05);
+  }
+
+  .small-btn:hover {
+    background: transparent;
+    opacity: 0.7;
+  }
+
+  /* 暗色模式下的图标滤镜 */
+  .icon {
+    filter: invert(0.7) brightness(1.2);
+  }
+
+  .like-icon {
+    filter: invert(0.7) brightness(1.2);
+  }
+
+  .liked .like-icon {
+    filter: brightness(0) saturate(100%) invert(8%) sepia(100%) saturate(7500%) hue-rotate(0deg) brightness(70%) contrast(150%);
+    animation: heartbeat 1.5s ease-in-out infinite;
+  }
+
+  .action-btn::before {
+    background: rgba(255, 255, 255, 0.9);
+    color: #000;
+  }
+
+  .count-badge {
+    color: #999;
+    background: rgba(0, 0, 0, 0.7);
+  }
+}
+
+/* 移动端适配 */
+@media (max-width: 768px) {
+  .post-actions-nav {
+    gap: 0.5rem;
+  }
+
+  .left-actions {
+    gap: 0.5rem;
+  }
+
+  .right-actions {
+    gap: 0.25rem;
+  }
+
+  .action-btn {
+    min-width: 44px;
+    height: 44px;
+    padding: 0 6px;
+  }
+
+  .small-btn {
+    min-width: 28px;
+    height: 28px;
+    padding: 0 2px;
+  }
+
+  .action-btn::before {
+    left: 50%;
+    transform: translateX(-50%) translateY(5px);
+  }
+
+  .action-btn:hover::before {
+    transform: translateX(-50%) translateY(0);
+  }
+}
diff --git a/assets/css/content.scss b/assets/css/content.scss
new file mode 100644
index 00000000..65a4339c
--- /dev/null
+++ b/assets/css/content.scss
@@ -0,0 +1,8 @@
+@import "utils/mixins";
+
+@import "components/post";
+@import "components/post-tabs";
+@import "components/comment";
+
+@import "libraries/littlefoot";
+@import "libraries/fancybox";
diff --git a/assets/css/index.scss b/assets/css/global.scss
index b3cec12c..e2f5126f 100644
--- a/assets/css/index.scss
+++ b/assets/css/global.scss
@@ -8,13 +8,8 @@
 @import "components/pages";
 @import "components/taxonomy";
 @import "components/postlist";
-@import "components/post";
-@import "components/comment";
 @import "components/shortcodes";
 @import "components/card";
 @import "components/fictions";
 @import "components/library";
 @import "components/footer";
-
-@import "libraries/littlefoot";
-@import "libraries/fancybox";
diff --git a/assets/css/like-button.css b/assets/css/like-button.css
deleted file mode 100644
index f26c776d..00000000
--- a/assets/css/like-button.css
+++ /dev/null
@@ -1,157 +0,0 @@
-.floating-like-container {
-  position: fixed;
-  bottom: 30px;
-  right: 30px;
-  z-index: 1000;
-  opacity: 0.3;
-  transition: all 0.3s ease;
-}
-
-.floating-like-container:hover {
-  opacity: 1;
-}
-
-.floating-like-container.near-comments {
-  opacity: 0.6;
-  animation: gentle-shake 2s ease-in-out infinite;
-}
-
-.floating-like-container.near-comments:hover {
-  opacity: 1;
-  animation: none;
-}
-
-/* 已点赞状态：保持最高不透明度，不再晃动 */
-.floating-like-container.liked {
-  opacity: 1 !important;
-}
-
-.floating-like-container.liked.near-comments {
-  animation: none !important;
-}
-
-.floating-like-button {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  cursor: pointer;
-  background: none;
-  border: none;
-  padding: 8px;
-  transition: all 0.3s ease;
-  position: relative;
-}
-
-.floating-like-button:hover {
-  transform: scale(1.1);
-}
-
-/* 已点赞状态下禁用hover放大效果 */
-.liked .floating-like-button:hover {
-  transform: none;
-}
-
-.floating-like-button.clicked {
-  transform: scale(0.9);
-}
-
-.floating-like-button:disabled {
-  cursor: not-allowed;
-}
-
-#like-button-icon {
-  width: 32px;
-  height: 32px;
-  transition: all 0.3s ease;
-  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.2));
-  @media (prefers-color-scheme:dark) {
-      filter: drop-shadow(0 2px 4px rgba(0,0,0,0.2)) invert(1);
-  }
-}
-
-.liked #like-button-icon {
-  filter: brightness(0) saturate(100%) invert(8%) sepia(100%) saturate(7500%) hue-rotate(0deg) brightness(70%) contrast(150%) drop-shadow(0 2px 4px rgba(0,0,0,0.2));
-  animation: heartbeat 1.5s ease-in-out infinite;
-  @media (prefers-color-scheme:dark) {
-      filter: brightness(0) saturate(100%) invert(8%) sepia(100%) saturate(7500%) hue-rotate(0deg) brightness(70%) contrast(150%) drop-shadow(0 2px 4px rgba(0,0,0,0.2));
-  }
-}
-
-.like-count-display {
-  margin-top: 4px;
-  font-size: 12px;
-  font-weight: bold;
-  color: var(--secondary-text-color);
-  text-align: center;
-  min-width: 20px;
-  background: rgba(255, 255, 255, 0.9);
-  border-radius: 10px;
-  padding: 2px 6px;
-  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
-}
-
-.liked .like-count-display {
-  color: #8B0000;
-}
-
-/* 悬浮提示样式 */
-.floating-like-button::before {
-  content: attr(title);
-  position: absolute;
-  bottom: 100%;
-  right: 0;
-  background: rgba(0, 0, 0, 0.8);
-  color: white;
-  padding: 6px 10px;
-  border-radius: 4px;
-  font-size: 12px;
-  white-space: nowrap;
-  opacity: 0;
-  visibility: hidden;
-  transform: translateY(5px);
-  transition: all 0.3s ease;
-  pointer-events: none;
-  margin-bottom: 8px;
-}
-
-.floating-like-button:hover::before {
-  opacity: 1;
-  visibility: visible;
-  transform: translateY(0);
-}
-
-/* 动画定义 */
-@keyframes gentle-shake {
-  0%, 100% { transform: translateX(0); }
-  25% { transform: translateX(-2px); }
-  75% { transform: translateX(2px); }
-}
-
-@keyframes heartbeat {
-  0%, 100% { transform: scale(1); }
-  25% { transform: scale(1.1); }
-  50% { transform: scale(1.2); }
-  75% { transform: scale(1.1); }
-}
-
-/* 移动端适配 */
-@media screen and (max-width: 768px) {
-  .floating-like-container {
-    bottom: 20px;
-    right: 20px;
-  }
-
-  #like-button-icon {
-    width: 28px;
-    height: 28px;
-  }
-
-  .floating-like-button::before {
-    right: -10px;
-    transform: translateX(50%) translateY(5px);
-  }
-
-  .floating-like-button:hover::before {
-    transform: translateX(50%) translateY(0);
-  }
-}
diff --git a/assets/js/like-button.js b/assets/js/like-button.js
deleted file mode 100644
index e03e5447..00000000
--- a/assets/js/like-button.js
+++ /dev/null
@@ -1,109 +0,0 @@
-(function() {
-  // 获取页面ID（需要在HTML中设置）
-  const pageId = window.likeButtonPageId;
-  if (!pageId) {
-    console.error('Like button: pageId not found');
-    return;
-  }
-  
-  const countEl = document.getElementById("like-count-" + pageId);
-  const btnEl = document.getElementById("like-btn-" + pageId);
-  const containerEl = document.getElementById("like-container-" + pageId);
-  
-  if (!countEl || !btnEl || !containerEl) {
-    console.error('Like button: required elements not found');
-    return;
-  }
-  
-  let isNearComments = false;
-  
-  function checkScrollPosition() {
-    const commentsSection = document.querySelector('.post-comments');
-    if (!commentsSection) return;
-    
-    const rect = commentsSection.getBoundingClientRect();
-    const windowHeight = window.innerHeight;
-    
-    // 当评论区进入视窗下半部分时触发
-    const shouldHighlight = rect.top < windowHeight * 0.8;
-    
-    if (shouldHighlight !== isNearComments) {
-      isNearComments = shouldHighlight;
-      // 如果已经点赞，不添加 near-comments 类（避免晃动）
-      if (containerEl.classList.contains('liked')) {
-        return;
-      }
-      
-      if (isNearComments) {
-        containerEl.classList.add('near-comments');
-      } else {
-        containerEl.classList.remove('near-comments');
-      }
-    }
-  }
-  
-  function updateTooltip() {
-    if (containerEl.classList.contains('liked')) {
-      btnEl.setAttribute('title', btnEl.getAttribute('data-liked-title'));
-    } else {
-      btnEl.setAttribute('title', '为这篇文章献上心脏');
-    }
-  }
-  
-  function fetchLikes() {
-    fetch("https://like.guhub.cn/like/" + pageId)
-      .then(resp => resp.json())
-      .then(data => {
-        countEl.innerText = data.likes ?? 0;
-        if (localStorage.getItem("liked_" + pageId)) {
-          btnEl.disabled = true;
-          containerEl.classList.add("liked");
-          // 移除可能存在的 near-comments 类
-          containerEl.classList.remove('near-comments');
-          updateTooltip();
-        }
-      })
-      .catch(() => {
-        countEl.innerText = "❌";
-      });
-  }
-  
-  window.sendLike = function(pageId) {
-    if (localStorage.getItem("liked_" + pageId)) return;
-
-    if (window.location.hostname !== 'localhost') {
-      if (typeof umami !== 'undefined') {
-        umami.track('👍 Hit Like Button');
-      }
-    }
-    
-    // 添加点击效果
-    btnEl.classList.add("clicked");
-    setTimeout(() => {
-      btnEl.classList.remove("clicked");
-    }, 300);
-    
-    fetch("https://like.guhub.cn/like/" + pageId, { method: "POST" })
-      .then(resp => resp.json())
-      .then(data => {
-        localStorage.setItem("liked_" + pageId, "1");
-        countEl.innerText = data.likes ?? 1;
-        btnEl.disabled = true;
-        containerEl.classList.add("liked");
-        // 移除 near-comments 类，停止晃动
-        containerEl.classList.remove('near-comments');
-        updateTooltip();
-      })
-      .catch(() => {
-        alert("点赞失败，请稍后再试");
-      });
-  };
-  
-  // 监听滚动事件
-  window.addEventListener('scroll', checkScrollPosition);
-  window.addEventListener('resize', checkScrollPosition);
-  
-  // 初始化
-  fetchLikes();
-  checkScrollPosition();
-})();
\ No newline at end of file
diff --git a/layouts/fictions/single.html b/layouts/fictions/single.html
index e503f901..83db7d60 100644
--- a/layouts/fictions/single.html
+++ b/layouts/fictions/single.html
@@ -21,7 +21,6 @@
       </div>
 
       <!-- Comment -->
-      {{ partial "components/like-button.html" . }}
       {{ partial "components/comment.html" . }}
     </article>
 {{ end }}
diff --git a/layouts/library/single.html b/layouts/library/single.html
index c6797b0c..1f051da7 100644
--- a/layouts/library/single.html
+++ b/layouts/library/single.html
@@ -35,7 +35,6 @@
                 <p>于 {{ partial "components/date" . }} 读完</p>
             </div>
         </div>
-        {{ partial "components/like-button.html" . }}
         {{ partial "components/comment.html" . }}
     </article>
 {{ end }}
diff --git a/layouts/partials/components/like-button.html b/layouts/partials/components/like-button.html
deleted file mode 100644
index b94b6a26..00000000
--- a/layouts/partials/components/like-button.html
+++ /dev/null
@@ -1,23 +0,0 @@
-<div class="floating-like-container" id="like-container-{{ .File.UniqueID | urlize }}">
-  <div class="floating-like-button"
-       onclick="sendLike('{{ .File.UniqueID | urlize }}')"
-       id="like-btn-{{ .File.UniqueID | urlize }}"
-       title="为这篇文章献上心脏"
-       data-liked-title="你已经献上心脏了">
-    <img id="like-button-icon" src="/img/heart-organ.svg" class="invert-if-dark" alt="点赞" />
-    <div class="like-count-display" id="like-count-{{ .File.UniqueID | urlize }}">...</div>
-  </div>
-</div>
-
-<!-- 内嵌CSS样式 -->
-{{ with resources.Get "css/like-button.css" | minify }}
-<style>{{ .Content | safeCSS }}</style>
-{{ end }}
-
-<!-- 设置页面ID并内嵌JavaScript -->
-<script>
-  window.likeButtonPageId = "{{ .File.UniqueID | urlize }}";
-</script>
-{{ with resources.Get "js/like-button.js" | minify }}
-<script>{{ .Content | safeJS }}</script>
-{{ end }}
diff --git a/layouts/partials/components/post-tabs.html b/layouts/partials/components/post-tabs.html
index cb377fe4..9a714491 100644
--- a/layouts/partials/components/post-tabs.html
+++ b/layouts/partials/components/post-tabs.html
@@ -6,7 +6,7 @@
         <img src="/img/comments.svg" width="20" height="20" alt="评论" class="icon" />
         <span class="count-badge" id="comment-count">...</span>
       </button>
-      
+
       <!-- 点赞按钮 -->
       <div class="like-button-container" id="like-container-{{ .File.UniqueID | urlize }}">
         <button class="action-btn like-btn"
@@ -19,7 +19,7 @@
         </button>
       </div>
     </div>
-    
+
     <div class="right-actions">
       <a href="https://t.me/teaparty418" target="_blank" class="action-btn small-btn" title="Telegram 群组" data-umami-event="✈️ Click Telegram link from post tabs">
         <img src="/img/paper-plane.svg" width="16" height="16" alt="Telegram" class="icon" />
@@ -36,221 +36,12 @@
   </div>
 </div>
 
-<style>
-.post-actions-container {
-  margin: 2rem 0 1rem 0;
-}
-
-.post-actions-nav {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 1.5rem;
-}
-
-.left-actions {
-  display: flex;
-  gap: 0.5rem;
-}
-
-.right-actions {
-  display: flex;
-  gap: 0.25rem;
-}
-
-.action-btn {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  gap: 6px;
-  min-width: 48px;
-  height: 48px;
-  padding: 0 8px;
-  border: none;
-  background: transparent;
-  color: #666;
-  cursor: pointer;
-  text-decoration: none;
-  position: relative;
-  transition: all 0.2s ease;
-}
-
-.action-btn:hover {
-  background: rgba(0, 0, 0, 0.05);
-  border-radius: 8px;
-}
-
-/* 右侧小按钮样式 */
-.small-btn {
-  min-width: 32px;
-  height: 32px;
-  padding: 0 4px;
-}
-
-.small-btn:hover {
-  background: transparent;
-  opacity: 0.7;
-}
-
-/* 图标样式 */
-.icon {
-  filter: invert(0.4);
-  flex-shrink: 0;
-}
-
-/* Tooltip 样式 */
-.action-btn::before {
-  content: attr(title);
-  position: absolute;
-  bottom: 100%;
-  left: 50%;
-  transform: translateX(-50%) translateY(5px);
-  background: rgba(0, 0, 0, 0.8);
-  color: white;
-  padding: 6px 10px;
-  border-radius: 4px;
-  font-size: 12px;
-  white-space: nowrap;
-  opacity: 0;
-  visibility: hidden;
-  transition: all 0.3s ease;
-  pointer-events: none;
-  margin-bottom: 8px;
-  z-index: 1000;
-}
-
-.action-btn:hover::before {
-  opacity: 1;
-  visibility: visible;
-  transform: translateX(-50%) translateY(0);
-}
-
-.like-button-container {
-  position: relative;
-}
-
-.like-icon {
-  filter: invert(0.4);
-  flex-shrink: 0;
-  transition: all 0.3s ease;
-}
-
-.liked .like-icon {
-  filter: brightness(0) saturate(100%) invert(8%) sepia(100%) saturate(7500%) hue-rotate(0deg) brightness(70%) contrast(150%);
-  animation: heartbeat 1.5s ease-in-out infinite;
-}
-
-.count-badge {
-  font-size: 12px;
-  font-weight: bold;
-  color: #666;
-  min-width: 16px;
-  text-align: center;
-  background: rgba(255, 255, 255, 0.9);
-  border-radius: 10px;
-  padding: 2px 6px;
-  box-shadow: 0 1px 3px rgba(0,0,0,0.1);
-}
-
-.liked .count-badge {
-  color: #8B0000;
-}
-
-.comments-section {
-  margin-top: 1rem;
-}
-
-/* 心脏搏动动画 */
-@keyframes heartbeat {
-  0%, 100% { transform: scale(1); }
-  25% { transform: scale(1.1); }
-  50% { transform: scale(1.2); }
-  75% { transform: scale(1.1); }
-}
-
-/* 暗色主题适配 */
-@media (prefers-color-scheme: dark) {
-  .action-btn {
-    color: #999;
-  }
-  
-  .action-btn:hover {
-    background: rgba(255, 255, 255, 0.05);
-  }
-  
-  .small-btn:hover {
-    background: transparent;
-    opacity: 0.7;
-  }
-  
-  /* 暗色模式下的图标滤镜 */
-  .icon {
-    filter: invert(0.7) brightness(1.2);
-  }
-  
-  .like-icon {
-    filter: invert(0.7) brightness(1.2);
-  }
-  
-  .liked .like-icon {
-    filter: brightness(0) saturate(100%) invert(8%) sepia(100%) saturate(7500%) hue-rotate(0deg) brightness(70%) contrast(150%);
-    animation: heartbeat 1.5s ease-in-out infinite;
-  }
-  
-  .action-btn::before {
-    background: rgba(255, 255, 255, 0.9);
-    color: #000;
-  }
-  
-  .count-badge {
-    color: #999;
-    background: rgba(0, 0, 0, 0.7);
-  }
-}
-
-/* 移动端适配 */
-@media (max-width: 768px) {
-  .post-actions-nav {
-    gap: 0.5rem;
-  }
-  
-  .left-actions {
-    gap: 0.5rem;
-  }
-  
-  .right-actions {
-    gap: 0.25rem;
-  }
-  
-  .action-btn {
-    min-width: 44px;
-    height: 44px;
-    padding: 0 6px;
-  }
-  
-  .small-btn {
-    min-width: 28px;
-    height: 28px;
-    padding: 0 2px;
-  }
-  
-  .action-btn::before {
-    left: 50%;
-    transform: translateX(-50%) translateY(5px);
-  }
-  
-  .action-btn:hover::before {
-    transform: translateX(-50%) translateY(0);
-  }
-}
-</style>
-
 <script>
 // 评论展开/收起功能
 document.addEventListener('DOMContentLoaded', function() {
   const commentsToggle = document.getElementById('comments-toggle');
   const commentsSection = document.getElementById('comments-section');
-  
+
   if (commentsToggle && commentsSection) {
     commentsToggle.addEventListener('click', function() {
       if (commentsSection.style.display === 'none') {
@@ -268,20 +59,20 @@ document.addEventListener('DOMContentLoaded', function() {
 function fetchGiscusCommentCount() {
   const commentCountEl = document.getElementById('comment-count');
   if (!commentCountEl) return;
-  
+
   // 设置初始值
   commentCountEl.textContent = '0';
-  
+
   // 监听 Giscus 的消息事件
   window.addEventListener('message', function(event) {
     if (event.origin !== 'https://giscus.app') return;
-    
+
     const giscusData = event.data;
-    
+
     // 检查是否为 IMetadataMessage - 数据结构是 {giscus: {discussion: {...}}}
     if (giscusData.giscus && giscusData.giscus.discussion) {
       const discussion = giscusData.giscus.discussion;
-      
+
       // 计算总评论数：主评论数 + 回复数
       const totalComments = (discussion.totalCommentCount || 0) + (discussion.totalReplyCount || 0);
       commentCountEl.textContent = totalComments.toString();
@@ -295,15 +86,15 @@ function fetchGiscusCommentCount() {
   if (!pageId) {
     return;
   }
-  
+
   const countEl = document.getElementById("like-count-" + pageId);
   const btnEl = document.getElementById("like-btn-" + pageId);
   const containerEl = document.getElementById("like-container-" + pageId);
-  
+
   if (!countEl || !btnEl || !containerEl) {
     return;
   }
-  
+
   function updateTooltip() {
     if (containerEl.classList.contains('liked')) {
       btnEl.setAttribute('title', btnEl.getAttribute('data-liked-title'));
@@ -311,7 +102,7 @@ function fetchGiscusCommentCount() {
       btnEl.setAttribute('title', '为这篇文章献上心脏');
     }
   }
-  
+
   function fetchLikes() {
     fetch("https://like.guhub.cn/like/" + pageId)
       .then(resp => resp.json())
@@ -327,7 +118,7 @@ function fetchGiscusCommentCount() {
         countEl.innerText = "❌";
       });
   }
-  
+
   window.sendLike = function(pageId) {
     if (localStorage.getItem("liked_" + pageId)) return;
 
@@ -336,7 +127,7 @@ function fetchGiscusCommentCount() {
         umami.track('👍 Hit Like Button');
       }
     }
-    
+
     fetch("https://like.guhub.cn/like/" + pageId, { method: "POST" })
       .then(resp => resp.json())
       .then(data => {
@@ -350,7 +141,7 @@ function fetchGiscusCommentCount() {
         alert("点赞失败，请稍后再试");
       });
   };
-  
+
   // 初始化
   fetchLikes();
 })();
@@ -359,4 +150,4 @@ function fetchGiscusCommentCount() {
 document.addEventListener('DOMContentLoaded', function() {
   fetchGiscusCommentCount();
 });
-</script>
\ No newline at end of file
+</script>
diff --git a/layouts/partials/head/css.html b/layouts/partials/head/css.html
index bf041938..ca636713 100644
--- a/layouts/partials/head/css.html
+++ b/layouts/partials/head/css.html
@@ -23,6 +23,12 @@
 {{- end }}
 
 <!-- theme css -->
-{{ with resources.Get "css/index.scss" | css.Sass | minify }}
+{{ with resources.Get "css/global.scss" | css.Sass | minify }}
 <style>{{ .Content | safeCSS }}</style>
 {{ end }}
+
+{{- if or (in .Section "posts") (in .Section "cards") (in .Section "library") (eq .Type "single") }}
+{{ with resources.Get "css/content.scss" | css.Sass | minify }}
+<style>{{ .Content | safeCSS }}</style>
+{{ end }}
+{{- end }}