pack simulator to scss

src/components/entercode/PackSimulator.js

@@ -6,6 +6,7 @@ import loki from 'lokijs';
 import Interactive from 'react-interactive';
 import API from '../SpreadsheetData';
 import s from '../../styles/style';
+import '../../scss/packs.scss';
 
 @inject((stores, props, context) => props) @observer
 export default class PackSimulator extends React.Component {

src/scss/base.scss

@@ -0,0 +1,20 @@
+.icon14 {
+    height: 14px;
+    padding-bottom: 2px;
+}
+
+.icon16 {
+    height: 16px;
+}
+
+.icon20 {
+    height: 20px;
+}
+
+.icon24 {
+    height: 24px;
+}
+
+.bigger {
+    font-size: 14px;
+}

src/scss/collection.scss

@@ -1,3 +1,5 @@
+@import 'base';
+
 @media only screen and (min-width: 975px) {
 
 .collection > .left {
@@ -96,27 +98,6 @@
     vertical-align: middle;
 }
 
-.icon14 {
-    height: 14px;
-    padding-bottom: 2px;
-}
-
-.icon16 {
-    height: 16px;
-}
-
-.icon20 {
-    height: 20px;
-}
-
-.icon24 {
-    height: 24px;
-}
-
-.bigger {
-    font-size: 14px;
-}
-
 .thumb {
     width: 100px;
     height: 98px;

src/scss/packs.scss

@@ -40,7 +40,7 @@ input[type=number]::-webkit-outer-spin-button {
 }
 
 .stats {
-    height: 100%
+    height: 100%;
     width: 100%;
     text-align: left;
 }

src/scss/portal.scss

@@ -1,23 +1,3 @@
-.icon14 {
-    height: 14px;
-}
-
-.icon16 {
-    height: 16px;
-}
-
-.icon20 {
-    height: 20px;
-}
-
-.icon24 {
-    height: 24px;
-}
-
-.bigger {
-    font-size: 14px;
-}
-
 .splash {
     max-width: 100%;
     padding-bottom: 10px;
@@ -129,3 +109,7 @@
     font-size: 16px;
     line-height: 20px;
 }
+
+.collection > .left {
+    position: fixed;
+}