Comments (5)
Korakot C.
Aug 22, 2022Typo "wehcode"
Tom Larkworthy
Aug 22, 2022👍
Y2kvbn
Jul 24, 2025<!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>
<!-- 可新增更多 tab-content 區塊（小菜/飲品） -->
</div>
<footer id="pageFooter" class="text-center text-sm text-gray-500">
<!-- 此區會被 JS 替換 -->
</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>
Nana yu
Feb 18<!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>
Лариса Талько
Apr 20<!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>