✨ feat: add pinned posts functionality (#424)

sass/parts/_posts_list.scss

@@ -3,11 +3,14 @@
     grid-template-columns: 1fr 8fr;
 }
 
+
+$padding: 2.5rem;
+
 .bloglist-meta {
     display: flex;
     align-items: flex-start;
     background-color: var(--navbar-color);
-    padding-block: 2.5rem;
+    padding-block: $padding;
 
     ul {
         margin-inline-end: 0.7rem;
@@ -34,9 +37,26 @@
 
 .bloglist-content {
     display: flex;
+    position: relative;
     align-items: flex-start;
     background-color: var(--navbar-color);
-    padding: 2.5rem 0;
+    padding: $padding 0;
+
+    .pinned-label {
+        display: flex;
+        position: absolute;
+        top: 0.8rem;
+        align-items: center;
+        gap: 0.3rem;
+        color: var(--meta-color);
+        font-weight: 300;
+        font-size: 0.8rem;
+    }
+
+    .pinned-label svg {
+        width: 0.8rem;
+        height: 0.8rem;
+    }
 
     div {
         flex: 1;
@@ -100,9 +120,13 @@
         grid-template-columns: 1fr;
     }
 
+    .pinned-label svg {
+        margin-bottom: -2px;
+    }
+
     .bloglist-meta {
-        padding-block: 2rem;
         border-bottom: 0;
+        padding-block: 2rem;
 
         ul {
             margin-block-end: 0;
@@ -121,6 +145,13 @@
         padding: 0;
         padding-bottom: 2rem;
 
+
+        .pinned-label {
+            position: static;
+            margin: 0;
+            margin-top: -1.9rem;
+        }
+
         div {
             width: 100%;
         }