Update components document

src/content/docs/components.mdx

@@ -13,6 +13,27 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
 
 <Prism lang="jsx" code={
     `
+---
+// Settings
+import { SiteSettings } from '@config'
+import {version} from '../../package.json'
+
+// Properties
+const { frontmatter } = Astro.props
+
+// Components
+import Head from '@components/global/Head.astro'
+import Header from '@components/global/Header.astro'
+import FeelbackYesNo from "astro-feelback/components/FeelbackYesNo.astro";
+
+// Styles
+import "@styles/index.scss";
+import "@styles/splash.scss";
+import "@styles/feelback.css";
+---
+
+<Head/>
+<Header/>
 <div class="page">
     <div class="content">
         <div class="splash">
@@ -32,20 +53,27 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor i
     </div>
     <div class="footer">
         <div class="footer-start">
-            <p>© {ORG_NAME}. All right reserved.</p>
+            <p>© {SiteSettings.OrgName}. All right reserved.</p>
         </div>
         <div class="footer-end">
-            {WHITELABEL ?
+            {SiteSettings.WhiteLabel ?
                 <p>Built with <a href="#">ButterflyVu</a></p>
                 :
                 null
             }
+            {SiteSettings.FooterVersion ?
+                <p style="opacity: 0.5;">v{version}</p>
+                :
+                null
+            }
         </div>
     </div>
 </div>
     `
 } />
 
+This is the source code to the splash template layout.
+
 
 ## Video Player