From a9dab6e3eb0db678049f70f33f0148b397286823 Mon Sep 17 00:00:00 2001
From: xaoxuu <xaoxuu@gmail.com>
Date: Sun, 5 Apr 2020 01:34:26 +0800
Subject: [PATCH] update css

---
 source/css/_highlight/index.styl | 84 ++++++++++++++++++++++++--------
 source/css/_layout/article.styl  | 16 ++++--
 source/css/_layout/main.styl     |  6 +--
 3 files changed, 79 insertions(+), 27 deletions(-)

diff --git a/source/css/_highlight/index.styl b/source/css/_highlight/index.styl
index 5ebb993..c39602f 100644
--- a/source/css/_highlight/index.styl
+++ b/source/css/_highlight/index.styl
@@ -45,7 +45,7 @@
       margin-left: 0
       position: sticky
       left: 0
-      background-color: darken($color-codeblock, 5%)
+      background-color: darken($color-codeblock, 5)
       pre
         color: $color-meta
 
@@ -70,21 +70,23 @@
         padding: 4px 8px
 
   if hexo-config('style.body.highlight.language') == true
+    &.md .code:before,&.markdown .code:before
+      content: "md"
     &.yaml .code:before
       content: "YAML"
-    &.md .code:before
-      content: "md"
+    &.json .code:before
+      content: "JSON"
 
     &.html .code:before
       content: "HTML"
-    &.js .code:before
+    &.js .code:before,&.javascript .code:before
       content: "JS"
     &.css .code:before
-      content: "css"
+      content: "CSS"
     &.less .code:before
-      content: "less"
+      content: "Less"
     &.stylus .code:before
-      content: "stylus"
+      content: "Stylus"
 
     &.bash .code:before
       content: "bash"
@@ -92,13 +94,15 @@
       content: "shell"
     &.sh .code:before
       content: "sh"
+    &.ini .code:before
+      content: "ini"
 
     &.c .code:before
       content: "C"
     &.cpp .code:before
       content: "C++"
-    &.objc .code:before
-      content: "ObjC"
+    &.objc .code:before,&.objectivec .code:before
+      content: "Objective-C"
     &.swift .code:before
       content: "Swift"
 
@@ -108,6 +112,18 @@
       content: "Python"
     &.php .code:before
       content: "PHP"
+    &.rust .code:before
+      content: "Rust"
+    &.sql .code:before
+      content: "SQL"
+    &.ruby .code:before
+      content: "Ruby"
+    &.makefile .code:before
+      content: "Makefile"
+    &.go .code:before
+      content: "Go"
+    &.typescript .code:before
+      content: "TypeScript"
 
 
 
@@ -121,41 +137,41 @@ $hl-red = #EE2B29
 $hl-orange = #FB3F1B
 $hl-amber = #FD8607
 
-pre
+.highlight pre
   // 行
   // line-height: 1.5
-  .line
-    color: alpha($color-text, 90%)
+  .line,.params
+    color: alpha($color-text, .9)
 
   .marked
-    background-color: alpha(#FED542, 40%)
+    background-color: alpha(#FED542, .4)
     padding: 2px 8px 2px 0
     border-radius: 2px
     width: 100%
 
-  .title
+  .title, .attr, .attribute
     color: $color-md-indigo
 
   // 注释
   .comment
     color: alpha($color-p, .5)
 
-  .keyword, .javascript .function, .attr
+  .keyword, .meta-keyword, .javascript .function
     color: $hl-keyword
 
   .type, .built_in, .tag .name
     color: $color-md-light-blue
 
-  .variable, .attribute, .regexp, .ruby .constant, .xml .tag .title, .xml .pi, .xml .doctype, .html .doctype, .css .id, .css .class, .css .pseudo
+  .variable, .regexp, .ruby .constant, .xml .tag .title, .xml .pi, .xml .doctype, .html .doctype, .css .id, .css .class, .css .pseudo
     color: $hl-amber
 
-  .number, .preprocessor, .literal, .params, .constant
+  .number, .preprocessor, .literal, .constant
     color: $hl-amber
 
   .class, .ruby .class .title, .css .rules .attribute
     color: $color-md-orange
 
-  .string
+  .string, .meta-string
     color: darken($color-md-green, 10%)
 
   .value, .inheritance, .header, .ruby .symbol, .xml .cdata
@@ -168,7 +184,33 @@ pre
     color: #6699cc
 
 
+.highlight.html,.highlight.css,.highlight.less,.highlight.stylus
+  .line
+    .tag .name, .selector-tag
+      color: $hl-red
+    .selector-class, .selector-attr
+      color: $hl-amber
+    .attribute
+      color: $color-md-indigo
+    .number
+      color: $hl-cyan
 
-.html
-  .tag .name
-    color: $hl-red
+
+.highlight.objc,.highlight.objectivec,.highlight.swift
+  .line
+    .meta
+      color: $hl-keyword
+    .meta-string,.string
+      color: $hl-orange
+    .class
+      .title
+        color: $hl-blue
+    .comment
+      color: $hl-green
+
+.highlight.json
+  .line
+    .attr
+      color: $hl-orange
+    .literal
+      color: $color-md-indigo
diff --git a/source/css/_layout/article.styl b/source/css/_layout/article.styl
index 64d9008..db94862 100644
--- a/source/css/_layout/article.styl
+++ b/source/css/_layout/article.styl
@@ -88,10 +88,18 @@
       max-width: 100%
       margin: 0
       box-shadow: none
-  s
+  s,del
     opacity: 0.7
   u
     color: $color-hover
+  kbd
+    border-radius: $border-codeblock * 0.5
+    border: 1px solid darken($color-codeblock, 6)
+    background: $color-codeblock
+    padding-left: 4px
+    padding-right: 4px
+    margin-left: 2px
+    margin-right: 2px
   p
     margin-top: $gap-block
     margin-bottom: $gap-block
@@ -193,9 +201,11 @@
     background: $color-codeblock
     font-size: $fontsize-code
     font-family: $fontfamily-code
-    border: 1px solid darken($color-codeblock, 10%)
+    border: 1px solid darken($color-codeblock, 6)
     padding: $gap
-
+    border-radius: $border-codeblock
+    >code
+      background: transparent
   div>pre
     border-radius: $border-codeblock
     &>code
diff --git a/source/css/_layout/main.styl b/source/css/_layout/main.styl
index b35e0f2..6d630b5 100644
--- a/source/css/_layout/main.styl
+++ b/source/css/_layout/main.styl
@@ -71,7 +71,7 @@
 
   mobile-post()
     .post
-      .meta
+      div.meta
         margin-bottom: $gap
         .title
           font-size: $fontsize-h3
@@ -81,7 +81,7 @@
   .post-wrapper
     margin-bottom: $gap
     .post
-      .meta
+      div.meta
         margin-bottom: $gap
         .title
           font-size: $fontsize-h2
@@ -126,7 +126,7 @@
     h1
       font-weight: normal
       font-size: $fontsize-h1
-    .meta
+    div.meta
       color: $color-meta
       &#header-meta
         margin-top: 0