Feature: Allow displaying weak borders for list section

The UI gets cluttered if a list section contains too many elements,
allow displaying a weak border below list sections - ensures a
boundary of separation between mutiple elements

_config.yml

@@ -64,6 +64,23 @@ content:
   - title: Projects # Title for the section
     layout: list # Type of content section (list/text)
     content:
+      - layout: left
+        border: weak  # Value of `weak` will display a weak border below this item. # Any 
+                      # other value (or no value) means no border will be displayed
+        title: Project name
+        link: Link to project (eg. sproogen.github.io/modern-resume-theme)(optional)
+        link_text: Link Text
+        additional_links:
+          - title:  Github page for project (eg. sproogen/modern-resume-theme)
+            icon: fab fa-github
+            url: Link to project (eg. sproogen.github.io/modern-resume-theme)(optional)
+          - title:  Github page for project (eg. sproogen/modern-resume-theme)
+            icon: fab fa-github
+            url: Link to project (eg. sproogen.github.io/modern-resume-theme)(optional)
+        quote: >
+          Short overview of the project (optional)
+        description: | # this will include new lines to allow paragraphs
+          Description about the work on/with the project
       - layout: left
         title: Project name
         link: Link to project (eg. sproogen.github.io/modern-resume-theme)(optional)

_includes/section-list.html

@@ -1,5 +1,5 @@
 {% for item in include.content %}
-  <div class="row clearfix layout layout-{{item.layout | default: 'left'}}">
+  <div class="row clearfix layout layout-{{item.layout | default: 'left'}} border-{{item.border | default: 'no'}}">
     <div class="col-xs-12 col-sm-4 col-md-3 col-print-12 details">
       <h4>{{ item.title }}</h4>
       {%- if item.sub_title -%}<p><b>{{ item.sub_title }}</b></p>{%- endif -%}

_sass/modern-resume-theme.scss

@@ -58,6 +58,11 @@
   }
 }
 
+.border-weak  {
+  padding-bottom: 8px;
+  border-bottom: dashed 1px #CCCCCC;
+}
+
 .layout {
   margin-top: 3rem;
   display: flex;