Merge pull request #7 from levizwannah/develop

finished

Author: levizwannah

docs/index-3.html

@@ -59,7 +59,7 @@ <h1 class="page-heading single-col-max mx-auto">Documentation</h1>
 		            <input type="text" placeholder="Search the docs..." name="search" class="form-control search-input">
 		            <button type="submit" class="btn search-btn" value="Search"><i class="fas fa-search"></i></button>
 		        </form>
-             </div>
+            </div>
 	    </div>
     </div><!--//page-header-->
    <div class="page-content">

docs/js/components/App.js docs/js/components/Index.jsdocs/js/components/App.js renamed to docs/js/components/Index.js

@@ -1,9 +1,9 @@
-class App extends OpenScript.Component {
+class Index extends OpenScript.Component {
 
     async mount() {
         await super.mount();
         req('Sections.Header');
-        req('Sections.Hero');
+        req('SearchForm');
         req('Overview');
     }
 
@@ -19,7 +19,41 @@ class App extends OpenScript.Component {
 
             h.MainHeader(),
 
-            h.HeroSection(),
+            h.div(
+                {
+                    class: 'page-header theme-bg-dark py-5 text-center position-relative'
+                },
+    
+                h.div(
+                    {class: 'theme-bg-shapes-right'}
+                ),
+    
+                h.div(
+                    {class: 'theme-bg-shapes-left'}
+                ),
+    
+                h.div(
+                    {
+                        class: 'container'
+                    },
+    
+                    h.h1(
+                        {class: 'page-heading single-col-max mx-auto'},
+                        v(context('config').site, (site) => site.value.name)
+                    ),
+    
+                    h.div(
+                        {class: 'page-intro single-col-max mx-auto'},
+                        v(context('config').site, (site) => site.value.description)
+                    ),
+    
+                    h.div(
+                        {class: 'main-search-box pt-3 d-block mx-auto'},
+    
+                        h.Search('hero')
+                    )
+                )
+            ),
 
             // page content
             h.div(

docs/js/components/Sections/Hero.js

@@ -1,7 +1,7 @@
 ojs(async e => {
 
     // init components
-    req('App');
+    req('Index');
 
     // init contexts
     let rc = fetchContext('root', 'Root');
@@ -17,7 +17,7 @@ ojs(async e => {
 
     rc.root = h.dom.querySelector('#root');
 
-    h.App({
+    h.Index({
         parent: rc.root
     });
 

docs/js/ui-logic.js

@@ -1,24 +1,8 @@
 # OpenScript.Js
-This is a frontend framework for developing and Managing UI's in the most elegant and easy way. It is called open script because you don't need to work with javascript modules. If you want to export, then use a `Context`. Welcome to `OJS`.
+A frontend framework for developing and Managing Reactive UIs in the most elegant and easy way using normal non-module base JavaScript. That is, you can run this just like every other browser script. You can use OJs as part of a project or using it to create you whole UI.
 
-```js
-const rc = context("RootCxt");
+Full documentation at: https://levizwannah.github.io/OpenScript.Js
 
-h.div(
-    { 
-        class: "div-class", 
-        aria_labelledby: "blah blah",
-        parent: rc.domRoot 
-    }
+Developed by: Levi Kamara Zwannah
 
-    h.p("Hello Paragraph")
-)
-```
 
-# Core
-1. Components - render function do not have default arguments
-2. Markup
-3. State
-4. Context
-5. Auto Loading
-6. Anonymous Components