Make skills card and projects card consistent

layouts/partials/cards/skill.html

@@ -2,11 +2,9 @@
   <div class="card">
     <div class="card-head d-flex">
       {{ if .icon }}
-      <img class="card-img-sm" src="{{ .icon }}" alt="{{ .name }}" />
-      {{ else }}
-      <i class="fas fas fa-tools"></i>
+        <img class="card-img-xs" src="{{ .icon }}" alt="{{ .name }}" />
       {{ end }}
-      <h4 class="card-title">{{ .name }}</h4>
+      <h5 class="card-title">{{ .name }}</h5>
     </div>
     <div class="card-body">
       <p class="card-text">{{ .summary | markdownify }}</p>

layouts/partials/experiences/experience-info.html

@@ -1,7 +1,7 @@
 <div class="col-10 col-lg-8">
   <div class="experience-entry-heading">
-    <h5>{{ .designation }}</h5>
-    <h6><a href="{{ .company.url }}">{{ .company.name }}</a></h6>
+    <h5><a href="{{ .company.url }}">{{ .company.name }}</a></h5>
+    <h6>{{ .designation }}</h6>
     <p class="text-muted">{{ .start }} - {{ if .end }} {{ .end }} {{ else }}Present{{ end }}, {{ .company.location }}</p>
   </div>
   <p>{{ .company.overview | markdownify }}</p>

static/assets/css/projects.css

@@ -1,12 +1,11 @@
 .projects .card .card-header {
-  padding: 10px;
+  background-color: #f9fafc;
+  padding: 0.7rem;
+  padding-bottom: 0rem;
 }
 
 .projects .card .card-img-xs {
-  margin-top: 0px;
-  margin-left: 0px;
-  margin-bottom: 5px;
-  margin-right: 10px;
+  margin-right: 0.5rem;
 }
 
 .card .card-header .sub-title span:nth-child(1) {
@@ -16,17 +15,17 @@
   float: right;
 }
 
-.projects .card .card-header {
-  background-color: #f9fafc;
+.projects .card .card-body {
+  padding: 0.7rem;
 }
 
 .projects .card .card-header .sub-title {
   color: #8392a5;
-  margin-top: 5px;
+  margin-top: 0.4rem;
 }
 
 .filtr-projects {
-  padding: 15px !important;
+  padding: 1rem !important;
 }
 
 /* ============= Device specific fixes ======= */
@@ -57,6 +56,6 @@
 
 @media only screen and (max-width: 576px) {
   .projects .btn {
-    margin-top: 5px;
+    margin-top: 0.3125rem;
   }
 }

static/assets/css/skills.css

@@ -1,28 +1,23 @@
-.skills .card .card-head img {
-  margin: 10px;
+.skills .card .card-head {
+  background-color: #f9fafc;
+  height: fit-content;
+  padding: 0.7rem;
+  padding-bottom: 0rem;
+  border-bottom: 0.0625rem solid rgba(0, 0, 0, 0.125);
 }
 
-.skills .card .card-head i{
-  font-size: 1.5rem;
-  margin: 10px;
-  margin-top: 15px;
+.skills .card .card-img-xs {
+  margin-right: 0.5rem;
 }
 
 .skills .card {
-  margin-top: 10px;
-  margin-bottom: 10px;
+  margin-top: 0.5rem;
+  margin-bottom: 0.5rem;
 }
 
 .skills .card .card-body {
-  padding-top: 0;
-}
-
-.skills .card .card-head {
-  height: fit-content;
-}
-
-.skills .card .card-head h4 {
-  margin-top: 0.8rem;
+  padding-top: 0.2rem;
+  padding-left: 0.7rem;
 }
 
 /* ============= Device specific fixes ======= */