Merge pull request #31 from zen-solutions/develop

Develop
zen-solutions · Jan 2, 2024 · 86b9a73 · 86b9a73
2 parents 246073a + e56ef73
commit 86b9a73
Show file tree

Hide file tree

Showing 81 changed files with 1,015 additions and 654 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,5 +1,4 @@
 .DS_Store
 node_modules
 .gitignore
-.vscode
-package-lock.json
+.vscode
diff --git a/dist/hello-world/index.html b/dist/hello-world/index.html
@@ -4,11 +4,17 @@
         <meta charset="UTF-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
         <title>zenCSS - Hello World</title>
+
+        <!------------ include zenCSS CSS files  ------------->
         <link rel="stylesheet" href="../../dist/zen.min.css" />
         <link rel="stylesheet" href="../../dist/icons.min.css" />
+
     </head>
 
+    <!------------ Declare zen class on the body to use zenCSS on the page ------------->
     <body class="zen">
+
+        <!------------ Header/A spot/Hero ------------->
         <z-container-fluid>
             <z-row class="pt-0 pb-0">
                 <z-col class="m-0 p-0">
@@ -17,44 +23,43 @@
                             <img src="../../img/logo.png" alt="" />
                         </div>
                         <div>
-                            <a id="hamburger-button-2"
-                                ><img
+                            <a id="hamburger-button-2">
+                                <img
                                     src="../../img/icons/bars.svg"
                                     class="icon-header up-3"
-                                    alt="Menu"
-                            /></a>
+                                    alt="Menu"/>
+                            </a>
                         </div>
                         <nav class="top-nav">
                             <button id="close-button">
                                 <a class="close"></a>
                             </button>
                             <ul>
                                 <li><a href="#" class="nav-link">Home</a></li>
-                                <li>
-                                    <a href="#" class="nav-link">Services</a>
-                                </li>
-                                <li>
-                                    <a href="#" class="nav-link">Contact</a>
-                                </li>
+                                <li><a href="#" class="nav-link">Services</a></li>
+                                <li><a href="#" class="nav-link">Contact</a></li>
                             </ul>
                         </nav>
                     </header>
                 </z-col>
             </z-row>
         </z-container-fluid>
 
+        <!------------ B spot  ------------->
         <main class="container-fluid page-title-here">
+
             <z-container-fluid class="theme-cta card hero-section m-0">
                 <z-container>
                     <z-row>
                         <z-col class="card center">
-                            <h2 class="h1 headline">👋 Hello World</h2>
+                            <h1 class="headline">👋 Hello World</h1>
                             <p class="lead">What will you create from here?</p>
                         </z-col>
                     </z-row>
                 </z-container>
             </z-container-fluid>
 
+            <!------------ C spot  ------------->
             <z-container-fluid class="name-of-section bg-grey-2">
                 <z-container class="page-section">
                     <z-row>
@@ -63,6 +68,7 @@ <h2 class="h1 headline">👋 Hello World</h2>
                 </z-container>
             </z-container-fluid>
 
+            <!------------ D spot  ------------->
             <z-container-fluid class="name-of-section bg-grey-3">
                 <z-container class="page-section">
                     <z-row>
@@ -71,19 +77,25 @@ <h2 class="h1 headline">👋 Hello World</h2>
                 </z-container>
             </z-container-fluid>
 
+            <!------------ E spot  ------------->
             <z-container-fluid class="name-of-section bg-grey-4">
                 <z-container class="page-section">
                     <z-row>
                         <z-col> Another Section</z-col>
                     </z-row>
                 </z-container>
             </z-container-fluid>
+
         </main>
+
+        <!------------ Footer  ------------->
         <footer>
-            <small class="center"
-                >&copy; <span id="current-year"></span>. Built using zenCSS.
+            <small class="center">&copy; <span id="current-year"></span>. Built using zenCSS.
             </small>
         </footer>
+
+        <!------------ Include zenCSS JS  ------------->
         <script src="../../dist/zencss.min.js"></script>
+
     </body>
 </html>
diff --git a/dist/zen.css b/dist/zen.css
diff --git a/dist/zen.css.map b/dist/zen.css.map
diff --git a/dist/zen.min.css b/dist/zen.min.css
diff --git a/dist/zen.min.css.map b/dist/zen.min.css.map
diff --git a/dist/zencss.js b/dist/zencss.js
diff --git a/docs/examples/16x9.jpg b/docs/examples/16x9.jpg
diff --git a/docs/examples/Icon-toggle.html b/docs/examples/Icon-toggle.html
@@ -82,8 +82,7 @@ <h2>Click to toggle</h2>
                                 href=""
                                 class="title accordion-toggle"
                                 aria-expanded="false"
-                                aria-controls="content1"
-                                ><i class="zenicon-build-circle down-1"></i>
+                                aria-controls="content1"><i class="zenicon-build-circle down-1"></i>
                                 Code Example</a
                             >
                             <div
@@ -132,8 +131,7 @@ <h2>Hover to toggle</h2>
                                 href=""
                                 class="title accordion-toggle"
                                 aria-expanded="false"
-                                aria-controls="content2"
-                                ><i class="zenicon-build-circle down-1"></i>
+                                aria-controls="content2"><i class="zenicon-build-circle down-1"></i>
                                 Code Example</a
                             >
                             <div