Merge pull request #69 from XavierTho/main

[P3 DNHS Cafe] Update

_includes/nav/share_and_care.html

@@ -2,6 +2,7 @@
     <tr>
         <td><a href="{{site.baseurl}}/chess/home">Chess Forum</a></td>
         <td><a href="{{site.baseurl}}/share_and_care/revvit">Revvit</a></td>
-        <td><a href="{{site.baseurl}}/UndgdMusic/">Underground Music</a></td>    
+        <td><a href="{{site.baseurl}}/UndgdMusic/">Underground Music</a></td>
+        <td><a href="{{site.baseurl}}/dnhscafe">DNHS Cafe</a></td>    
     </tr>
 </table>

navigation/share_and_care/dnhscafe/cafe_home_page.md

@@ -0,0 +1,10 @@
+---
+layout: page
+title: DNHS Cafe
+description: Cafe homepage
+permalink: /dnhscafe/
+---
+
+<a href="{{site.baseurl}}/dnhscafestore">
+<button style="background-color: #e4bc84; color: white; padding: 10px"> Take Me To DNHS Cafe! </button>
+</a>

navigation/share_and_care/dnhscafe/cafe_store.md

@@ -0,0 +1,126 @@
+---
+layout: page
+title: DNHS Cafe Store
+description: Purchase coffee using your d'nero you earned from helping!
+permalink: /dnhscafestore/
+---
+
+# ☕ Welcome to DNHS Cafe
+
+**Come for the coffee, stay for the cozy vibes.**  
+*Enjoy a range of your favorite brews using dneros, our exclusive currency!*
+
+---
+## Menu
+
+### **House Favorites**
+
+- **Classic Espresso**  
+  A bold shot of espresso, perfect for a quick boost.  
+  **Price:** 5 dneros  
+
+- **Cappuccino**  
+  Steamed milk and frothy foam topped with a hint of cinnamon.  
+  **Price:** 8 dneros  
+
+- **Mocha Latte**  
+  A sweet blend of espresso, milk, and chocolate.  
+  **Price:** 10 dneros  
+
+### **Seasonal Specials**
+
+- **Pumpkin Spice Latte**  
+  The cozy flavors of fall in a cup, perfect for crisp days.  
+  **Price:** 12 dneros  
+
+- **Vanilla Caramel Macchiato**  
+  Creamy vanilla meets rich caramel for a truly indulgent treat.  
+  **Price:** 11 dneros  
+
+-
+
+### Points: <span id="userPoints">50</span> dneros
+
+| Coffee        | Cost (dneros) | Action   |
+|---------------|---------------|----------|
+| **Classic Espresso**  | 15            | <button class="buy-button" onclick="buyCoffee(15)">Buy</button> |
+| **Pumpkin Spice Latte**     | 20            | <button class="buy-button" onclick="buyCoffee(20)">Buy</button> |
+| **Cappuccino**| 18            | <button class="buy-button" onclick="buyCoffee(18)">Buy</button> |
+| **Mocha Latte**     | 22            | <button class="buy-button" onclick="buyCoffee(22)">Buy</button> |
+| **Vanilla Caramel Macchiato** | 25            | <button class="buy-button" onclick="buyCoffee(25)">Buy</button> |
+
+---
+
+<span id="message" style="color:red;"></span>
+
+<script>
+let userPoints = 50;
+
+function updatePointsDisplay() {
+    document.getElementById("userPoints").textContent = userPoints;
+}
+
+function buyCoffee(cost) {
+    const messageElement = document.getElementById("message");
+    if (userPoints >= cost) {
+        userPoints -= cost;
+        messageElement.textContent = "Enjoy your coffee! ☕";
+        updatePointsDisplay();
+    } else {
+        messageElement.textContent = "You don't have enough points! :(";
+    }
+}
+updatePointsDisplay(); // Initial display update
+</script>
+
+<<<<<<< HEAD
+1. Choose your favorite drink(s).
+2. Message us to confirm your order.
+3. Enjoy the cozy vibes and delicious flavors of DNHS Cafe!
+
+*Thank you for visiting DNHS Cafe! We hope our cozy corner brings you a taste of joy and warmth.*
+
+<a href="{{site.baseurl}}/dnhscafestudyroom">
+<button style="background-color: #e4bc84; color: white; padding: 10px"> Take Me To DNHS Cafe Study Room! </button>
+</a>
+=======
+<style>
+body {
+    font-family: Arial, sans-serif;
+    background-color: #FAEBD7;
+    color: #5A3D31;
+    text-align: center;
+    padding: 20px;
+}
+table {
+    width: 80%;
+    max-width: 600px;
+    margin: 20px auto;
+    border-collapse: collapse;
+    background-color: #FFF5EE;
+}
+th, td {
+    padding: 12px;
+    border: 1px solid #DDD;
+}
+th {
+    background-color: #F0E5D8;
+}
+.buy-button {
+    padding: 8px 12px;
+    background-color: #D2691E;
+    color: white;
+    border: none;
+    border-radius: 8px;
+    cursor: pointer;
+    font-size: 14px;
+}
+.buy-button:disabled {
+    background-color: #ccc;
+    cursor: not-allowed;
+}
+</style>
+
+<a href="{{site.baseurl}}/dnhscafestudyroom">
+<button style="background-color: #e4bc84; color: white; padding: 10px"> Take Me To DNHS Cafe Study Room! </button>
+</a>

