Add CTA to demo getting started page to help with next step

themes/demo/_layouts/default.php

@@ -26,8 +26,6 @@
     <footer id="page-footer">
         <?= partial('footer'); ?>
     </footer>
-    <script type="text/javascript" src="<?= asset('app/system/assets/ui/js/vendor/vendor.js'); ?>" id="vendor-js"></script>
-    <script type="text/javascript" src="<?= asset('app/system/assets/ui/js/flashmessage.js'); ?>" id="flashmessage-js"></script>
-    <script type="text/javascript" src="<?= asset('app/system/assets/ui/js/app.js'); ?>" id="app-js"></script>
+    <script type="text/javascript" src="<?= asset('app/admin/assets/js/admin.js'); ?>" id="app-js"></script>
     <?= get_script_tags(['ui', 'widget', 'component', 'custom', 'theme']); ?></body>
 </html>

themes/demo/_pages/home.php

@@ -4,23 +4,20 @@
 permalink: /
 ---
 
-<div class="container pt-4">
-
-    <p class="lead">This is TastyIgniter's demonstration theme to help you get started if you plan on designing your theme from scratch.</p>
-    <p class="lead">You may also choose from a variety of themes from the admin dashboard pre-built for you to start receiving orders.</p>
-
-    <h2>Overview <small>Basic page concepts</small></h2>
-
-    <h3>Layouts</h3>
-
-    <h3>Pages</h3>
-
-    <h3>Partials</h3>
-
-    <h3>Components</h3>
-
-    <h3>Assets</h3>
-
-    <h2>Extensions</h2>
-
+<div class="container">
+    <div class="row">
+        <div class="col-sm-8">
+            <p class="mb-4">This is TastyIgniter's <b>demonstration theme</b> to help you get started if you plan on designing your theme from scratch.</p>
+            <p class="mb-4">
+                Navigate to your admin dashboard <a target="_blank" href="<?= admin_url('themes') ?>">(Design > Themes)</a>
+                to <b>choose from a variety of themes</b> pre-built for you to start receiving orders.
+            </p>
+
+            <p class="mb-4">Learn more on themes and extension, see the <a href="https://tastyigniter.com/docs">docs</a>.</p>
+
+            <p class="mb-4 img-holder">
+                <img class="img-fluid rounded" src="https://tastyigniter.com/assets/ui/images/mockups/Menus.png" alt="TastyIgniter Frontend">
+            </p>
+        </div>
+    </div>
 </div>

themes/demo/_partials/head.php

@@ -1,6 +1,6 @@
 <?= get_metas(); ?>
-<link href="<?= asset('app/admin/assets/images/favicon.ico'); ?>" rel="shortcut icon" type="image/ico">
+<link href="<?= theme_url('demo/assets/images/favicon.ico'); ?>" rel="shortcut icon" type="image/ico">
 <title><?= sprintf(lang('main::lang.site_title'), lang(get_title()), setting('site_name')); ?></title>
-<link href="<?= asset('app/system/assets/ui/flame.css') ?>" rel="stylesheet" type="text/css" id="flame-css">
+<link href="<?= asset('app/admin/assets/css/admin.css') ?>" rel="stylesheet" type="text/css" id="flame-css">
 <?= get_style_tags(); ?>
 <link href="<?= theme_url('demo/assets/css/demo.css') ?>" rel="stylesheet" type="text/css" id="demo-css">

themes/demo/assets/css/demo.css

@@ -14,9 +14,7 @@ body {
 	-moz-osx-font-smoothing: grayscale;
 }
 body {
-	font-family: 'Titillium Web', sans-serif;
 	background-color: #F5F5F5;
-	padding-bottom: 200px;
 }
 @media (max-width: 767px) {
 	body {
@@ -26,7 +24,7 @@ body {
 
 /*** Main Header ***/
 #main-header {
-	background-color: #ED561A;
+	background-color: #FF4900;
 }
 #main-header .logo {
 	padding: 10px 0;
@@ -44,9 +42,15 @@ body {
 	margin-bottom: 0;
 	margin-top: 0;
 }
+.content-area {
+	font-size: 18px;
+	padding-top: 90px;
+}
+.img-holder {
+	margin-left: -10px;
+}
 #page-footer {
 	background-color: #595959;
-	/*background-image: linear-gradient(to bottom, #EDEFF1, #EDEFF1);*/
 	position: absolute;
 	bottom: 0;
 	width: 100%;