[gtk-web/new-website: 133/191] updated documentation page layout

[Emmanuele Bassi <ebassi src gnome org>]

commit 35a8d65903bd2310d90d357a4d7ac710ce892566
Author: ravgeetdhillon <ravgeetdhillon gmail com>
Date:   Sun Jul 28 18:16:15 2019 +0530

    updated documentation page layout

 _data/navigation.yml        |  6 ++++++
 _layouts/documentation.html | 10 +++++-----
 assets/css/index.css        |  3 +++
 assets/css/markdown.css     |  6 +++---
 4 files changed, 17 insertions(+), 8 deletions(-)
---
diff --git a/_data/navigation.yml b/_data/navigation.yml
index 46b005f..62bdc9a 100644
--- a/_data/navigation.yml
+++ b/_data/navigation.yml
@@ -135,16 +135,22 @@ social_links:
 sidebar_sections:
   - title: Getting Started
     name: getting-started
+    icon: fas fa-cogs
   - title: Installations
     name: installations
+    icon: fas fa-box-open
   - title: Language Bindings
     name: language-bindings
+    icon: fas fa-random
   - title: Dev Tools
     name: dev-tools
+    icon: fas fa-tools
   - title: API References
     name: apis
+    icon: fas fa-cubes
   - title: Architecture
     name: architecture
+    icon: fas fa-vector-square
 
 # to add links to the sidebar on the documentation pages of the website, add a link with the following 
attributes:
 #   title: the display text for the section
diff --git a/_layouts/documentation.html b/_layouts/documentation.html
index 71a3e21..59ab706 100644
--- a/_layouts/documentation.html
+++ b/_layouts/documentation.html
@@ -12,21 +12,21 @@ any changes made to this file will affect all the documentation pages
     <div class="row">
       <div class="col-lg-3 col-md-4 small p-0 nav-side" id="mySidenav">
         <div class="text-break bg-white p-0 pt-2 pt-md-4 px-md-4 h-100">
-          <a href="javascript:void(0)" class="btn d-md-none btn-close mt-2" onclick="closeSideNav()"><i 
class="fas fa-times fa-halfx"></i></a>
+          <a href="#" class="btn d-md-none btn-close mt-2" onclick="closeSideNav()"><i class="fas fa-times 
fa-halfx"></i></a>
           <ul class="list-group">
             {% for section in site.data.navigation.sidebar_sections %}
-            <li class="list-group-item border-0 group-header pb-4"><a href="{{ '/docs/' | prepend: site.url 
}}{{ section.name }}/" class="text-dark"><strong>{{ section.title }}</strong></a>
+            <li class="list-group-item border-0 group-header pb-4"><a href="{{ '/docs/' | prepend: site.url 
}}{{ section.name }}/" class="text-dark"><i class="{{ section.icon }} fa-fw"></i> <strong>{{ section.title 
}}</strong></a>
               {% assign sidebar_links = site.data.navigation.sidebar_links | where: "section", section.title 
%}
               <ul class="list-group">
                 {% for link in sidebar_links %}
                   {% if link.external %}
-                    <li class="list-group-item border-0 p-0 py-1"><a href="{{ link.href }}" 
class="text-muted stretched-link">{{ link.title }}</a></li>
+                    <li class="list-group-item border-0 p-0 py-1 padding-icon"><a href="{{ link.href }}" 
class="text-muted stretched-link">{{ link.title }}</a></li>
                   {% else %}
                     {% assign url_last = page.url | split: '/' %}
                     {% if link.name == url_last.last %}
-                      <li class="list-group-item border-top-0 border-bottom-0 border-right-0 
border-secondary rounded-0 p-0 py-1 bg-light my-1"><a href="{{ '/docs/' | prepend: site.url }}{{ section.name 
}}/{{ link.name }}/" class="text-muted stretched-link pl-2">{{ link.title }}</a></li>
+                      <li class="list-group-item padding-icon border-top-0 border-bottom-0 border-right-0 
border-secondary rounded-0 p-0 py-1 bg-light my-1"><a href="{{ '/docs/' | prepend: site.url }}{{ section.name 
}}/{{ link.name }}/" class="text-muted stretched-link">{{ link.title }}</a></li>
                     {% else %}
-                      <li class="list-group-item border-0 p-0 py-1"><a href="{{ '/docs/' | prepend: site.url 
}}{{ section.name }}/{{ link.name }}/" class="text-muted stretched-link">{{ link.title }}</a></li>
+                      <li class="list-group-item border-0 p-0 py-1 padding-icon"><a href="{{ '/docs/' | 
prepend: site.url }}{{ section.name }}/{{ link.name }}/" class="text-muted stretched-link">{{ link.title 
}}</a></li>
                     {% endif %}
                   {% endif %}
                 {% endfor %}
diff --git a/assets/css/index.css b/assets/css/index.css
index 09b6d82..98f8c61 100644
--- a/assets/css/index.css
+++ b/assets/css/index.css
@@ -445,4 +445,7 @@ h6.letter-spacing-custom,
 }
 pre {
     overflow-x: hidden;
+}
+.padding-icon {
+    padding-left: 23px !important;
 }
\ No newline at end of file
diff --git a/assets/css/markdown.css b/assets/css/markdown.css
index 8f0670b..2b6d48e 100644
--- a/assets/css/markdown.css
+++ b/assets/css/markdown.css
@@ -137,13 +137,13 @@ you can edit this file directly to change the appearance of certain elements tha
 }
 .markdown-body h1 {
     padding-bottom: 0.3em;
-    font-size: 2em;
-    border-bottom: 1px solid #eaecef;
+    font-size: 2.5em;
+    border-bottom: 1px solid var(--mdcolor);
 }
 .markdown-body h2 {
     padding-bottom: 0.3em;
     font-size: 1.5em;
-    border-bottom: 1px solid #eaecef;
+    border-bottom: 1px solid var(--mdcolor);
 }
 .markdown-body h3 {
     font-size: 1.25em;