From 9844b964a800bcc650544703c4443881f533edba Mon Sep 17 00:00:00 2001
From: Cotes Chung <11371340+cotes2020@users.noreply.github.com>
Date: Wed, 29 Sep 2021 16:34:22 +0800
Subject: [PATCH] Improve the alignment of code block

---
 _sass/addon/syntax.scss | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/_sass/addon/syntax.scss b/_sass/addon/syntax.scss
index ed35cd0..551ec9a 100644
--- a/_sass/addon/syntax.scss
+++ b/_sass/addon/syntax.scss
@@ -179,25 +179,28 @@ div {
 
     &.small {
       font-size: 70%;
-      margin-left: 0.25rem;
     }
   }
 
   // the label block
   span {
-    padding-left: 0.6rem;
+    padding-left: 0.35rem;
 
     &::after {
       content: attr(text-data);
-      margin-left: 0.3rem;
       font-size: 0.85rem;
       font-weight: 600;
       color: var(--lang-badge-color);
     }
 
-    @at-root [file] #{&} > i { // center the file icon
+    i {
+      margin: 0 0.5rem;
+    }
+
+    @at-root [file] #{&} > i {
       position: relative;
-      top: 1px;
+      top: 1px; // center the file icon
+      margin-left: 0.25rem;
     }
 
   }
@@ -245,6 +248,10 @@ div {
 
       border-radius: 0;
 
+      .highlight {
+        padding-left: 0.25rem;
+      }
+
       .code-header {
         border-radius: 0;
         padding-left: 0.4rem;