launch: rebuilt all apps, add mobile flexbox

pkg/interface/launch/src/js/components/header.js

@@ -16,8 +16,13 @@ export default class Header extends Component {
           Home
         </span>
         <div className="absolute right-1 lh-copy" style={{ top: 12 }}>
-          <Sigil ship={"~" + window.ship} size={16} color={"#000000"} classes="mix-blend-diff v-mid" />
-          <span className="mono white-d f9 ml2">{"~" + window.ship}</span>
+          <Sigil
+            ship={"~" + window.ship}
+            size={16} color={"#000000"}
+            classes="mix-blend-diff v-mid" />
+          <span className="mono white-d f9 ml2">
+            {"~" + window.ship}
+          </span>
         </div>
       </header>
     );

pkg/interface/launch/src/js/components/home.js

@@ -25,7 +25,8 @@ export default class Home extends Component {
     return (
       <div className="fl w-100 h-100 bg-white center">
         <Header />
-        <div className="v-mid pa2 dtc"
+        <div className={"v-mid pa2 dtc-m dtc-l dtc-xl " +
+        "flex justify-between flex-wrap"}
         style={{maxWidth: "40rem"}}>
           {tileElems}
         </div>

pkg/interface/publish/tile/tile.js

@@ -10,22 +10,36 @@ export default class PublishTile extends Component {
 
 
   render(){
+
+    let notificationsNum = this.props.data.notifications;
+
+    if (notificationsNum === 0) {
+      notificationsNum = "";
+    }
+    else if (notificationsNum > 99) {
+      notificationsNum = "99+";
+    }
+    else if (isNaN(notificationsNum)) {
+      notificationsNum = "";
+    }
+
     return (
       <div className="w-100 h-100 relative bg-white ba b--black">
         <a className="w-100 h-100 db no-underline" href="/~publish">
-          <p className="black f9 absolute"
-            style={{left: 8, top: 8}}>
+          <p className="black f9 absolute" style={{ left: 8, top: 8 }}>
             Publishing
           </p>
           <img
             className="absolute"
-            style={{left: 39, top: 39}}
+            style={{ left: 39, top: 39 }}
             src="/~publish/tile.png"
             width={48}
-            height={48} />
-          <div className="absolute w-100 flex-col f9"
-            style={{verticalAlign: "bottom", bottom: 8, left: 8}}>
-            <span className="green2">{this.props.data.notifications}</span>
+            height={48}
+          />
+          <div
+            className="absolute w-100 flex-col f9"
+            style={{ verticalAlign: "bottom", bottom: 8, left: 8 }}>
+            <span className="green2">{notificationsNum}</span>
           </div>
         </a>
       </div>