diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index 95eea7f..41343df 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -39,19 +39,19 @@ jobs:
         shell: sh
         if: runner.os == 'Linux'
         run: |
-          chmod -c -R +rX "dist/apps/demo/" | while read line; do
+          chmod -c -R +rX "dist/demo/browser" | while read line; do
             echo "::warning title=Invalid file permissions automatically fixed::$line"
           done
           tar \
             --dereference --hard-dereference \
-            --directory "dist/demo/" \
+            --directory "dist/demo/browser" \
             -cvf "$RUNNER_TEMP/artifact.tar" \
             --exclude=.git \
             --exclude=.github \
             .
 
       - name: Upload artifact
-        uses: actions/upload-artifact@main
+        uses: actions/upload-artifact@v4
         with:
           name: github-pages
           path: ${{ runner.temp }}/artifact.tar
@@ -70,4 +70,4 @@ jobs:
     steps:
       - name: Deploy demo to GitHub Pages
         id: deployment
-        uses: actions/deploy-pages@v1
+        uses: actions/deploy-pages@v4
diff --git a/demo/project.json b/demo/project.json
index fa220c0..c5a47a9 100644
--- a/demo/project.json
+++ b/demo/project.json
@@ -39,7 +39,8 @@
               "maximumError": "4kb"
             }
           ],
-          "outputHashing": "all"
+          "outputHashing": "all",
+          "baseHref": "/ngx-easy-view-transitions/"
         },
         "development": {
           "optimization": false,
diff --git a/demo/src/app/app.component.scss b/demo/src/app/app.component.scss
index 25f3671..d33a3ce 100644
--- a/demo/src/app/app.component.scss
+++ b/demo/src/app/app.component.scss
@@ -1,5 +1,5 @@
 :host {
-  height: 100%;
+    min-height: 100%;
     display: grid;
     grid-template-rows: max-content 1fr max-content;
     grid-template-columns: 1fr;
diff --git a/demo/src/app/colors/color-detail/color-detail.component.html b/demo/src/app/colors/color-detail/color-detail.component.html
index 67b1a4a..db5477f 100644
--- a/demo/src/app/colors/color-detail/color-detail.component.html
+++ b/demo/src/app/colors/color-detail/color-detail.component.html
@@ -5,11 +5,11 @@
 >
   <div class="grid place-items-center">
     <div
-      class="h-64 aspect-square rounded-2xl"
+      class="h-32 md:h-64 aspect-square rounded-2xl"
       [style.backgroundColor]="color.hex"
       [transitionName]="color.name + '-img'"
     ></div>
-    <span class="font-bold text-3xl" [transitionName]="color.name">{{
+    <span class="font-bold text-xl md:text-3xl" [transitionName]="color.name">{{
         color.name
       }}</span>
   </div>
diff --git a/demo/src/styles.scss b/demo/src/styles.scss
index 604c3c5..b1a8ddb 100644
--- a/demo/src/styles.scss
+++ b/demo/src/styles.scss
@@ -9,4 +9,5 @@ html, body{
   padding: 0;
   margin: 0;
   min-height: 100svh;
+  height: 100%;
 }