Refactor CSS

Signed-off-by: hossainemruz <hossainemruz@gmail.com>

assets/styles/components/buttons.scss

@@ -0,0 +1,15 @@
+.tags {
+  text-align: left;
+
+  li {
+    font-size: 0.5em;
+    list-style-type: none;
+    display: inline-block;
+    background: #248aaa;
+    margin-left: 0.1em;
+    margin-right: 0.1em;
+  }
+  a {
+    color: #f9fafc;
+  }
+}

assets/styles/components/cards.scss

@@ -0,0 +1,66 @@
+.post-card {
+  width: calc(100% / 3);
+  display: inline-flex;
+
+  .post-card-link {
+    text-decoration: none;
+  }
+
+  .card {
+    margin: 5px;
+    position: relative;
+    box-shadow: none;
+    transition: all 0.3s ease-out;
+    overflow: hidden;
+
+    &:hover,
+    &:focus {
+      box-shadow: 0px 8px 56px rgba(15, 80, 100, 0.16);
+      border: 1px solid #fff;
+      transition: all 0.3s ease-out;
+
+      .card-img-top {
+        transform: scale(1.2);
+        transition: all 0.3s ease-out;
+      }
+    }
+
+    .card-head {
+      height: 172px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      overflow: hidden;
+
+      .card-img-top {
+        transition: all 0.3s ease-out !important;
+      }
+    }
+    .card-body {
+      text-align: justify;
+      padding: 1.25rem !important;
+      padding-bottom: 0 !important;
+
+      .post-summary {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        display: -webkit-box;
+        max-height: 144px;
+        /* fallback */
+        -webkit-line-clamp: 5;
+        /* number of lines to show */
+        -webkit-box-orient: vertical;
+      }
+    }
+    .card-footer {
+      background: #fff;
+      margin-top: auto;
+
+      span {
+        font-size: 10pt;
+        color: #6c757d !important;
+        padding-top: 5px;
+      }
+    }
+  }
+}