Minor spacing adjustments

Added deploy script

Author: lolleko

assets/layout/landing.html

@@ -17,7 +17,7 @@
         </a>
     </nav>
     <div id="title"><span class="title-bold">Type</span>ScriptTo<span class="title-bold">Lua</span></div>
-    <div id="headline">Write Lua in TypeScript</div>
+    <div id="headline">Write Lua with TypeScript</div>
 </header>
 <main>
     <div id="example">
@@ -63,11 +63,13 @@
         </div>
         <div class="feature-item">
             <div class="feature-header">Type Safety</div>
-            Large projects written in lua can become hard to maintain and make it easy to make mistakes.
+            Static types can ease the mental burden of writing programs, by automatically tracking information the programmer would otherwise have to track mentally in some fashion.
+            Types serve as documentation for yourself and other programmers and provide a ‘gradient’ that tells you what terms make sense to write.
         </div>
         <div class="feature-item">
             <div class="feature-header">IDE Support</div>
             Types enable JavaScript developers to use highly-productive development tools and practices like static checking and code refactoring when developing JavaScript applications.
+            TypeScript extensions are available for many text editors. 
         </div>
     </div>
 </main>

assets/layout/play.html

@@ -1,6 +1,6 @@
 <div id="header">
     <div id="logo">
-        <span class="logo-bold">Type</span>ScriptTo<span class="logo-bold">Lua</span> Playground
+        <a href="/"><span class="logo-bold">Type</span>ScriptTo<span class="logo-bold">Lua</span></a> Playground
     </div>
 </div>
 <div id="content">

assets/styles/_base.scss

@@ -12,4 +12,9 @@ html, body {
 
 div {
     box-sizing: border-box;
+}
+
+a {
+    color: inherit;
+    text-decoration: none;
 }

assets/styles/landing.scss

@@ -9,7 +9,7 @@ main, header {
 
 header {
     #title {
-        margin-top: 10px;
+        margin-top: 30px;
         font-size: 72px;
         width: 100%;
         text-align: center;
@@ -26,38 +26,38 @@ header {
     }
 
     nav {
-        margin-top: 10px;
+        margin-top: 20px;
         text-align: center;
         color: #5690fc;
         width: auto;
         font-size: 28px;
         font-weight: 400;
 
-        a {
-            color: inherit;
-            text-decoration: none;
-        }
-
         a:hover {
             color: $grey-accent;
         }
 
         .nav-item {
             display: inline-block;
-            margin-left: 20px;
+            margin-right: 20px;
+        }
+
+        a:last-child .nav-item {
+            margin-right: 0px;
         }
     }
 }
 
 #features {
-    margin-top: 10px;
+    margin-top: 30px;
     margin-bottom: 20px;
     display: flex;
 }
 
 .feature-item {
-    flex: 33%;
-    padding: 10px;
+    flex: 33.33%;
+    padding: 20px;
+    line-height: 1.5;
 }
 
 .feature-header {
@@ -67,7 +67,7 @@ header {
 }
 
 .example-item {
-    padding: (10px !important);
+    padding: (15px !important);
     white-space: pre;
     font-size: 12px;
     font-family: $console-fonts;
@@ -79,7 +79,7 @@ header {
 }
 
 #example {
-    margin-top: 40px;
+    margin-top: 70px;
     width: 100%;
 
     #ts-declarations, #ts-source {
@@ -88,11 +88,11 @@ header {
     }
 
     #ts-declarations {
-        flex: 39%;
+        flex: 40%;
     }
 
     #ts-source {
-        flex: 61%;
+        flex: 60%;
         border-left: solid 2px #5690fc;
     }
 }

package.json

@@ -8,7 +8,8 @@
     "dev-playground": "webpack-dev-server --content-base dist/ --config src/playground/webpack.config.js --mode development",
     "build-landing": "webpack --config ./src/landing/webpack.config.js --mode production",
     "dev-landing": "webpack-dev-server --content-base dist/ --config src/landing/webpack.config.js --mode development",
-    "build": "npm run build-playground && npm run build-landing"
+    "build": "npx rimraf dist && npm run build-playground && npm run build-landing",
+    "deploy": "npm run build && npx gh-pages -d dist -b master"
   },
   "keywords": [],
   "author": "",
@@ -24,6 +25,7 @@
     "monaco-editor-webpack-plugin": "^1.5.4",
     "node-sass": "^4.9.3",
     "raw-loader": "^0.5.1",
+    "rimraf": "^2.6.2",
     "sass-loader": "^7.1.0",
     "style-loader": "^0.23.1",
     "ts-loader": "^5.2.1",

src/landing/index.ts

@@ -3,7 +3,7 @@ import 'highlight.js/styles/vs2015.css';
 
 import {configure, highlightBlock} from 'highlight.js';
 
-configure({languages: ["typescript", "lua"]})
+configure({languages: ["typescript", "lua"]});
 
 document.addEventListener('DOMContentLoaded', () => {
     let codeBlocks = document.getElementsByClassName('example-item');