Add hero section for home page

Author: Dhruvi16

content/comments-solid.png

@@ -3,8 +3,6 @@ _model: home
 _template: home.html
 ---
 block_content:
+
 #### hero ####
-title: Creative Commons Title
-----
-content:
-Creative Commons content
+_template: blocks/hero.html

content/contents.lr

@@ -1,11 +1,2 @@
 [block]
 name = Hero
-label = {{ this.title }}
-
-[fields.title]
-label = Title
-type = string
-
-[fields.content]
-label = Content
-type = text

content/creative-commons-remix-brands.png

@@ -1,4 +1,23 @@
-{% block title %}{{ this.title }}{% endblock %}
-<div>
-  {{ this.content }}
-</div>
+<section>
+  <h1 class="column is-9 is-paddingless">
+    We have been building
+    <span class="has-text-forest-green">free software</span> at
+    <span class="has-text-gold">Creative Commons</span> for over a decade.
+  </h1>
+  <div class="columns">
+    <div class="column is-one-third">
+      <p class="body-bigger margin-top-big">
+        We work on code and products that support digital creativity and
+        sharing, from usability of our legal tools to enabling discovery of
+        CC-licensed content.
+      </p>
+      <a class="button small is-info margin-top-bigger" href="/community">Join the Developer Community</a>
+      <br />
+      <a class="button small margin-top-normal" href="https://twitter.com/creativecommons"><i
+          class="icon twitter margin-right-small"></i>Follow us on twitter</a>
+    </div>
+    <div class="column">
+      <img src="./github.svg" />
+    </div>
+  </div>
+</section>

content/github.svg

@@ -149,7 +149,6 @@
         <div class="page py-3">
           <h1 class="page-title pb-3 mb-4">{% block header %}{{ this.title }}{% endblock %}</h1>
           {% block body %}{% endblock %}
-          <a id="back-to-top" href="#top" class="btn btn-dark btn-sm" role="button">Back to top</a>
         </div>
       </div>
     </div>

content/keyboard-solid.png

@@ -58,18 +58,6 @@ h2 {
   }
 }
 
-.page-title {
-  background-color: $white;
-  border: {
-    bottom-style: solid;
-    color: $brand-theme;
-    width: 10px;
-  }
-  padding-left: 0px;
-  font-weight: 600;
-  color: $text-color;
-}
-
 @mixin large-border-style {
   background-color: $white;
   padding-left: 0px;