From 04b9a954d6d089fbcc73604d9ab25ee41913e2e6 Mon Sep 17 00:00:00 2001
From: Vincent Palmer <shift@someone.section.me>
Date: Tue, 30 Sep 2025 15:56:56 +0200
Subject: [PATCH] Enhance presentation with Top Trumps image, AI research
 slide, and mobile QR code access

- Add Top Trumps image to slide 4 (images/top trumps.jpg)
- Fix slide 14 duplicate ID issue and correct structure
- Add slide 15 showcasing AI research project (sun50iw12p1-research)
- Add slide 16 with dual game access: local button + mobile QR code
- Generate QR code for code.c-base.org/shift/harmony mobile access
- Update navigation system for 16 slides total
- Improve final slide layout with side-by-side access options
---
 images/harmony-qr-code.png  | Bin 0 -> 499 bytes
 presentation_no_iframe.html |  45 ++++++++++++++++++++++++------------
 2 files changed, 30 insertions(+), 15 deletions(-)
 create mode 100644 images/harmony-qr-code.png

diff --git a/images/harmony-qr-code.png b/images/harmony-qr-code.png
new file mode 100644
index 0000000000000000000000000000000000000000..81176244e5d4adf869aae9b54eaa3e02aa2ffc3a
GIT binary patch
literal 499
zcmV<P0Sx|$P)<h;3K|Lk000e1NJLTq0077U0077V0{{R3mzF%;00006P)t-s|Ns90
z0033O(|!N|010qNS#tmY4#WTe4#WYKD-Ig~00EOpL_t(oh1Hlbj)gD`M2%8Vas-Z&
zn?a7oQ8+?M3KZ|m1cAO*zy8KWmi23J7*CvU_BB>#SUT|7(lNUa%CrDv(F+cKOkRd_
z+|7oQso*5J@2g?m4E0zBpWMqE2<zEU#pv7m9)euW&Z?lDH;}HKbF32o&gTzR{gCu-
zB*}%{h`s*k)0pImEGNPGFX9nxJr~wv<Ibuos)|jPbWFRU8(D(t@e>I-UtF?E>rf5-
z+Ub7-b<eL5o8Y0zuiaG-`5J*}m-W^g-joW#pV>=naz%o!omF{}|5*!77MyyTi|E&<
zp%0t!EV0-G9XQiHsywgzHO`vYM6t>}o-gxgCn&+RQEv@t+91z;4*4}P3If`Yzx8vw
zT9$T#6YMfQ1f024P1=b}lJ}X8rwH#QI>@uP(4+@vP&(f+<36a*5}T+L*W?W6!zpu3
z_!gS<*`Et@*6Z2%e*n^NdQvo}&PyTX737&Zkz-Zu4FvO@oDXS9#w|9HcKVdu?|}Ec
pBrv(U@%{w^-i>=nF0ski_yebgaV$s;>1+T1002ovPDHLkV1hZG=!pOT

literal 0
HcmV?d00001

diff --git a/presentation_no_iframe.html b/presentation_no_iframe.html
index d194fc5..a01dd3b 100644
--- a/presentation_no_iframe.html
+++ b/presentation_no_iframe.html
@@ -497,21 +497,36 @@
         <!-- Slide 16: Play Harmony -->
         <div class="slide content-slide" id="slide-16">
             <h2>Ready to Play?</h2>
-            <p style="font-size: 2em; margin-bottom: 40px;">Let's play some Harmony!</p>
-            <button onclick="window.location.href='harmony.html'" style="
-                font-size: 1.5em; 
-                padding: 20px 40px; 
-                background: linear-gradient(45deg, #ff6b35, #f7931e); 
-                color: white; 
-                border: none; 
-                border-radius: 10px; 
-                cursor: pointer; 
-                box-shadow: 0 4px 15px rgba(247, 147, 30, 0.4);
-                transition: all 0.3s;
-            " onmouseover="this.style.transform='scale(1.05)'" onmouseout="this.style.transform='scale(1)'">
-                🎯 Start Harmony Game 🎯
-            </button>
-            <p style="font-size: 1.2em; margin-top: 30px; color: #888;">Click to switch to the full game</p>
+            <p style="font-size: 2em; margin-bottom: 30px;">Let's play some Harmony!</p>
+            
+            <div style="display: flex; align-items: center; justify-content: center; gap: 50px; margin-bottom: 20px;">
+                <!-- Local Game Button -->
+                <div style="text-align: center;">
+                    <button onclick="window.location.href='harmony.html'" style="
+                        font-size: 1.5em; 
+                        padding: 20px 40px; 
+                        background: linear-gradient(45deg, #ff6b35, #f7931e); 
+                        color: white; 
+                        border: none; 
+                        border-radius: 10px; 
+                        cursor: pointer; 
+                        box-shadow: 0 4px 15px rgba(247, 147, 30, 0.4);
+                        transition: all 0.3s;
+                    " onmouseover="this.style.transform='scale(1.05)'" onmouseout="this.style.transform='scale(1)'">
+                        🎯 Play Now 🎯
+                    </button>
+                    <p style="font-size: 1em; margin-top: 10px; color: #888;">Local version</p>
+                </div>
+                
+                <!-- QR Code for Mobile -->
+                <div style="text-align: center;">
+                    <img src="images/harmony-qr-code.png" alt="QR Code for Harmony Game" style="width: 150px; height: 150px; border: 2px solid #fff; border-radius: 10px;">
+                    <p style="font-size: 1em; margin-top: 10px; color: #888;">Scan for mobile</p>
+                    <p style="font-size: 0.9em; color: #aaa;">code.c-base.org/shift/harmony</p>
+                </div>
+            </div>
+            
+            <p style="font-size: 1.1em; color: #666;">Play on your device or scan the QR code for mobile access</p>
         </div>
     </div>