Added GitHub Pages steps, Automated demo page (#2)

* Testing PHP Rendering workflow
Update php-render.yml, sass-compile.yml, and nibblepoker.scss

* Fixed CWD in PHP workflow
Update php-render.yml

* Removed beautifier step
Update php-render.yml

* Added artifact retrieval
Update php-render.yml and sass-compile.yml

* Attempt 1 to fix broken triggers
Update php-render.yml

* Combined workflows, Screw this noise
Update build-all.yml, php-render.yml, and sass-compile.yml

* Fixed paths for GitHub Pages
Update index.php, intro.php, and sidebar.php

* Removed trash step, Fixed last faulty path
Update build-all.yml and cards.php

.github/workflows/build-all.yml

@@ -1,11 +1,11 @@
-name: Compile SASS
+name: Build Everything
 
 on:
   push:
   pull_request:
 
 jobs:
-  deploy:
+  sass_compile:
     runs-on: ubuntu-latest
 
     permissions:
@@ -21,6 +21,12 @@ jobs:
           submodules: true
           fetch-depth: 0
 
+      - name: Setup PHP
+        uses: shivammathur/setup-php@v2
+        with:
+          php-version: '8.4'
+          extensions: none
+
       - name: Setup Node.js
         uses: actions/setup-node@v4
         with:
@@ -28,7 +34,7 @@ jobs:
 
       - name: Install SASS Compiler
         run: |
-          npm install -g html-minifier sass
+          npm install -g sass
 
       - name: Compile SASS
         run: |
@@ -57,3 +63,21 @@ jobs:
           if-no-files-found: error
           retention-days: 90
           compression-level: 9
+
+      - name: Pre-render PHP File
+        run: |
+          cd htdocs
+          php ./index.php > ./index.html
+
+      - name: Remove trash
+        run: |
+          cd htdocs
+          rm -rf parts/
+          rm *.php
+
+      - name: Deploy demo page to gh-pages
+        uses: peaceiris/actions-gh-pages@v4
+        if: ${{ github.ref == 'refs/heads/master' }}
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: ./htdocs

htdocs/index.php

@@ -7,10 +7,10 @@
     <!--<meta name="viewport" content="width=device-width"/>-->
     <meta name="author" content="Herwin Bozet">
     <meta name="robots" content="index, follow">
-    <link rel="icon" type="image/svg+xml" href="/favicon.svg">
+    <link rel="icon" type="image/svg+xml" href="./favicon.svg">
-    <link rel="alternate icon" href="/favicon.ico">
+    <link rel="alternate icon" href="./favicon.ico">
-    <link rel="stylesheet" href="/css/nibblepoker.min.css">
+    <link rel="stylesheet" href="./css/nibblepoker.min.css">
-    <link rel="stylesheet" href="/css/debugger.min.css">
+    <link rel="stylesheet" href="./css/debugger.min.css">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css"
           crossorigin="anonymous"
           referrerpolicy="no-referrer" />
@@ -124,8 +124,8 @@
     </a>
 </footer>
 
-<script src="/js/sidebar.js"></script>
+<script src="./js/sidebar.js"></script>
-<script src="/js/text-direction-switch.js"></script>
+<script src="./js/text-direction-switch.js"></script>
-<script src="/js/anchor-fix.js"></script>
+<script src="./js/anchor-fix.js"></script>
 </body>
 </html>

htdocs/parts/examples/cards.php

@@ -22,7 +22,7 @@ if (basename(__FILE__) == basename($_SERVER["SCRIPT_FILENAME"])) {
 
         <div class="my-s border r-l bkgd-dark grid d-inline-block">
             <div class="bb">
-                <img src="/img/maki-03.jpg" alt="Hungry Kitty Cat" class="r-r p-s px-l" height="128px">
+                <img src="./img/maki-03.jpg" alt="Hungry Kitty Cat" class="r-r p-s px-l" height="128px">
             </div>
             <div class="bkgd-gray t-center">
                 <p>Hungry Cat</p>

htdocs/parts/intro.php

@@ -7,6 +7,7 @@ if(basename(__FILE__) == basename($_SERVER["SCRIPT_FILENAME"])) {
 global $root_path;
 ?>
 
+<a id="intro"></a>
 <div class="p-xs b r-s bkgd-grid">
     <h2 class="t-w-500 t-size-14">Introduction</h2>
 </div>

htdocs/parts/sidebar.php

@@ -8,9 +8,9 @@ if(basename(__FILE__) == basename($_SERVER["SCRIPT_FILENAME"])) {
 <nav id="sidebar" class="sidebar">
 
     <div class="p-m pt-l">
-        <a href="/" class="no-select">
+        <a href="#intro" class="no-select">
             <img class="logo-sidebar-v2"
-                 src="/img/logo-large-fluent-unshaded.svg"
+                 src="./img/logo-large-fluent-unshaded.svg"
                  alt="Website's logo"
                  draggable="false">
         </a>

scss/nibblepoker.scss

@@ -2,9 +2,11 @@
  * -----------------------------------------------------------------------------
  * NibblePoker CSS Theme
  * -----------------------------------------------------------------------------
- * Author: Herwin Bozet
+ * Author: Herwin Bozet (@NibblePoker)
  * License: CC0 1.0 (Public Domain)
- * Source: ???
+ * Sources:
+ *   - https://github.com/aziascreations/CSS-NibblePoker/
+ *   - https://git.nibblepoker.lu/aziascreations/CSS-NibblePoker
  * -----------------------------------------------------------------------------
  */