From 6bd195a9b13454bf7fcac5afddac6cc6e4f76ca6 Mon Sep 17 00:00:00 2001
From: Mimi <1119186082@qq.com>
Date: Fri, 12 Jun 2020 12:05:08 +0800
Subject: [PATCH] Optimize header-anchor style

---
 _config.yml                                   |  2 +-
 .../_common/components/pages/schedule.styl    |  3 +--
 .../_common/components/post/post-expand.styl  | 22 +++++++++++++------
 .../css/_common/outline/header/bookmark.styl  |  3 +--
 source/css/_mixins.styl                       |  5 ++++-
 5 files changed, 22 insertions(+), 13 deletions(-)

diff --git a/_config.yml b/_config.yml
index 88011a8..45a2b23 100644
--- a/_config.yml
+++ b/_config.yml
@@ -189,7 +189,7 @@ social_icons:
 
 # Blog rolls
 links_settings:
-  icon: fa fa-link
+  icon: fa fa-globe
   title: Links
   # Available values: block | inline
   layout: block
diff --git a/source/css/_common/components/pages/schedule.styl b/source/css/_common/components/pages/schedule.styl
index 641649d..bba571d 100644
--- a/source/css/_common/components/pages/schedule.styl
+++ b/source/css/_common/components/pages/schedule.styl
@@ -42,12 +42,11 @@
       &::before {
         animation: dot-flash 1s alternate infinite ease-in-out;
         color: white;
-        content: '\f111';
         display: inline-block;
         font-size: 10px;
         margin-right: 25px;
         vertical-align: middle;
-        font-family-icons();
+        font-family-icons('\f111');
       }
     }
 
diff --git a/source/css/_common/components/post/post-expand.styl b/source/css/_common/components/post/post-expand.styl
index c6175bf..671e4fb 100644
--- a/source/css/_common/components/post/post-expand.styl
+++ b/source/css/_common/components/post/post-expand.styl
@@ -14,20 +14,28 @@
   h1, h2, h3, h4, h5, h6 {
     padding-top: 10px;
 
-    .header-anchor {
+    // Supported plugins: hexo-renderer-markdown-it hexo-renderer-marked
+    .header-anchor, .headerlink {
       border-bottom-style: none;
-      color: $grey-light;
+      color: inherit;
       float: right;
+      font-size: $font-size-small;
       margin-left: 10px;
-      visibility: hidden;
+      opacity: 0;
 
-      &:hover {
-        color: inherit;
+      &::before {
+        font-family-icons('\f0c1');
       }
     }
 
-    &:hover .header-anchor {
-      visibility: visible;
+    &:hover {
+      .header-anchor, .headerlink {
+        opacity: .5;
+
+        &:hover {
+          opacity: 1;
+        }
+      }
     }
   }
 
diff --git a/source/css/_common/outline/header/bookmark.styl b/source/css/_common/outline/header/bookmark.styl
index 54aec49..8bf36bf 100644
--- a/source/css/_common/outline/header/bookmark.styl
+++ b/source/css/_common/outline/header/bookmark.styl
@@ -12,10 +12,9 @@
 
   &::before {
     color: unquote(hexo-config('bookmark.color'));
-    content: '\f02e';
     font-size: 32px;
     line-height: 1;
-    font-family-icons();
+    font-family-icons('\f02e');
   }
 }
 
diff --git a/source/css/_mixins.styl b/source/css/_mixins.styl
index 209d4fd..8d806e5 100644
--- a/source/css/_mixins.styl
+++ b/source/css/_mixins.styl
@@ -108,7 +108,10 @@ flex-column() {
   justify-content: center;
 }
 
-font-family-icons() {
+font-family-icons($icon = '') {
+  if ($icon) {
+    content: $icon;
+  }
   font-family: 'Font Awesome 5 Free';
   font-weight: 900;
 }