navigation/share_and_care/dnhscafe/cafechatroom.md

@@ -0,0 +1,103 @@
+---
+layout: page
+title: DNHS Cafe Study Room
+description: Help out your peers with school work to earn d'neros!
+permalink: /dnhscafestudyroom/
+---
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Chat Box</title>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            height: 100vh;
+            margin: 0;
+        }
+        .chat-container {
+            width: 300px;
+            height: 400px;
+            display: flex;
+            flex-direction: column;
+            border: 1px solid #ccc;
+            border-radius: 8px;
+            padding: 10px;
+            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+            background-color: #F9F9F9;
+        }
+        .chat-box {
+            flex: 1;
+            overflow-y: auto;
+            padding: 10px;
+            border: 1px solid #ddd;
+            border-radius: 8px;
+            margin-bottom: 10px;
+            background-color: #fff;
+        }
+        .chat-message {
+            padding: 8px;
+            margin: 5px 0;
+            border-radius: 8px;
+            background-color: #E0E0E0;
+            word-wrap: break-word;
+            max-width: 80%;
+        }
+        .input-box {
+            display: flex;
+        }
+        .input-box input {
+            flex: 1;
+            padding: 8px;
+            border: 1px solid #ddd;
+            border-radius: 8px;
+            outline: none;
+            font-size: 14px;
+        }
+        .input-box button {
+            padding: 8px 12px;
+            margin-left: 5px;
+            background-color: #C48562;
+            border: none;
+            color: #fff;
+            border-radius: 8px;
+            cursor: pointer;
+            font-size: 14px;
+        }
+        .input-box button:hover {
+            background-color: #9C694E;
+        }
+    </style>
+</head>
+<body>
+    <div class="chat-container">
+        <div class="chat-box" id="chatBox">
+            <!-- Messages will appear here -->
+        </div>
+        <div class="input-box">
+            <input type="text" id="userInput" placeholder="Type a message...">
+            <button onclick="sendMessage()">Send</button>
+        </div>
+    </div>
+    <script>
+        function sendMessage() {
+            // Get the value from the input box
+            const inputText = document.getElementById("userInput").value;
+            if (inputText.trim() !== "") {  // Ensure it is not empty
+                // Create a new div element for the chat message
+                const message = document.createElement("div");
+                message.classList.add("chat-message");
+                message.textContent = inputText;
+                // Append the message to the chat box
+                document.getElementById("chatBox").appendChild(message);
+                // Scroll to the bottom of the chat box
+                document.getElementById("chatBox").scrollTop = document.getElementById("chatBox").scrollHeight;
+                // Clear the input box
+                document.getElementById("userInput").value = '';
+            }
+        }
+    </script>
+</body>
+