few styles

WORKLOG.md

@@ -3,6 +3,7 @@
 *PRODUCTION*
 * serde serialize privatise
 * stripe prod
+* mobile styles
 * account page
 * graphs n shit
 * acp init

client/assets/styles/normalize.css

@@ -83,7 +83,7 @@ template {
    ========================================================================== */
 
 /**
- * Remove the gray background color from active links in IE 10.
+ * Remove the gray color, background from active links in IE 10.
  */
 
 a {

client/assets/styles/styles.less

@@ -143,7 +143,7 @@ tr.right:focus, tr.right:hover {
 }
 
 tr {
-    transition-property: background, color;
+    transition-property: color, background;
     transition-duration: 0.5s;
     transition-delay: 0;
     transition-timing-function: ease;
@@ -162,7 +162,7 @@ button, input {
     flex: 1;
 
     /*the transitions */
-    transition-property: color background;
+    transition-property: color, background;
     transition-duration: 0.5s;
     transition-delay: 0;
     transition-timing-function: ease;
@@ -187,7 +187,7 @@ a {
 svg {
     fill: none;
     stroke: whitesmoke;
-    stroke-width: 5px;
+    stroke-width: 0.5em;
     height: 2em;
 }
 
@@ -229,7 +229,7 @@ table tr {
 }
 
 table td svg {
-    stroke-width: 2px;
+    stroke-width: 0.5em;
     overflow: hidden;
     height: 1.5em;
     vertical-align: text-bottom;
@@ -580,7 +580,6 @@ figure.gray {
 
 .stats svg, .specs svg {
     height: 2em;
-    stroke-width: 7px;
     fill: none;
 }
 
@@ -595,7 +594,7 @@ main .top button {
 
 .ready {
     color: forestgreen;
-    transition-property: color background;
+    transition-property: color, background;
     transition-duration: 0.5s;
     transition-timing-function: ease;
 }

client/assets/styles/vbox.less

@@ -32,9 +32,8 @@
         width: 100%;
         margin: 0;
         background-color: @gray-box;
-        border-width: 0;
-
         height: 3em;
+        border-width: 0;
 
         :active, :hover, :focus {
             color: white;
@@ -63,7 +62,7 @@
             }
         }
         svg {
-            stroke-width: 8px;
+            stroke-width: 0.75em;
         }
         .white {
             stroke: black;
@@ -87,7 +86,7 @@
 
             // overwrite the classes on white svg elements
             svg {
-                stroke-width: 8px;
+                stroke-width: 0.75em;
             }
 
             .white {
@@ -96,10 +95,6 @@
         }
     }
 
-    svg {
-        stroke-width: 4px;
-    }
-
     // figures don't scale well
     figure {
         svg {

client/src/components/vbox.component.jsx

@@ -365,7 +365,7 @@ function Vbox(args) {
         return (
             <div class={inventoryClass}
                 onClick={inventoryClick}
-                style={vboxSelecting || itemUnequip ? { cursor: 'pointer' } : null}
+                style={vboxSelecting || itemUnequip.length ? { cursor: 'pointer' } : null}
                 onMouseOver={e => hoverInfo(e, 'inventory')}>
                 <div class="vbox-hdr">
                     <h3 onTouchStart={e => e.target.scrollIntoView(true)}>INVENTORY</h3>