Add sponsor page

GuillaumeGomez · GuillaumeGomez · commit c604bd8ff0c8 · 2020-04-06T21:54:29.000+02:00
diff --git a/_sass/_layout.scss b/_sass/_layout.scss
@@ -313,15 +313,60 @@
     }
 }
 
-.blog {
-    background-color: #F7F5D7;
+.blog, .crates, .sponsors {
     border-radius: 5px;
     padding: 7px;
 }
 
+.crates, .sponsors {
+    margin-bottom: 7px;
+}
+
 .crates {
     background-color: #E6F5F9;
-    border-radius: 5px;
-    padding: 7px;
-    margin-bottom: 7px;
+}
+
+.sponsors {
+    text-align: center;
+    background-color: #fff0de;
+
+    > div {
+        display: inline-flex;
+
+        > svg {
+            height: 25px;
+        }
+    }
+}
+
+.blog {
+    background-color: #F7F5D7;
+}
+
+.thanks-sponsors {
+    padding-top: 15px;
+    font-size: 20px;
+    padding-bottom: 25px;
+}
+
+.sponsor-tiers {
+    margin-bottom: 20px;
+
+    > a {
+        display: block;
+        max-width: 75px;
+        text-align: center;
+        border: 1px solid #ccc;
+        border-radius: 4px;
+        padding: 5px;
+        text-decoration: none;
+
+        > img {
+            border-radius: 50%;
+        }
+
+        &:hover {
+            background-color: #e5f4ff;
+        }
+    }
 }
diff --git a/docs-src/sponsors.md b/docs-src/sponsors.md
@@ -0,0 +1,32 @@
+---
+layout: default
+---
+
+<p class="thanks-sponsors">Thanks to everyone supporting us on <a href="https://opencollective.com/gtk-rs">opencollective</a>!</p>
+
+## Platinum tier
+
+No sponsors in this tier yet.
+
+## Gold tier
+
+No sponsors in this tier yet.
+
+## Silver tier
+
+No sponsors in this tier yet.
+
+## Bronze tier
+
+<div class="sponsor-tiers">
+    <a href="https://opencollective.com/alistair">
+        <img alt="Alistair" src="/images/alistair.png">
+        Alistair
+    </a>
+</div>
+
+## Other sponsors
+
+Other sponsors can be seen on our [opencollective][opencollective] page.
+
+[opencollective]: https://opencollective.com/gtk-rs
diff --git a/images/alistair.png b/images/alistair.png
diff --git a/index.md b/index.md
@@ -21,6 +21,15 @@ layout: wide
       <p class="page-heading"> Crates </p>
       {% include badges.html %}
     </div>
+    <div class="sponsors">
+      <div>
+        <svg version="1.1" viewBox="0 0 50 50">
+          <path d="M38.594,13.356l0.468-4.477L34.95,7.05l-1.829-4.112l-4.477,0.467L25,0.765l-3.644,2.641l-4.477-0.468L15.05,7.05 l-4.112,1.829l0.467,4.477L8.765,17l2.641,3.644l-0.468,4.477l4.113,1.829L16,29.085v19.72l9-5.625l9,5.625V29.085l0.95-2.135 l4.112-1.829l-0.467-4.477L41.235,17L38.594,13.356z M25,40.821l-7,4.375V30.945l3.356-0.35L25,33.235l3.644-2.641L32,30.945v14.25 L25,40.821z M36.922,23.883l-3.487,1.552l-1.552,3.487l-3.793-0.396L25,30.765l-3.09-2.239l-3.793,0.396l-1.552-3.487l-3.487-1.552 l0.396-3.793L11.235,17l2.239-3.09l-0.396-3.793l3.487-1.552l1.552-3.487l3.793,0.396L25,3.235l3.09,2.239l3.793-0.396l1.552,3.487 l3.487,1.552l-0.396,3.793L38.765,17l-2.239,3.09L36.922,23.883z"></path>
+          <path d="M25,7c-5.514,0-10,4.486-10,10s4.486,10,10,10s10-4.486,10-10S30.514,7,25,7z M25,25c-4.411,0-8-3.589-8-8s3.589-8,8-8   s8,3.589,8,8S29.411,25,25,25z"></path>
+        </svg>
+        <a href="{{site.baseurl}}/docs-src/sponsors">Our sponsors</a>
+      </div>
+    </div>
     <div class="blog">
       <p class="page-heading"> Announcements </p>
       {% for post in site.categories.front limit:3 %}
