make card wider

src/components/presentational/CardSource.js

@@ -7,7 +7,9 @@ function renderSource(source) {
   return source.error ? (
     <div><small>{source.error}</small></div>
   ) : (
-    <div><p>TODO: display source properly.</p></div>
+    <div>
+      <p>{source.id}</p>
+    </div>
   )
 }
 
@@ -21,7 +23,7 @@ const CardSource = ({ source, language, isLoading, error }) => {
   }
 
   return (
-    <div className="card-col card-cell source">
+    <div className="card-row card-cell source">
       <h4>{source_lang}: </h4>
       {renderContent()}
     </div>

src/scss/cardstack.scss

@@ -1,6 +1,8 @@
 @import 'burger';
 @import 'card';
 
+$card-width: 500px;
+
 .card-stack {
   position: absolute;
   top: 10px;
@@ -20,7 +22,7 @@
   .card-stack-header {
     min-height: 38px;
     line-height: 38px;
-    width: 360px;
+    width: $card-width;
     box-sizing: border-box;
     padding: 0 5px;
     background: $black;
@@ -61,7 +63,7 @@
   }
 
   .card-stack-content {
-    width: 360px;
+    width: $card-width;
 
     ul {
       padding: 0;