sok sok sok update

src/routes/+page.svelte

@@ -320,7 +320,7 @@
     flex-direction: column;
     min-height: 100vh;
     width: 100vw;
-    background-color: #2d4f5a;
+    background-color: #385764;
     color: #333;
     position: absolute;
     top: 0;
@@ -422,7 +422,7 @@
 
   .form-input {
     width: 100%;
-    padding: clamp(0.7rem, 3vw, 0.8rem);
+    padding: 0.4rem 0.6rem;
     border: 1px solid #ddd;
     border-radius: 4px;
     background-color: #f5f5f5;
@@ -501,7 +501,7 @@
     color: white;
     border: none;
     border-radius: 4px;
-    padding: clamp(0.6rem, 3vw, 0.8rem) clamp(1rem, 4vw, 1.2rem);
+    padding: clamp(0.4rem, 2vw, 0.5rem) clamp(0.8rem, 3vw, 1rem);
     font-size: clamp(0.85rem, 3.5vw, 0.9rem);
     cursor: pointer;
     transition: background-color 0.2s;
@@ -565,9 +565,9 @@
     color: white;
     font-size: clamp(1.5rem, 5vw, 1.8rem);
     cursor: pointer;
-    padding: 0.5rem;
+    padding: 0.3rem;
-    width: 44px;
+    width: 36px;
-    height: 44px;
+    height: 36px;
     display: flex;
     align-items: center;
     justify-content: center;
@@ -702,4 +702,18 @@
       margin-top: 1rem;
     }
   }
+
+  .admin-button {
+    background-color: #30b0d5;
+    color: white;
+    border: none;
+    border-radius: 4px;
+    padding: clamp(0.4rem, 2vw, 0.5rem) clamp(0.8rem, 3vw, 1rem);
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+    cursor: pointer;
+    transition: background-color 0.2s;
+    text-align: center;
+    text-decoration: none;
+    display: block;
+  }
 </style>

src/routes/api/login/+server.js

@@ -229,8 +229,15 @@ USE_SSL=false  # majd ha lesz rá idő`
                         color: white;
                         font-size: 1.5rem;
                         cursor: pointer;
-                        padding: 0;
+                        padding: 0.3rem;
                         line-height: 1;
+                        width: 36px;
+                        height: 36px;
+                        display: flex;
+                        align-items: center;
+                        justify-content: center;
+                        touch-action: manipulation;
+                        -webkit-tap-highlight-color: transparent;
                     }
 
                     .modal-body {
@@ -426,15 +433,13 @@ USE_SSL=false  # majd ha lesz rá idő`
                         color: white;
                         border: none;
                         border-radius: 4px;
-                        padding: clamp(0.8rem, 3vw, 1rem);
+                        padding: 1rem;
-                        font-size: clamp(0.9rem, 3vw, 1rem);
+                        font-size: 1rem;
                         cursor: pointer;
                         transition: background-color 0.2s;
                         text-align: center;
                         text-decoration: none;
                         display: block;
-                        touch-action: manipulation;
-                        -webkit-tap-highlight-color: transparent;
                     }
 
                     .admin-button:hover {
@@ -484,10 +489,10 @@ USE_SSL=false  # majd ha lesz rá idő`
                         color: white;
                         font-size: 1.5rem;
                         cursor: pointer;
-                        padding: 0.25rem;
+                        padding: 0.3rem;
                         line-height: 1;
-                        width: 32px;
+                        width: 36px;
-                        height: 32px;
+                        height: 36px;
                         display: flex;
                         align-items: center;
                         justify-content: center;
@@ -723,6 +728,267 @@ USE_SSL=false  # majd ha lesz rá idő`
         });
     }
 
