style: enhancement

lib/default-theme/styles/code.styl

@@ -30,7 +30,8 @@ div[class*="language-"]
     user-select none
     padding-top 1.3rem
     position absolute
-    z-index 0
+    top 0
+    left 0
     width 100%
     line-height 1.4
     .highlighted
@@ -46,23 +47,46 @@ div[class*="language-"]
     font-size 0.75rem
     color rgba(255, 255, 255, 0.4)
   &[line-numbers-mode]
-    position relative
+    &::after
+      content ''
+      position absolute
+      z-index 2
+      top 0
+      left 0
+      width $lineNumbersWrapperWidth
+      height 100%
+      border-radius 6px 0 0 6px
+      border-right 1px solid rgba(0, 0, 0, 66%)
+      background-color $codeBgColor
+    .highlight-lines
+      .highlighted
+        position relative
+        &:before
+          content ' '
+          position absolute
+          z-index 3
+          left 0
+          top 0
+          display block
+          width $lineNumbersWrapperWidth
+          height 100%
+          background-color rgba(0, 0, 0, 66%)
     pre
-      padding-left $lineNumbersWrapperWidth
+      padding-left $lineNumbersWrapperWidth + 1 rem
       vertical-align middle
     .line-numbers-wrapper
       position absolute
-      background-color $codeBgColor
+      top 0
       width $lineNumbersWrapperWidth
-      border-radius 6px
       text-align center
-      color rgba(255, 255, 255, 0.4)
+      color rgba(255, 255, 255, 0.3)
       padding 1.25rem 0
-      top 0
       line-height 1.4
       br
         user-select none
       .line-number
+        position relative
+        z-index 4
         user-select none
         font-size 0.85em