Endpoint Services

Tom Larkworthy

webcode.run

<!DOCTYPE html>
<html lang="uk">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>Наші Розмови / Nasze Rozmowy ❤️</title>
    <style>
        :root {
            --bg: #0f172a;
            --card: #1e293b;
            --accent: #f43f5e;
            --text-main: #f8fafc;
            --text-secondary: #94a3b8;
        }
        body {
            background-color: var(--bg);
            color: var(--text-main);
            font-family: 'Segoe UI', system-ui, sans-serif;
            margin: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            overflow: hidden;
            -webkit-tap-highlight-color: transparent;
        }
        .container {
            width: 90%;
            max-width: 400px;
            text-align: center;
        }
        .card {
            background: var(--card);
            border-radius: 30px;
            min-height: 380px;
            padding: 35px 25px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            box-shadow: 0 25px 50px -12px rgba(0,0,0,0.5);
            border: 1px solid rgba(255,255,255,0.1);
            margin-bottom: 25px;
            transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
            cursor: pointer;
        }
        .ua {
            font-size: 1.35rem;
            font-weight: 700;
            margin-bottom: 25px;
            line-height: 1.4;
        }
        .pl {
            font-size: 1.1rem;
            font-style: italic;
            color: var(--text-secondary);
            line-height: 1.4;
            border-top: 1px solid rgba(255,255,255,0.1);
            padding-top: 20px;
            width: 100%;
        }
        .btn {
            background: linear-gradient(135deg, #f43f5e 0%, #fb7185 100%);
            color: white;
            border: none;
            padding: 20px;
            border-radius: 20px;
            font-size: 1.1rem;
            font-weight: bold;
            width: 100%;
            cursor: pointer;
            box-shadow: 0 10px 15px -3px rgba(244, 63, 94, 0.4);
            text-transform: uppercase;
            letter-spacing: 1px;
        }
        .btn:active { transform: scale(0.97); }
        .counter { margin-top: 20px; font-size: 0.85rem; color: #64748b; font-weight: 500; }
    </style>
</head>
<body>

<div class="container">
    <div class="card" id="card" onclick="nextCard()">
        <div class="ua" id="ua-text">Готові до щирої розмови? ❤️</div>
        <div class="pl" id="pl-text">Gotowi na szczerą rozmowę?</div>
    </div>
    <button class="btn" onclick="nextCard()">Наступна / Następna</button>
    <div class="counter" id="counter">51 запитання / 51 pytań</div>
</div>

<script>
    const questions = [
        {ua: "Як я можу зрозуміти, що ти втомився емоційно, навіть якщо ти мовчиш?", pl: "Jak mogę zrozumieć, że jesteś emocjonalnie zmęczony, nawet jeśli milczysz?"},
        {ua: "Які слова підтримки для тебе найважливіші?", pl: "Jakie słowa wsparcia są dla Ciebie najważniejsze?"},
        {ua: "Що тобі допомагає розслабитися після важкого робочого дня?", pl: "Co pomaga Ci się zrelaksować po ciężkim dniu pracy?"},
        {ua: "Якби ми пішли на спільні курси (танці, кулінарія, водіння), що б це було?", pl: "Gdybyśmy poszli na wspólny kurs (taniec, gotowanie, prawo jazdy itp.), co by to było?"},
        {ua: "Наскільки для тебе важливо, щоб ми обговорювали разом новини?", pl: "Jak ważne jest dla Ciebie, abyśmy wspólnie omawiali wiadomości ze świata?"},
        {ua: "Що для тебе є найважливішим у вихованні дитини?", pl: "Co jest dla Ciebie najważniejsze w wychowaniu dziecka?"},
        {ua: "Який спільний ритуал міг би стати нашим (кава в ліжко, побачення щосуботи)?", pl: "Jaki wspólny rytuał mógłby stać się nasz (kawa do łóżka, randka w każdą sobotę)?"},
        {ua: "Яка пісня або аромат у тебе асоціюється зі мною?", pl: "Jaka piosenka lub zapach kojarzy Ci się ze mną?"},
        {ua: "Що для тебе є найкращим способом помиритися (обійми, розмова, час на самоті)?", pl: "Jaki jest dla Ciebie najlepszy sposób na pogodzenie się (przytulenie, rozmowa, czas w samotności)?"},
        {ua: "Чи є теми, які тобі важко обговорювати?", pl: "Czy są tematy, o których trudno Ci rozmawiać?"},
        {ua: "Наскільки для тебе важливо мати повну самотність хоча б раз на тиждень?", pl: "Jak ważne jest dla Ciebie, aby mieć czas na całkowitą samotność przynajmniej raz w tygodniu?"},
        {ua: "Яку атмосферу в нашому домі ти хочеш бачити: порядок чи ідеальний хаос?", pl: "Jaką atmosferę w naszym domu chcesz widzieć: porządek czy idealny chaos?"},
        {ua: "Яке питання ти дуже хотів поставити мені, але не наважувався?", pl: "Jakie pytanie bardzo chciałeś mi zadać, ale nie miałeś odwagi?"},
        {ua: "Якби ти міг змінити одну мою звичку, що б це було?", pl: "Gdybyś mógł zmienić jeden mój nawyk, co by to było?"},
        {ua: "Яку б пораду ти дав собі у віці 10 років?", pl: "Jaką radę dałbyś sobie w wieku 10 lat?"},
        {ua: "Як ти ставишся до кредитів на спільні цілі (будинок, машина)?", pl: "Co sądzisz o kredytach na wspólne cele (dom, samochód)?"},
        {ua: "Як ти ставишся до того, щоб ми знали паролі один одного?", pl: "Co sądzisz o tym, abyśmy znali nawzajem swoje hasła?"},
        {ua: "Я відчуваю, що ти мене любиш, коли ти...?", pl: "Czuję, że mnie kochasz, kiedy Ty...?"},
        {ua: "Яка звичка у наших стосунках дає тобі найбільше відчуття стабільності?", pl: "Jaki nawyk w naszym związku daje Ci największe poczucie stabilizacji?"},
        {ua: "Що для тебе найважче у переїзді: невідомість, побут чи розлука з людьми?", pl: "Co jest dla Ciebie najtrudniejsze w przeprowadzce: niepewność, trudności domowe czy rozłąka z ludźmi?"},
        {ua: "Який момент ти вважаєш у наших стосунках найщасливішим?", pl: "Który moment w naszym związku uważasz za najszczęśliwszy?"},
        {ua: "Яка риса мого характеру тобі подобається найбільше?", pl: "Która cecha mojego charakteru podoba Ci się najbardziej?"},
        {ua: "Як виглядає твій ідеальний день через 5 років?", pl: "Jak wygląda Twój idealny dzień za 5 lat?"},
        {ua: "Яку сімейну традицію ти хотів би започаткувати?", pl: "Jaką rodzinną tradycję chciałbyś/chciałabyś zapoczątkować?"},
        {ua: "Що для тебе є неприпустимим у стосунках (red flag)?", pl: "Co jest dla Ciebie niedopuszczalne w związku (red flag)?"},
        {ua: "Яку хатню справу ти терпіти не можеш робити?", pl: "Której czynności domowej nienawidzisz robić?"},
        {ua: "За що ти найбільше вдячний у своєму житті прямо зараз?", pl: "Za co jesteś teraz najbardziej wdzięczny w swoim życiu?"},
        {ua: "Якби ти міг змінити одну річ у минулому, що б це було?", pl: "Gdybyś mógł zmienić jedną rzecz w przeszłości, co by to było?"},
        {ua: "Який твій найбільший страх і як я можу тебе підтримати?", pl: "Jaki jest Twój największy strach i jak mogę Cię wspierać?"},
        {ua: "Яку навичку ти давно мрієш опанувати?", pl: "Jaką umiejętność od dawna marzysz opanować?"},
        {ua: "Якби ми виграли в лотерею мільйон доларів, на що б витратили?", pl: "Gdybyśmy wygrali milion dolarów na loterii, na co byśmy je wydali?"},
        {ua: "Якби ми могли перенестися у будь-яку точку світу, де б ми опинилися?", pl: "Gdybyśmy mogli przenieść się w dowolne miejsce na świecie, gdzie byśmy byli?"},
        {ua: "Як ти розумієш, що я на тебе злюся?", pl: "Skąd wiesz, że jestem na Ciebie zły/zła?"},
        {ua: "Яку пораду ти б дав собі перед початком наших стосунків?", pl: "Jaką radę dałbyś sobie przed rozpoczęciem naszego związku?"},
        {ua: "Чи є щось, що ти боїшся мені сказати?", pl: "Czy jest coś, co boisz się mi powiedzieć?"},
        {ua: "Якби гроші не мали значення, чим би ти займався?", pl: "Gdyby pieniądze nie miały znaczenia, czym zajmowałbyś się na co dzień?"},
        {ua: "Як я можу підтримати тебе у важкий період у справах?", pl: "Jak mogę Cię wspierać, gdy masz trudny okres w interesach?"},
        {ua: "Велика вечірка чи вечір з серіалом вдома?", pl: "Duża impreza czy wieczór z serialem w domu?"},
        {ua: "Гори чи море?", pl: "Góry czy morze?"},
        {ua: "Спільне тренування чи спільний пізній сніданок?", pl: "Wspólny trening czy wspólne późne śniadanie?"},
        {ua: "Що важливіше: бути правим у сварці чи бути почутим?", pl: "Co jest ważniejsze: mieć rację czy zostać wysłuchanym?"},
        {ua: "Наскільки для тебе важливо почути схвалення від рідних?", pl: "Jak ważne jest dla Ciebie uzyskanie aprobaty od bliskich?"},
        {ua: "Якби ми приймали гостей декілька днів, ми б розподіляли обов'язки?", pl: "Gdybyśmy gościli kogoś przez kilka dni, czy dzielilibyśmy obowiązki?"},
        {ua: "Чому тебе навчили попередні стосунки?", pl: "Czego nauczyły Cię poprzednie związki, co wykorzystujesz teraz?"},
        {ua: "Хто з дорослих був для тебе прикладом стосунків?", pl: "Kto z dorosłych był dla Ciebie przykładem idealnego związku?"},
        {ua: "Що для тебе було найбільшим викликом у житті?", pl: "Co było dla Ciebie największym wyzwaniem w życiu?"},
        {ua: "Які три речі мають бути в нашому домі для щастя?", pl: "Jakie trzy rzeczy muszą być w naszym domu, abyśmy byli szczęśliwi?"},
        {ua: "Як ти бачиш нашу роль у житті через 10 років?", pl: "Jak widzisz naszą rolę w życiu za 10 lat?"},
        {ua: "Вечеря в ресторані чи пікнік на заході сонця?", pl: "Kolacja w restauracji czy piknik o zachodzie słońca?"},
        {ua: "Наскільки для тебе важливо, щоб партнер саморозвивався?", pl: "Jak ważne jest dla Ciebie, aby partner się rozwijał?"},
        {ua: "Чи є в тебе список спільних бажань?", pl: "Czy masz listę marzeń, które powinniśmy zrealizować razem?"}
    ];

    let deck = [...questions];

    function nextCard() {
        const uaEl = document.getElementById('ua-text');
        const plEl = document.getElementById('pl-text');
        const counter = document.getElementById('counter');
        const card = document.getElementById('card');

        if (deck.length === 0) {
            uaEl.innerText = "Гру завершено! Почнемо знову? ❤️";
            plEl.innerText = "Koniec gry! Zacząć od nowa?";
            deck = [...questions];
            counter.innerText = "Всі картки пройдено / Wszystkie karty zaliczone";
            return;
        }

        card.style.transform = "scale(0.95) translateY(10px)";
        card.style.opacity = "0.5";

        setTimeout(() => {
            const idx = Math.floor(Math.random() * deck.length);
            const q = deck.splice(idx, 1)[0];

            uaEl.innerText = q.ua;
            plEl.innerText = q.pl;
            counter.innerText = `Залишилось: ${deck.length} / Zostało: ${deck.length}`;
            
            card.style.transform = "scale(1) translateY(0)";
            card.style.opacity = "1";
        }, 150);
    }
</script>
</body>
</html>

Лариса Талько

Korakot C.

<!DOCTYPE html>
<html lang="zh-TW">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>稻禾屋日式丼飯菜單</title>
  <script src="https://cdn.tailwindcss.com"></script>
  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Noto+Sans+TC:wght@400;700&display=swap" rel="stylesheet" />
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" />
  <style>
    body {
      font-family: 'Noto Sans TC', 'Inter', sans-serif;
      background-color: #f0f4f8;
      display: flex;
      flex-direction: column;
      align-items: center;
      padding: 2rem;
    }
    .container {
      max-width: 650px;
      background: white;
      border-radius: 1rem;
      box-shadow: 0 10px 20px rgba(0,0,0,0.1);
      padding: 2rem;
      width: 100%;
    }
    footer {
      margin-top: 3rem;
      font-size: 0.9rem;
      color: #777;
    }
    .hidden {
      display: none;
    }
    .tab-button.active {
      background-color: #3182ce;
      color: white;
    }
    .menu-item {
      border: 1px solid #ccc;
      border-radius: 0.5rem;
      padding: 1rem;
      margin-bottom: 1rem;
      cursor: pointer;
    }
    .menu-item-expanded-content {
      margin-top: 1rem;
    }
    .combo-details-content {
      background-color: #f0f8ff;
      padding: 0.75rem;
      border-radius: 0.5rem;
      margin-top: 0.5rem;
    }
  </style>
</head>
<body>

  <div class="container">
    <h1 class="text-2xl font-bold mb-2 text-center">歡迎光臨稻禾屋！</h1>
    <h2 class="text-xl font-semibold mb-4 text-center">日式丼飯菜單</h2>

    <div class="tabs-container flex gap-2 justify-center mb-4">
      <button class="tab-button active" onclick="showTab('mainDonburi')">主食丼飯</button>
      <button class="tab-button" onclick="showTab('sideDishes')">精選小菜</button>
      <button class="tab-button" onclick="showTab('drinks')">飲品</button>
    </div>

    <div id="mainDonburi" class="tab-content">
      <div class="menu-item" onclick="toggleMenuItem(this)">
        <div class="menu-item-header flex justify-between">
          <div class="menu-item-name font-semibold text-left">經典牛丼</div>
          <div class="menu-item-price text-red-500 font-bold">NT$180</div>
        </div>
        <div class="menu-item-expanded-content hidden">
          <img src="https://placehold.co/350x200/FFDDC1/804000?text=牛肉丼飯" alt="經典牛丼" class="w-full rounded mb-2" />
          <div class="menu-item-description-detail text-sm text-gray-700 mb-2">
            特選美國牛肉片150克、香Q白飯250克、洋蔥、青蔥。<br>
            醬汁甘甜，牛肉軟嫩，不辣。
          </div>
          <div class="combo-details-content hidden">
            搭配套餐：日式綠茶一杯 (+NT$35)
          </div>
        </div>
      </div>
    </div>

    
  </div>

  <footer id="pageFooter" class="text-center text-sm text-gray-500">
    
  </footer>

  <script>
    const footer = document.getElementById("pageFooter");
    if (footer) {
      footer.innerHTML = "© 2025 稻禾屋日式丼飯｜本頁由 Gemini + ChatGPT 協作製作";
    }

    function showTab(tabId) {
      document.querySelectorAll('.tab-content').forEach(el => el.classList.add('hidden'));
      document.querySelectorAll('.tab-button').forEach(btn => btn.classList.remove('active'));
      document.getElementById(tabId).classList.remove('hidden');
      const matchingBtn = Array.from(document.querySelectorAll('.tab-button')).find(b => b.onclick.toString().includes(tabId));
      if (matchingBtn) matchingBtn.classList.add('active');
    }

    function toggleMenuItem(itemEl) {
      const content = itemEl.querySelector('.menu-item-expanded-content');
      content.classList.toggle('hidden');
    }
  </script>
</body>
</html>

Y2kvbn

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <title>나나의 첫 번째 웹사이트</title>
    <style>
        /* 간단한 디자인을 추가했어요 */
        body { font-family: sans-serif; text-align: center; padding-top: 50px; background-color: #f0f8ff; }
        h1 { color: #333; }
        p { color: #666; }
    </style>
</head>
<body>
    <h1>안녕하세요, 나나입니다! 🚀</h1>
    <p>저의 첫 번째 코딩 결과물이에요. 여기서부터 시작입니다!</p>
    <button onclick="alert('반가워요, 나나님!')">클릭해보세요</button>
</body>
</html>

Nana yu

image@9.png

image@8.png

image@4.png

image@5.png

image@6.png

image@7.png

image@2.png

insertcell.png

login.png

publish.png

addcomment.png

link.png

image@10.png

iframe_html.png

WEBcode.run

Quickstart