Make spacing/layout more consistent

app/styles/_layout.scss

@@ -1,7 +1,3 @@
-#topbar {
-  height: 3rem;
-}
-
 main {
   padding: 1rem 2rem;
 

app/styles/components/_contribution-list.scss

@@ -15,7 +15,7 @@ ul.contribution-list {
     display: grid;
     grid-template-columns: auto 5rem 5rem;
     grid-row-gap: 0.5rem;
-    padding: 1rem 1.2rem;
+    padding: 0.8rem 1.2rem;
     background-color: rgba(255,255,255,0.1);
     font-size: 1.2rem;
     border-bottom: 1px solid rgba(255,255,255,0.2);
@@ -80,8 +80,7 @@ ul.contribution-list {
     }
 
     .symbol {
-      font-size: 1rem;
-      font-weight: 500;
+      font-size: 0.8rem;
       padding-left: 0.2rem;
     }
 

app/styles/components/_contributor-list.scss

@@ -16,7 +16,11 @@ table.contributor-list {
 
     &.metadata {
       height: 0;
-      transition: all 0.2s ease-out;
+      visibility: hidden;
+
+      &:not(.visible) {
+        border-bottom: none;
+      }
 
       td {
         padding: 0 1.2rem;
@@ -34,7 +38,6 @@ table.contributor-list {
         display: block;
         overflow: hidden;
         height: 0;
-        transition: all 0.2s ease-out;
 
         li {
           display: inline;
@@ -46,6 +49,7 @@ table.contributor-list {
 
       &.visible {
         height: auto;
+        visibility: visible;
         ul {
           height: auto;
         }
@@ -54,11 +58,11 @@ table.contributor-list {
 
     td {
       padding: 0 1.2rem;
-      line-height: 4.2rem;
+      line-height: 3.6rem;
 
       &.person {
         text-align: left;
-        font-size: 1.4rem;
+        font-size: 1.2rem;
 
         img.avatar {
           margin-right: 0.2rem;
@@ -68,10 +72,11 @@ table.contributor-list {
       &.kredits {
         text-align: right;
         .amount {
-          font-size: 1.4rem;
+          font-size: 1.2rem;
+          font-weight: 500;
         }
         .symbol {
-          font-size: 1rem;
+          font-size: 0.8rem;
           padding-left: 0.2rem;
         }
       }

app/styles/components/_topbar.scss

@@ -1,8 +1,15 @@
 #topbar {
   padding: 0 1rem;
+  height: 3rem;
   line-height: 3rem;
   background-color: rgba(0,0,0,.3);
 
+  @include media-min(medium) {
+    padding: 0 2rem;
+    height: 4rem;
+    line-height: 4rem;
+  }
+
   h1 {
     display: inline-block;
     text-transform: uppercase;