Add some variables to the scss files

Use the period API call for the program schema

resources/assets/sass/components/_post.scss

@@ -1,4 +1,5 @@
 @use "../abstracts/mixin" as *;
+@use "../abstracts/variables" as *;
 
 .post_container {
   @include container;
@@ -32,7 +33,7 @@
         font-size: 10px;
         font-weight: bold;
         text-align: center;
-        color: #fff;
+        color: $text-inverted-color;
         text-decoration: none;
         text-transform: uppercase;
       }
@@ -44,7 +45,7 @@
     font-family: Nunito, serif;
     font-size: 15px;
     line-height: 1.6;
-    color: #282828;
+    color: $text-dark-color;
 
     h3 {
       font-size: 15px;
@@ -55,7 +56,7 @@
       font-style: italic;
       line-height: 3.17;
       text-align: right;
-      color: #585858;
+      color: $text-description-color;
       display: block;
       width: 100%;
 
@@ -79,7 +80,7 @@
         font-size: 12px;
         font-style: normal;
         line-height: 3.17;
-        color: #585858;
+        color: $text-description-color;
       }
     }
 
@@ -89,13 +90,10 @@
       li {
         float: left;
         margin-right: 10px;
-        font-family: Nunito, serif;
-        font-size: 12px;
-        font-weight: 500;
-        line-height: 3.17;
-        color: #666;
+        @include font_small;
+        color: $text-secondary-color;
         a {
-          color: #666;
+          color: $text-secondary-color;
           text-decoration: none;
         }
         i {