fix: move new styling into scss files

resources/assets/sass/components/_post.scss

@@ -1,6 +1,20 @@
 @use "../abstracts/mixin" as *;
 @use "../abstracts/variables" as *;
 
+%sentence {
+  font-size: 12px;
+  font-style: italic;
+  line-height: 1.3;
+  text-align: right;
+  color: $text-description-color;
+  display: block;
+  width: 100%;
+
+  span {
+    padding: 0 5px;
+  }
+}
+
 .post_container {
   @include container;
   @media (min-width: 768px) {
@@ -30,17 +44,11 @@
     }
 
     .sentence {
-      font-size: 12px;
-      font-style: italic;
-      line-height: 1.3;
-      text-align: right;
-      color: $text-description-color;
-      display: block;
-      width: 100%;
+      @extend %sentence
+    }
 
-      span {
-        padding: 0 5px;
-      }
+    @at-root .box.featured .sentence {
+      @extend %sentence
     }
 
     blockquote {
@@ -106,6 +114,22 @@
     }
   }
 }
+
+%post-tags-link {
+  display: block;
+  width: 4rem;
+  padding: 6px 15px 7px;
+  border-radius: 3px;
+  background-image: linear-gradient(to left, #0d1ca3, #45aaf8);
+  font-family: Nunito, serif;
+  font-size: 10px;
+  font-weight: bold;
+  text-align: center;
+  color: $text-inverted-color;
+  text-decoration: none;
+  text-transform: uppercase;
+}
+
 .post_tags {
   @include reset-list;
   height: 31px;
@@ -116,17 +140,11 @@
     margin-right: 10px;
 
     a {
-      display: block;
-      padding: 6px 15px 7px;
-      border-radius: 3px;
-      background-image: linear-gradient(to left, #0d1ca3, #45aaf8);
-      font-family: Nunito, serif;
-      font-size: 10px;
-      font-weight: bold;
-      text-align: center;
-      color: $text-inverted-color;
-      text-decoration: none;
-      text-transform: uppercase;
+      @extend %post-tags-link
+    }
+
+    @at-root #schedule .onair {
+      @extend %post-tags-link
     }
   }
 }