Switch to contribution token instead of proposals

No vetos yet, and only for collections (not creation).

closes #20

app/styles/_layout.scss

@@ -36,10 +36,6 @@ main section {
 
   @include media-max(small) {
     margin-bottom: 5rem;
-
-    &#proposals-open, &#proposals-closed {
-      margin-top: 0;
-    }
   }
 
   header {

app/styles/app.scss

@@ -119,3 +119,4 @@ button, input[type=submit] {
 @import "components/contributor-list";
 @import "components/add-contributor";
 @import "components/proposal-list";
+@import "components/contribution-list";

app/styles/components/_contribution-list.scss

@@ -0,0 +1,128 @@
+main section {
+  @include media-max(small) {
+    &#contributions-unconfirmed, &#contributions-confirmed {
+      margin-top: 0;
+    }
+  }
+}
+
+ul.contribution-list {
+  clear: both;
+  width: 100%;
+  list-style: none;
+
+  li {
+    display: grid;
+    grid-template-columns: auto 5rem;
+    grid-row-gap: 0.5rem;
+    padding: 1rem 1.2rem;
+    background-color: rgba(255,255,255,0.1);
+    font-size: 1.2rem;
+    border-bottom: 1px solid rgba(255,255,255,0.2);
+
+    &:first-of-type {
+      border-top: 1px solid rgba(255,255,255,0.2);
+    }
+
+    p {
+      align-self: center;
+      margin: 0;
+      font-size: inherit;
+      line-height: 2rem;
+
+      &.kredits-amount, &.voting {
+        text-align: right;
+      }
+
+      &.description {
+        grid-column-start: span 2;
+      }
+
+      &.voting {
+        grid-column-start: span 2;
+      }
+    }
+
+    span {
+      font-size: inherit;
+    }
+
+    .description {
+      line-height: 1.4em;
+      font-size: 1rem;
+    }
+
+    .category {
+      color: $blue;
+      padding-right: 0.2rem;
+      &.community { color: $red; }
+      &.dev       { color: $pink; }
+      &.design    { color: $yellow; }
+      &.docs      { color: $green; }
+      &.ops       { color: $purple; }
+    }
+
+    .amount {
+      font-weight: 500;
+    }
+
+    .symbol {
+      font-size: 1rem;
+      font-weight: 500;
+      padding-left: 0.2rem;
+    }
+
+    .recipient {
+      font-weight: 500;
+    }
+
+    .votes {
+      font-size: 1rem;
+      color: $primary-color;
+      margin-right: 0.5rem;
+    }
+
+    button {
+      height: 2rem;
+      line-height: 2rem;
+      padding: 0 0.6rem;
+    }
+  }
+
+}
+
+@media (min-width: 550px) {
+  ul.proposal-list {
+    li {
+      grid-template-columns: auto 10rem;
+      grid-row-gap: 0.5rem;
+
+      p {
+        &.kredits-amount, &.voting {
+          text-align: right;
+        }
+      }
+
+      &.unconfirmed {
+        p {
+          &.kredits-amount, &.voting {
+            text-align: right;
+          }
+
+          &.description {
+            grid-column-start: span 1;
+          }
+
+          &.voting {
+            grid-column-start: span 1;
+          }
+        }
+      }
+
+
+      .description {
+        font-size: inherit;
+      }
+    }
+  }
+}