Merge pull request #510 from GZTimeWalker/dev

Add the layout of kbd tag

source/css/_layout/post.styl

@@ -161,6 +161,20 @@ no-beautify()
   iframe
     margin: 0 0 1rem
 
+  kbd
+    margin: 0 3px
+    padding: 3px 5px
+    border-radius: 3px
+    border: 1px solid #b4b4b4
+    box-shadow: 0 1px 3px rgba(0,0,0,.25), 0 2px 1px 0 rgba(255,255,255,.6) inset
+    font-family: Monaco, 'Ubuntu Mono', monospace
+    font-size: 0.9em
+    font-weight: 600
+    background-color: #f8f8f8
+    color: #34495e
+    line-height: 1em
+    white-space: nowrap
+
   if hexo-config('beautify.enable') && hexo-config('beautify.field') == 'site'
     beautify()
   else if hexo-config('beautify.enable') && hexo-config('beautify.field') == 'post'

source/css/_mode/darkmode.styl

@@ -51,6 +51,11 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
       .aplayer
         filter: brightness(.8)
 
+      kbd
+        border-color: #696969
+        background-color: #525252
+        color: #e2f1ff
+
     // 頭部
     #page-header
       &.nav-fixed > #nav,
@@ -154,4 +159,4 @@ if hexo-config('darkmode.enable') || hexo-config('display_mode') == 'dark'
       background: #121212
 
     #operare_artitalk .c2
-      background: #121212
+      background: #121212

source/css/_mode/readmode.styl

@@ -163,6 +163,12 @@ if hexo-config('readmode')
         border-left: .2rem solid var(--gray)
         background-color: var(--readmode-light-color)
 
+      kbd
+        border: 1px solid var(--gray)
+        color: var(--font-color)
+        box-shadow: none
+        background-color: transparent
+
       .hide-toggle
         border: 1px solid var(--gray) !important