diff --git a/layout/_common/header.pug b/layout/_common/header.pug
index c9f51e9425c0fdd1f0835f610b649a6b340a74b3..2246c33e8c15d3b43c69d7f1860ed8f19eefe9a8 100644
--- a/layout/_common/header.pug
+++ b/layout/_common/header.pug
@@ -5,7 +5,7 @@ header#header(
         theme.header.bg_image.url : " "
   })`
 )
-  nav.header-nav
+  nav.header-nav.slider-up
     div.header-nav-inner
       div.fa.fa-bars.header-nav-menu-icon
 
diff --git a/source/css/_common/main.styl b/source/css/_common/main.styl
index 416d38c5ce84acb827c68774f7218da927c8013e..03de6b6c872098174af8f496b1c3dcd1a3934ad6 100644
--- a/source/css/_common/main.styl
+++ b/source/css/_common/main.styl
@@ -8,7 +8,7 @@ setUlStyle(content, hoverColor)
     color: $ul-list-color
     transition: color .2s ease
     transform: scale(.6)
-    @extend $font-face
+    @extend $font-face-awesome
 
   &:hover
     &::before
@@ -46,7 +46,7 @@ setUlStyle(content, hoverColor)
         color: $h-link-logo-color
         opacity: 0
         transition: opacity .1s ease
-        @extend $font-face
+        @extend $font-face-awesome
 
     &:hover
       &::after
diff --git a/source/css/_common/notification.styl b/source/css/_common/notification.styl
index 062a5b76c8b0b9b343f6f03adc66fccf1a16b19a..4c65de8ffedce272eda7f610bba41400e9c021cf 100644
--- a/source/css/_common/notification.styl
+++ b/source/css/_common/notification.styl
@@ -9,6 +9,7 @@
   position: relative
   border-radius: 3px
   padding: 8px 12px
+  font-size: $font-size-large
   line-height: 1rem
   color: $black-light
   background-color: #fff
@@ -38,9 +39,5 @@
     & ~ i
       color: $alert-error
 
-  &-icon
-    font-size: 20px
-
   &-description
     margin-left: .5rem
-    font-size: 18px
diff --git a/source/css/_common/page.styl b/source/css/_common/page.styl
index 897c39c4bdddd772dc7bb0c7769dcdb11f73ffd8..24e00811e697b02e9a774722bf6491152f5fdcb3 100644
--- a/source/css/_common/page.styl
+++ b/source/css/_common/page.styl
@@ -69,16 +69,16 @@
         &::before
           color: $categories-list-dot-hover-color
 
-  &-count
-    padding-left: .3em
-    font-size: $font-size-base
-    color: $categories-post-count-color
+    &-count
+      padding-left: .3em
+      font-size: $font-size-base
+      color: $categories-post-count-color
 
-    &::before
-      content: '('
+      &::before
+        content: '('
 
-    &::after
-      content: ')'
+      &::after
+        content: ')'
 
 // Gallery in post / page.
 .gallery-image
diff --git a/source/css/_components/copy.styl b/source/css/_components/copy.styl
index 06dfb60580f05c5596f1050b8b9a8cced41e3810..980bc667742430e49d483898314f0e445a10a014 100644
--- a/source/css/_components/copy.styl
+++ b/source/css/_components/copy.styl
@@ -4,6 +4,7 @@
   right: 0
   width: 1.5rem
   height: 1.5rem
+  line-height: 1.5rem
   text-align: center
   color: $black-light
   cursor: pointer
diff --git a/source/css/_components/external-link.styl b/source/css/_components/external-link.styl
index 8cf4d2f7eabd2ad5ddbb788009c89cc7df692453..e0ac4fc8c4152f1e87e2cacd3f474839281ab399 100644
--- a/source/css/_components/external-link.styl
+++ b/source/css/_components/external-link.styl
@@ -11,7 +11,3 @@
 .post-title
   .external-link i
     font-size: .7em
-
-.article-sort-item
-  .external-link i
-    font-size: .55em
diff --git a/source/css/_components/tag-plugin/note.styl b/source/css/_components/tag-plugin/note.styl
index baa75c6651b28467796c9f04f41c119fbeb67867..2eb8c41e759ac7682cb93c7c4c41fb40f6f8ae07 100644
--- a/source/css/_components/tag-plugin/note.styl
+++ b/source/css/_components/tag-plugin/note.styl
@@ -17,19 +17,19 @@
       font-size: $font-size-base + 6px
 
     &.default::before
-      content: '\f0a9'
+      content: $note-default
       color: #777
 
     &.success::before
-      content: '\f058'
+      content: $note-success
       color: #42b983
 
     &.warning::before
-      content: '\f06a'
+      content: $note-warning
       color: #ecc91e
 
     &.danger::before
-      content: '\f056'
+      content: $note-danger
       color: #dc3b3b
 
   &.default
diff --git a/source/css/_global/base.styl b/source/css/_global/base.styl
index 149d88e264c6afa80d35324dcf89fd2b9dae45e0..7996c65832662fe1b415beb33719af0d27453600 100644
--- a/source/css/_global/base.styl
+++ b/source/css/_global/base.styl
@@ -65,7 +65,7 @@ hr
     font-size: 24px
     color: $hr-icon-color
     transform: translateY(-50% - 4px)
-    @extend $font-face
+    @extend $font-face-awesome
 
 blockquote
   border-left: 5px solid $quote-left-color
diff --git a/source/css/_highlight/highlight.styl b/source/css/_highlight/highlight.styl
index ef17e97c01adb6053cf3bcb4ee98def4f5cdaf8a..f3de00a1aafefe3c3cfb2d87a03ccd56fbc20c84 100644
--- a/source/css/_highlight/highlight.styl
+++ b/source/css/_highlight/highlight.styl
@@ -8,7 +8,7 @@ for lang in languages
   .highlight{'.' + lang}
     figcaption
       span
-        &::before
+        &:first-child::before
           content: lang
           margin: 0 .6rem
           color: alpha($highlight-header-color, .5)
@@ -44,20 +44,22 @@ for lang in languages
     background-color: $highlight-header-bg-color
 
     span
-      float: left
-      color: $highlight-header-color
+      &:first-child
+        float: left
+        color: $highlight-header-color
 
-    a
-      float: right
-      margin-right: 2rem
-      border-bottom: 0
+    span
+      &:nth-child(2)
+        float: right
+        margin-right: 2rem
 
   figcaption.custom
     padding: .1rem 0
     min-height: 1.5rem
 
-    span
-      margin: 0 1rem 0 .6rem
+    .custom-lang
+      float: left
+      margin: 0 .6rem
       color: alpha($highlight-header-color, .5)
 
   .gutter,
diff --git a/source/css/var.styl b/source/css/var.styl
index 284f1ac3fddc32f4e4711129429535bd70ab6804..b9b960f08385f7974949bbbb9938ff5d5f2a27f3 100644
--- a/source/css/var.styl
+++ b/source/css/var.styl
@@ -175,7 +175,7 @@ $font-weight-bolder     = 700
 // Icon content define
 // -------------------------------------------
 // All icon elements will inherit these attributes.
-$font-face
+$font-face-awesome
   font: normal normal normal 14px/1 FontAwesome;
   font-size: inherit;
   text-rendering: auto;
@@ -190,6 +190,11 @@ $icon-ul-list-3          = '\f0c8'
 
 $icon-hr                 = '\f0fb'
 
+$note-default            = '\f0a9'
+$note-success            = '\f058'
+$note-warning            = '\f06a'
+$note-danger             = '\f056'
+
 // -------------------------------------------
 // z-index list
 // -------------------------------------------
diff --git a/source/js/copy.js b/source/js/copy.js
index ed874f50ab305a647a616daa1076bd2e865d8eb7..1ac85473c027794d19b97cbeb465c5618f465b78 100644
--- a/source/js/copy.js
+++ b/source/js/copy.js
@@ -10,7 +10,7 @@ $(document).ready(function () {
         .filter(function (e) { return e !== CODEBLOCK_CLASS_NAME; });
       var codeHeader = $(
         '<figcaption class="custom">' +
-          '<span>' + lang + '</span>' +
+          '<div class="custom-lang">' + lang + '</div>' +
         '</figcaption>'
       )[0];