+    // Wide gold storage silo case
+    if (username === 'wide_gold_storage_silo' && password === 'wide_gold_storage_silo') {
+        return json({
+            success: true,
+            type: 'admin',
+            content: {
+                html: `
+                    <div class="logo-container">
+                        <img src="/logo.png" class="logo" alt="KRETÉN logo">
+                    </div>
+                    <div class="login-container admin-panel">
+                        <div class="login-header">
+                            <h2>wide_gold_storage_silo</h2>
+                        </div>
+                        <div class="login-form">
+                            <div class="admin-buttons">
+                                <button class="admin-button" id="showMilkaButton">
+                                    Milka csoki for everyone
+                                </button>
+                            </div>
+                        </div>
+                    </div>
+                `,
+                css: `
+                    .logo-container {
+                        margin-bottom: 2rem;
+                        text-align: center;
+                        padding: 0 1rem;
+                    }
+
+                    .logo {
+                        max-width: 100%;
+                        height: auto;
+                        width: auto;
+                        max-height: 120px;
+                    }
+
+                    .admin-panel {
+                        background-color: white;
+                        border-radius: 4px;
+                        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+                        width: 100%;
+                        max-width: 600px;
+                        overflow: hidden;
+                        margin: 0 1rem;
+                    }
+
+                    .login-header {
+                        background-color: #30b0d5;
+                        color: white;
+                        padding: 1rem;
+                        text-align: center;
+                    }
+
+                    .login-header h2 {
+                        font-size: clamp(1rem, 4vw, 1.2rem);
+                        font-weight: normal;
+                        margin: 0;
+                        line-height: 1.3;
+                    }
+
+                    .login-form {
+                        padding: 1.5rem;
+                    }
+
+                    .admin-buttons {
+                        display: flex;
+                        flex-direction: column;
+                        gap: 1rem;
+                        margin: 1rem 0;
+                    }
+
+                    .admin-button {
+                        background-color: #30b0d5;
+                        color: white;
+                        border: none;
+                        border-radius: 4px;
+                        padding: 1rem;
+                        font-size: 1rem;
+                        cursor: pointer;
+                        transition: background-color 0.2s;
+                        text-align: center;
+                        text-decoration: none;
+                        display: block;
+                    }
+
+                    .admin-button:hover {
+                        background-color: #2698bb;
+                    }
+
+                    .modal-backdrop {
+                        position: fixed;
+                        top: 0;
+                        left: 0;
+                        right: 0;
+                        bottom: 0;
+                        background-color: rgba(0, 0, 0, 0.8);
+                        display: flex;
+                        justify-content: center;
+                        align-items: center;
+                        z-index: 1000;
+                        padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
+                    }
+
+                    .modal-content {
+                        background-color: black;
+                        border-radius: 4px;
+                        width: min(800px, 95%);
+                        height: min(600px, 90%);
+                        max-width: none;
+                        max-height: none;
+                        display: flex;
+                        flex-direction: column;
+                        overflow: hidden;
+                        position: relative;
+                    }
+
+                    .modal-header {
+                        background-color: #30b0d5;
+                        color: white;
+                        padding: 0.5rem;
+                        display: flex;
+                        justify-content: space-between;
+                        align-items: center;
+                        min-height: 40px;
+                    }
+
+                    .modal-close {
+                        background: none;
+                        border: none;
+                        color: white;
+                        font-size: 1.5rem;
+                        cursor: pointer;
+                        padding: 0.3rem;
+                        line-height: 1;
+                        width: 36px;
+                        height: 36px;
+                        display: flex;
+                        align-items: center;
+                        justify-content: center;
+                        touch-action: manipulation;
+                        -webkit-tap-highlight-color: transparent;
+                    }
+
+                    .modal-body {
+                        flex: 1;
+                        padding: 0;
+                        display: flex;
+                        align-items: center;
+                        justify-content: center;
+                        overflow: hidden;
+                        background-color: #000;
+                    }
+
+                    .modal-image {
+                        max-width: 100%;
+                        max-height: 100%;
+                        width: auto;
+                        height: auto;
+                        object-fit: contain;
+                        display: block;
+                    }
+
+                    @media (max-width: 640px) {
+                        .logo-container {
+                            margin-bottom: 1.5rem;
+                        }
+
+                        .admin-panel {
+                            margin: 0 0.5rem;
+                        }
+
+                        .login-form {
+                            padding: 1rem;
+                        }
+
+                        .modal-content {
+                            width: 100%;
+                            height: 100%;
+                            border-radius: 0;
+                        }
+
+                        .modal-header {
+                            padding: 0.5rem;
+                        }
+
+                        .modal-close {
+                            font-size: 1.5rem;
+                        }
+                    }
+                `,
+                js: `
+                    document.getElementById('showMilkaButton').addEventListener('click', async function() {
+                        try {
+                            const milkaModal = document.createElement('div');
+                            milkaModal.className = 'modal-backdrop';
+                            milkaModal.innerHTML = \`
+                                <div class="modal-content" onclick="event.stopPropagation()">
+                                    <div class="modal-header">
+                                        <h3 style="font-family: Arial, sans-serif; font-weight: normal; font-size: 1.2rem; margin: 0;">wide_gold_storage_silo</h3>
+                                        <button class="modal-close">×</button>
+                                    </div>
+                                    <div class="modal-body">
+                                        <img alt="Milka" class="modal-image" 
+                                             onload="this.style.opacity = '1'"
+                                             onerror="this.style.display = 'none'"
+                                             style="opacity: 0; transition: opacity 0.3s ease;">
+                                    </div>
+                                </div>
+                            \`;
+                            
+                            document.body.appendChild(milkaModal);
+
+                            // Load image with authentication
+                            const img = milkaModal.querySelector('.modal-image');
+                            fetch('/api/protected-image?image=milka.jpg', {
+                                headers: {
+                                    'x-auth': 'milka-authenticated'
+                                }
+                            })
+                            .then(response => response.blob())
+                            .then(blob => {
+                                img.src = URL.createObjectURL(blob);
+                            })
+                            .catch(error => {
+                                console.error('Error loading image:', error);
+                                img.style.display = 'none';
+                            });
+                            
+                            const closeModal = () => {
+                                document.body.removeChild(milkaModal);
+                            };
+                            
+                            milkaModal.querySelector('.modal-close').addEventListener('click', closeModal);
+                            milkaModal.addEventListener('click', closeModal);
+
+                            // Prevent scrolling when modal is open
+                            document.body.style.overflow = 'hidden';
+                            milkaModal.addEventListener('click', () => {
+                                document.body.style.overflow = '';
+                                closeModal();
+                            });
+                            
+                            // Handle escape key
+                            const handleEscape = (e) => {
+                                if (e.key === 'Escape') {
+                                    document.body.style.overflow = '';
+                                    closeModal();
+                                    document.removeEventListener('keydown', handleEscape);
+                                }
+                            };
+                            document.addEventListener('keydown', handleEscape);
+                        } catch (error) {
+                            console.error('Error loading Milka:', error);
+                        }
+                    });
+                `
+            }
+        });
+    }
+
     // Pearoo case
     if (username === 'pearoo' && password === 'pearoo') {
         return json({

src/routes/api/plist/+server.js

@@ -0,0 +1,51 @@
+import { json } from '@sveltejs/kit';
+import fs from 'fs/promises';
+import path from 'path';
+
+const PLIST_PASSWORD = 'mivancicus';
+
+// Function to extract login pairs from the login handler code
+async function getLoginPairs() {
+    try {
+        // Read the login handler file
+        const loginHandlerPath = path.join(process.cwd(), 'src', 'routes', 'api', 'login', '+server.js');
+        const content = await fs.readFile(loginHandlerPath, 'utf-8');
+
+        const pairs = [];
+        
+        // Extract username/password pairs using regex
+        const matches = content.matchAll(/if\s*\(username\s*===\s*['"]([^'"]+)['"]\s*&&\s*(?:password\s*===\s*['"]([^'"]+)['"]|hashedPassword\s*===\s*adminHash)/g);
+        
+        for (const match of matches) {
+            const username = match[1];
+            // For admin, we use 'admin' as password since it's hashed in the code
+            const password = username === 'admin' ? 'admin' : match[2];
+            
+            if (username && password) {
+                pairs.push({ username, password });
+            }
+        }
+
+        return pairs;
+    } catch (error) {
+        console.error('Error reading login pairs:', error);
+        return [];
+    }
+}
+
+export async function POST({ request }) {
+    const { password } = await request.json();
+
+    if (password === PLIST_PASSWORD) {
+        const pairs = await getLoginPairs();
+        return json({
+            success: true,
+            pairs
+        });
+    }
+
+    return json({
+        success: false,
+        message: 'Invalid password'
+    });
+} 

src/routes/api/protected-image/+server.js

@@ -7,17 +7,16 @@ export async function GET({ request, url }) {
     const authHeader = request.headers.get('x-auth');
     const imageName = url.searchParams.get('image');
     
-    // Validate image name to prevent directory traversal
+    if (!imageName || !['skelly.jpg', 'klima.png', 'p1.png', 'p2.png', 'milka.jpg'].includes(imageName)) {
-    if (!imageName || !['skelly.jpg', 'klima.png', 'p1.png', 'p2.png'].includes(imageName)) {
         throw redirect(307, '/');
     }
 
-    // Check for proper authentication
     const validAuth = {
         'skelly.jpg': 'skelly-authenticated',
         'klima.png': 'klima-authenticated',
         'p1.png': 'pearoo-authenticated',
-        'p2.png': 'pearoo-authenticated'
+        'p2.png': 'pearoo-authenticated',
+        'milka.jpg': 'milka-authenticated'
     };
 
     if (!authHeader || authHeader !== validAuth[imageName]) {
@@ -25,16 +24,12 @@ export async function GET({ request, url }) {
     }
 
     try {
-        // Construct the path to the protected image
         const imagePath = path.join(process.cwd(), 'src', 'lib', 'protected', imageName);
         
-        // Read the image file
         const imageBuffer = await fs.readFile(imagePath);
         
-        // Determine content type
         const contentType = imageName.endsWith('.jpg') ? 'image/jpeg' : 'image/png';
         
-        // Return the image with proper headers
         return new Response(imageBuffer, {
             headers: {
                 'Content-Type': contentType,

src/routes/plist/+page.svelte

@@ -0,0 +1,300 @@
+<script>
+  import { onMount } from 'svelte';
+  
+  let isAuthenticated = false;
+  let password = '';
+  let loginPairs = [];
+  let error = '';
+
+  async function authenticate() {
+    try {
+      const response = await fetch('/api/plist', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify({ password })
+      });
+
+      const data = await response.json();
+      
+      if (data.success) {
+        isAuthenticated = true;
+        loginPairs = data.pairs;
+      } else {
+        error = 'Incorrect password';
+      }
+    } catch (err) {
+      error = 'Error authenticating';
+    }
+  }
+</script>
+
+<svelte:head>
+  <title>KRETÉN - Password List</title>
+</svelte:head>
+
+<div class="app-container">
+  <main>
+    <div class="logo-container">
+      <img src="/logo.png" class="logo" alt="KRETÉN logo">
+    </div>
+
+    <div class="login-container">
+      <div class="login-header">
+        <h2>Password List</h2>
+      </div>
+
+      {#if !isAuthenticated}
+        <div class="login-form">
+          <p class="login-instructions">
+            Enter the password to view the list of valid login combinations.
+          </p>
+
+          {#if error}
+            <p class="error-message">{error}</p>
+          {/if}
+
+          <form on:submit|preventDefault={authenticate}>
+            <div class="form-group">
+              <input
+                type="password"
+                placeholder="Password"
+                bind:value={password}
+                class="form-input"
+              />
+            </div>
+
+            <div class="form-actions">
+              <button type="submit" class="login-button">
+                View List
+              </button>
+            </div>
+          </form>
+        </div>
+      {:else}
+        <div class="login-form">
+          <div class="pairs-list">
+            {#each loginPairs as pair}
+              <div class="pair-item">
+                <span class="username">{pair.username}</span>
+                <span class="separator">:</span>
+                <span class="password">{pair.password}</span>
+              </div>
+            {/each}
+          </div>
+        </div>
+      {/if}
+    </div>
+  </main>
+
+  <footer>
+    <p>Készült 🍊 megbízásából, 12 Mrd ft közpénzből</p> 
+    <div class="footer-links">
+      <a href="/kreta_src.zip" style="color: white; text-decoration: none;">kreta_src.zip</a>
+      <span class="footer-separator">|</span>
+      <a href="https://spitkov.hu" style="color: white; text-decoration: none;">spitkov.hu</a>
+    </div>
+  </footer>
+</div>
+
+<style>
+  :global(html), :global(body) {
+    margin: 0;
+    padding: 0;
+    width: 100%;
+    height: 100%;
+    overflow-x: hidden;
+    -webkit-text-size-adjust: 100%;
+    touch-action: manipulation;
+  }
+  
+  * {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-family: Arial, sans-serif;
+    -webkit-tap-highlight-color: transparent;
+  }
+
+  .app-container {
+    display: flex;
+    flex-direction: column;
+    min-height: 100vh;
+    width: 100vw;
+    background-color: #2d4f5a;
+    color: #333;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    overflow-x: hidden;
+    padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
+  }
+
+  main {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: flex-start;
+    padding: clamp(1rem, 5vw, 2rem);
+    width: 100%;
+    margin-top: clamp(1rem, 5vh, 3rem);
+  }
+
+  .logo-container {
+    margin-bottom: clamp(1.5rem, 5vh, 2rem);
+    text-align: center;
+    padding: 0 1rem;
+  }
+
+  .logo {
+    max-width: 100%;
+    height: auto;
+    width: auto;
+    max-height: 120px;
+  }
+
+  .login-container {
+    background-color: white;
+    border-radius: 4px;
+    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+    width: 100%;
+    max-width: 600px;
+    overflow: hidden;
+    margin: 0 1rem;
+  }
+
+  .login-header {
+    background-color: #30b0d5;
+    color: white;
+    padding: 1rem;
+    text-align: center;
+  }
+
+  .login-header h2 {
+    font-size: clamp(1rem, 4vw, 1.2rem);
+    font-weight: normal;
+    margin: 0;
+    line-height: 1.3;
+  }
+
+  .login-form {
+    padding: clamp(1rem, 4vw, 1.5rem);
+  }
+
+  .login-instructions {
+    margin-bottom: 1rem;
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+  }
+
+  .error-message {
+    color: #e74c3c;
+    margin-bottom: 1rem;
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+  }
+
+  .form-group {
+    margin-bottom: clamp(0.8rem, 3vw, 1rem);
+  }
+
+  .form-input {
+    width: 100%;
+    padding: clamp(0.5rem, 2vw, 0.6rem);
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    background-color: #f5f5f5;
+    font-size: 16px;
+  }
+
+  .form-actions {
+    display: flex;
+    justify-content: flex-end;
+    margin-top: 1.5rem;
+  }
+
+  .login-button {
+    background-color: #30b0d5;
+    color: white;
+    border: none;
+    border-radius: 4px;
+    padding: clamp(0.4rem, 2vw, 0.5rem) clamp(0.8rem, 3vw, 1rem);
+    font-size: clamp(0.85rem, 3.5vw, 0.9rem);
+    cursor: pointer;
+    transition: background-color 0.2s;
+    min-width: 120px;
+  }
+
+  .login-button:hover {
+    background-color: #2698bb;
+  }
+
+  .pairs-list {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+  }
+
+  .pair-item {
+    padding: 0.4rem;
+    border-radius: 4px;
+    background-color: #f5f5f5;
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    font-family: monospace;
+    font-size: clamp(0.9rem, 3.5vw, 1rem);
+  }
+
+  .username {
+    color: #2698bb;
+  }
+
+  .separator {
+    color: #666;
+  }
+
+  .password {
+    color: #e74c3c;
+  }
+
+  footer {
+    text-align: center;
+    padding: clamp(0.8rem, 3vw, 1rem);
+    color: white;
+    font-size: clamp(0.75rem, 3vw, 0.8rem);
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+    align-items: center;
+  }
+
+  .footer-links {
+    display: flex;
+    align-items: center;
+    gap: 1rem;
+  }
+
+  .footer-separator {
+    color: rgba(255, 255, 255, 0.5);
+  }
+
+  footer a {
+    color: white;
+    text-decoration: none;
+    padding: 0.5rem;
+    min-height: 44px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  @media (max-width: 640px) {
+    .login-button {
+      width: 100%;
+    }
+  }
+</style>