Update title and description

Author: Dhruvi16

content/contributing-code/contents.lr

@@ -4,11 +4,10 @@ _template: page-with-toc.html
 ---
 title: Contribution Guidelines
 ---
+description: We do all of our development [on GitHub](https://github.com/creativecommons/). If you are not familiar with GitHub or pull requests, [here is an excellent guide to get started](https://guides.github.com/activities/hello-world/).
+---
 body:
 
-<p class="lead">Thank you for your interest in contributing to Creative Commons open source projects!</p>
-
-We do all of our development [on GitHub](https://github.com/creativecommons/). If you are not familiar with GitHub or pull requests, [here is an excellent guide to get started](https://guides.github.com/activities/hello-world/).
 
 ## Finding an issue
 

models/page.ini

@@ -6,6 +6,10 @@ label = {{ this.title }}
 label = Title
 type = string
 
+[fields.description]
+label = Title
+type = markdown
+
 [fields.body]
 label = Body
 type = markdown

themes/vocabulary_theme/templates/page-with-toc.html

@@ -1,6 +1,18 @@
 {% extends "layout.html" %}
-{% block title %}{{ this.title }}{% endblock %}
+
 {% block body %}
+  <div class="code-guidelines">
+    <header class="code-guidelines-title">
+      <div class="container is-paddingless">
+        <h1>{{ this.title }}</h1>
+        <div class="description">
+          {{this.description}}
+        </div>
+      </div>
+    </header>
+  </div>
+
+
   <div class="card toc-card bg-light">
     <div class="card-body">
       <ul class="toc list-unstyled">

webpack/sass/main.scss

@@ -35,3 +35,19 @@ a {
     }
   }
 }
+
+.code-guidelines {
+  .code-guidelines-title {
+    background-color: $color-lighter-gray;
+
+    .container {
+      @extend .padding-horizontal-bigger;
+
+      .description {
+        @extend .body-bigger;
+        @extend .padding-top-small;
+        @extend .padding-bottom-xl;
+      }
+    }
+  }
+}