From 3cac6a33aad67bdad0a3b8129a3056263cd35bed Mon Sep 17 00:00:00 2001
From: Ahmed Abdelhalim <pm@a14m.dev>
Date: Thu, 6 May 2021 00:13:26 +0200
Subject: Style the skills section

---
 app/base.styl | 31 ++++++++++++++++++++++++++++++-
 1 file changed, 30 insertions(+), 1 deletion(-)

(limited to 'app/base.styl')

diff --git a/app/base.styl b/app/base.styl
index 1dd9cd7..43be22d 100644
--- a/app/base.styl
+++ b/app/base.styl
@@ -1,3 +1,5 @@
+secondaryColor = #DB0A16
+
 @media (prefers-color-scheme: dark) {
   html {
     color: #FFFFFF
@@ -30,7 +32,7 @@ main {
 a:link, a:visited, a:hover, a:active {
   text-decoration: none
   color: inherit
-  border-bottom: 1px solid #DB0A16
+  border-bottom: 1px solid secondaryColor
 }
 
 // Header section styling
@@ -89,3 +91,30 @@ article {
     margin-top: 2.5em
   }
 }
+
+.skills {
+  dl {
+    display: flex
+    flex-flow: row wrap
+    // justify-content: space-between;
+  }
+
+  dt {
+    min-width: 15%
+    font-weight: 900
+    text-align: right
+    @media screen and (max-width: 740px) {
+      text-align: left
+    }
+  }
+
+  dd {
+    width: 80%
+    margin-left: 30px
+    margin-bottom: 0.1em
+    @media screen and (max-width: 740px) {
+      margin-bottom: 1em
+      width: 100%
+    }
+  }
+}
-- 
cgit v1.2.3