codetapacademy · adelacecilia · Apr 8, 2021 · Apr 9, 2021 · Apr 14, 2021 · Apr 14, 2021
diff --git a/requirement/image/company-logo/bit-bee.png b/requirement/image/company-logo/bit-bee.png
diff --git a/src/_asset/image/company-logo/arcadia.png b/src/_asset/image/company-logo/arcadia.png
diff --git a/src/_asset/image/company-logo/argus.png b/src/_asset/image/company-logo/argus.png
diff --git a/src/_asset/image/company-logo/big-telematics.png b/src/_asset/image/company-logo/big-telematics.png
diff --git a/src/_asset/image/company-logo/bit-bee.png b/src/_asset/image/company-logo/bit-bee.png
diff --git a/src/_asset/image/company-logo/chemist-direct.png b/src/_asset/image/company-logo/chemist-direct.png
diff --git a/src/_asset/image/company-logo/colab.png b/src/_asset/image/company-logo/colab.png
diff --git a/src/_asset/image/company-logo/content-formula.png b/src/_asset/image/company-logo/content-formula.png
diff --git a/src/_asset/image/company-logo/direct-line-group.png b/src/_asset/image/company-logo/direct-line-group.png
diff --git a/src/_asset/image/company-logo/fifth9.png b/src/_asset/image/company-logo/fifth9.png
diff --git a/src/_asset/image/company-logo/rma.png b/src/_asset/image/company-logo/rma.png
diff --git a/src/_asset/image/company-logo/romaris.png b/src/_asset/image/company-logo/romaris.png
diff --git a/src/_asset/image/company-logo/solera.png b/src/_asset/image/company-logo/solera.png
diff --git a/src/_asset/image/company-logo/zeus-media.png b/src/_asset/image/company-logo/zeus-media.png
diff --git a/src/_component/about-me/about-me.pug b/src/_component/about-me/about-me.pug
@@ -12,6 +12,7 @@ include ../section-title/section-title
   .description-box__with-shadow
     each description in data['about-me'].descriptionList
       p.description=description
+
 .column(span="row")
 .column(span="row" height='10px')
   .button.button__pill--green

diff --git a/src/_component/config/reusable.scss b/src/_component/config/reusable.scss
@@ -0,0 +1,5 @@
+%rounder-border-list {
+  border-radius: 6px;
+  border: 2px solid #707070;
+  list-style-type: none;
+}
diff --git a/src/_component/experience/experience.pug b/src/_component/experience/experience.pug
@@ -0,0 +1,13 @@
+- var sectionTitle = data.experience.sectionTitle;
+include ../section-title/section-title
+
+.column(span="row" height='10px')
+.column(span="row")
+  ul.experience__list
+    each job in data.experience.jobList 
+      li=job.jobTitle 
+.column(span="row")
+.column(span="row" height='10px')
+  button.button__disc--blue
+    i.icon__arrow-down
+.column(span="row" height='10px')
diff --git a/src/_component/experience/experience.scss b/src/_component/experience/experience.scss
@@ -0,0 +1,3 @@
+.experience__list {
+  @extend %rounder-border-list
+}
diff --git a/src/_component/skills/skills.pug b/src/_component/skills/skills.pug
@@ -19,4 +19,9 @@ each skillType in data.skills.skillTypeList
       )=skill.label
 .column(span="row")
   .description-box__with-shadow
-    p.description=data.skills.description
+    p.description=data.skills.description
+    .column(span="row")
+.column(span="row" height='10px')
+  button.button__disc--blue
+    i.icon__arrow-down
+.column(span="row" height='10px')
diff --git a/src/_component/skills/skills.scss b/src/_component/skills/skills.scss
@@ -1,7 +1,5 @@
 .skills__list {
-  border-radius: 6px;
-  border: 2px solid #707070;
-  list-style-type: none;
+  @extend %rounder-border-list
 }
 
 .skills__item {

diff --git a/src/_data/experience.json b/src/_data/experience.json
@@ -0,0 +1,27 @@
+{
+  "sectionTitle": "Experience",
+  "jobList": [
+    {
+      "jobTitle": "Starter Web Developer",
+      "startDate": "2020 August",
+      "endDate": "2020 November",
+      "iconPath": "bit-bee.png",
+      "companyName": "BitBee",
+      "moreInfoList": [
+        "esklfjiekgjiekfjjdfheisjfeksjdf",
+        "hedfueifhdiufheiufhuierhfuie"
+      ]
+    },
+    {
+      "jobTitle": "Junior Web Developer",
+      "startDate": "2020 November",
+      "endDate": "Present",
+      "iconPath": "chemist-direct.png",
+      "companyName": "Chemist Direct",
+      "moreInfoList": [
+        "esklfjiekgjiekfjjdfheisjfeksjdf",
+        "hedfueifhdiufheiufhuierhfuie"
+      ]
+    }
+  ]
+}
diff --git a/src/index.pug b/src/index.pug
@@ -10,3 +10,4 @@ html
         include _component/about-me/about-me.pug
         include _component/connect/connect.pug
         include _component/skills/skills.pug
+        include _component/experience/experience.pug
diff --git a/src/style.scss b/src/style.scss
@@ -1,3 +1,4 @@
+@import "_component/config/reusable";
 @import "_component/layout/roboto-font";
 @import "_component/layout/layout";
 @import "_component/about-me/about-me";