Update components.html

Postr-Inc · Sep 28, 2023 · 88068dc · 88068dc
1 parent e7b0674
commit 88068dc
Showing 1 changed file with 8 additions and 8 deletions.
diff --git a/src/views/docs/basics/components.html b/src/views/docs/basics/components.html
@@ -35,19 +35,19 @@ <h2 class="text-4xl font-bold mt-8">Component Structure</h2>
                 <pre data-prefix="1."><code
 
                     >import Vader, {include} from 'vaderjs'</code></pre> 
-                <pre data-prefix="2." class=""><code>class myApp extends Vader.Component{ </code> </pre>
+                <pre data-prefix="2." class=""><code><span class="text-blue-700">class </span> myApp <span class="text-blue-700"> extends</span> Vader.Component<span class="text-blue-700">{</span> </code> </pre>
                 </code></pre> 
-                <pre data-prefix="3." class=""><code>   constructor(){ </code> </pre>
-                <pre data-prefix="4." class=""><code>      super()</code> </pre>
-                <pre data-prefix="5." class=""><code>   }</code> </pre>z
-                <pre data-prefix="6." class=""><code>   render(){ </code> </pre>
-                <pre data-prefix="7." class=""><code>      return this.html(	&#768; </code> </pre>
+                <pre data-prefix="3." class=""><code>   <span class="text-blue-700">constructor</span><span class="text-green-500">(){</span> </code> </pre>
+                <pre data-prefix="4." class=""><code>      <span class="text-blue-700">super()</span></code> </pre>
+                <pre data-prefix="5." class=""><code>   }</code> </pre>
+                <pre data-prefix="6." class=""><code>   render<span class="text-green-500">(){</span> </code> </pre>
+                <pre data-prefix="7." class=""><code>      <span class="text-blue-700">return this</span>.<span class="text-error">html</span>(	&#768; </code> </pre>
                 <pre data-prefix="8." class=""><code>           &lt;div&gt; </code> </pre>
                 <pre data-prefix="9." class=""><code>           &lt;h1&gt;Hello World&lt;/h1&gt; </code> </pre>
                 <pre data-prefix="10." class=""><code>           &lt;/div&gt; </code> </pre>
                 <pre data-prefix="11." class=""><code>      	&#768; )</code> </pre>
-                <pre data-prefix="12." class=""><code>   }</code> </pre>
-                <pre data-prefix="13." class=""><code> }</code> </pre>
+                <pre data-prefix="12." class=""><code>   <span class="text-green-500">}</span></code> </pre>
+                <pre data-prefix="13." class=""><code> <span class="text-blue-700">}</span></code> </pre>
               </div>
         </p>
         <p>