add web section

kbrsh · May 29, 2018 · 6d4ea3e · 6d4ea3e
1 parent c8b174b
commit 6d4ea3e
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 0 deletions.
diff --git a/web/index.html b/web/index.html
@@ -55,5 +55,23 @@ <h1>Minimal</h1>
         </div>
       </div>
     </section>
+
+    <section id="feature-fast" class="container feature">
+      <h1>Fast</h1>
+      <p>Moon instances are compiled from the Moon view language to lower level JavaScript DOM operations. Moon generates code to first create and initialize your application. At compile-time, Moon can identify the dynamic parts of your application and generate code to update them when needed at runtime.</p>
+      <div class="row">
+        <div class="col">
+          <pre><code lang="mvl"><span class="red">&lt;p</span><span class="red">&gt;</span>Count: { count }<span class="red">&lt;/p</span><span class="red">&gt;</span>
+<span class="red">&lt;button</span> <span class="orange">@click</span>={ <span class="blue">increment</span>() }<span class="red">&gt;</span>
+  Increment
+<span class="red">&lt;/button</span><span class="red">&gt;</span></code></pre>
+        </div>
+        <div class="col">
+          <pre><code lang="js"><span class="purple">function</span> <span class="blue">update</span>() {
+  <span class="orange">this</span>.m.<span class="blue">stc</span>(m[<span class="orange">4</span>], <span class="orange">this</span>.data.count);
+}</code></pre>
+        </div>
+      </div>
+    </section>
   </body>
 </html>
diff --git a/web/template/index.html b/web/template/index.html
@@ -55,5 +55,23 @@ <h1>Minimal</h1>
         </div>
       </div>
     </section>
+
+    <section id="feature-fast" class="container feature">
+      <h1>Fast</h1>
+      <p>Moon instances are compiled from the Moon view language to lower level JavaScript DOM operations. Moon generates code to first create and initialize your application. At compile-time, Moon can identify the dynamic parts of your application and generate code to update them when needed at runtime.</p>
+      <div class="row">
+        <div class="col">
+          <pre><code lang="mvl"><span class="red">&lt;p</span><span class="red">&gt;</span>Count: { count }<span class="red">&lt;/p</span><span class="red">&gt;</span>
+<span class="red">&lt;button</span> <span class="orange">@click</span>={ <span class="blue">increment</span>() }<span class="red">&gt;</span>
+  Increment
+<span class="red">&lt;/button</span><span class="red">&gt;</span></code></pre>
+        </div>
+        <div class="col">
+          <pre><code lang="js"><span class="purple">function</span> <span class="blue">update</span>() {
+  <span class="orange">this</span>.m.<span class="blue">stc</span>(m[<span class="orange">4</span>], <span class="orange">this</span>.data.count);
+}</code></pre>
+        </div>
+      </div>
+    </section>
   </body>
 </html>