From d1848333cc4e1c0054309b28380dc1f3695a2cd3 Mon Sep 17 00:00:00 2001 From: temp Date: Mon, 17 Aug 2026 10:41:18 +0000 Subject: [PATCH] Iceland travel landing with parallax landscapes --- AGENTS.md | 21 +- design.md | 39 +--- index.html | 641 +++++++++++++++++++++++++++++++---------------------- 3 files changed, 393 insertions(+), 308 deletions(-) diff --git a/AGENTS.md b/AGENTS.md index 698022f..331fbab 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -23,14 +23,14 @@ Workspace юзера `temp`. Это **учебная среда**, где обы | Что хочет юзер | Стек (ЖЁСТКО) | Рецепт | |----------------|---------------|--------| -| Сайт, лендинг, визитка, портфолио, меню, афиша, waitlist | **Статика:** `index.html` + `style.css` + `script.js`, ванильный JS. БЕЗ сборки, БЕЗ React/Vue/Vite, БЕЗ npm. Tailwind — только CDN. | старт с `design.md`, публикация в `pages` | +| Веб сайт фронтенд на javascript | **Статика:** `index.html` + `style.css` + `script.js` + еще файлы для фронтенда, ванильный JS. БЕЗ сборки, БЕЗ React/Vue/Vite, БЕЗ npm. Tailwind или bootstrap — только CDN. | старт с `design.md`, публикация в `pages` | | Telegram-бот | **Node.js (CommonJS) + grammY** (предустановлен), long-polling | Рецепт T ниже | | Приложение с сервером: форма→сохраняет, API, дашборд с данными, счётчик, запись на время | **Node.js (CommonJS), сервер на `node:http` БЕЗ зависимостей + хранение в `data.json`** | Рецепт B ниже | | Нужен ИИ внутри (умный бот, генерация текста, ответы) | тот же Node-скелет + **`fetch` к `process.env.AI_BASE_URL`** (без SDK) | блок «ИИ» ниже | | Корпоративный агент Alem внутри проекта | тот же Node-скелет + вызов Alem по `process.env.ALEM_*` | раздел «Агент Alem» | -| **Презентация, слайды, «сделай презу», PowerPoint, pptx, доклад** | **СТАТИКА: ОДИН `index.html` + pptxgenjs с CDN. Бэкенд НЕ поднимать, ИИ в рантайме НЕ звать** | раздел «ПРЕЗЕНТАЦИИ» — бери оттуда скелет целиком | +| **Презентация, слайды, «сделай презу», PowerPoint, pptx, доклад** | **СТАТИКА: ОДИН `index.html` + pptxgenjs с CDN. Бэкенд НЕ поднимать, если нужно сделать эмуляцию на фронтенде javascript, ИИ в рантайме НЕ звать** | раздел «ПРЕЗЕНТАЦИИ» — бери оттуда скелет целиком | | Разобрать документы юзера (Excel / Word / PDF): свод, отчёт, выжимка | Предустановленные `xlsx` / `mammoth` / `pdf-parse` | раздел «ПРОЕКТ ПРИНИМАЕТ ФАЙЛЫ ЮЗЕРОВ» | -| **Учёт и трекер:** склад, заявки, журнал, задачи, СИЗ, путевые листы, сбор статистики, отчётность | **Node.js + `node:http` + `data.json`** — тот же Рецепт B, но несколько сущностей и статусы | Рецепт B + «УЧЁТНАЯ СИСТЕМА» ниже | +| **Учёт и трекер:** склад, заявки, журнал, задачи, СИЗ, путевые листы, сбор статистики, отчётность и любые другие решения | **Node.js + `node:http` + `data.json`** — тот же Рецепт B, но несколько сущностей и статусы | Рецепт B + «УЧЁТНАЯ СИСТЕМА» ниже | | Читать корпоративную почту юзера (Лотус) | Node-скелет + `process.env.LOTUS_*` | раздел «бот, читающий почту (Lotus)» | **Сначала таблица, потом код.** Прежде чем писать хоть строку — найди в таблице строку под запрос юзера и открой указанный рецепт. Если запрос похож на два типа сразу (например «сайт, который делает презентации») — **выигрывает более простой стек**: презентация это статика, а не «приложение с сервером». Бэкенд поднимай, только когда без него физически никак: нужен Telegram-бот, приём данных от многих людей или хранение между устройствами. @@ -241,7 +241,7 @@ echo '{"Июль":[["Показатель","Значение"],["Пользов --- -## 📊 УЧЁТНАЯ СИСТЕМА (склад, заявки, журнал, задачи, СИЗ, путевые листы) +## 📊 УЧЁТНАЯ СИСТЕМА (склад, заявки, журнал, задачи, СИЗ, путевые листы и любые другия решения) Юзер просит «вести учёт», «трекер», «журнал», «заявки», «склад», «отчёт по сотрудникам»? Это Рецепт B, но с несколькими сущностями и статусами. Не изобретай схему — бери эту. @@ -400,8 +400,9 @@ if (req.method === "POST" && req.url === "/api/upload") { - Афиша мероприятия (концерт, день рождения, мастер-класс) - Меню заведения / прайс услуг - Лендинг продукта или будущего проекта (waitlist) + - МОжешь придумать варианты 3. Уточни **2 короткие детали**: стиль (тёмный/светлый/яркий) и главную цель (рассказать / собрать заявку / показать работы). -4. Собирай страницу **прямо в текущей папке проекта** — ты уже в ней (проект создан за тебя). Создавай `index.html`/`style.css`/`script.js` тут же. **НЕ запускай `./new-project`** и не делай `cd` в другие папки. Не спрашивай разрешения на каждый шаг. +4. Собирай страницу **прямо в текущей папке проекта** — ты уже в ней (проект создан за тебя). Создавай `index.html`/`style.css`/`script.js` и другие файлы тут же. **НЕ запускай `./new-project`** и не делай `cd` в другие папки. Не спрашивай разрешения на каждый шаг. --- @@ -441,7 +442,7 @@ if (req.method === "POST" && req.url === "/api/upload") { ## 💬 ЕСЛИ ЮЗЕР ОТВЕЧАЕТ РАСПЛЫВЧАТО -Юзер говорит «сделай что-нибудь» / «ну хз» / «сюрприз» → **не делай ничего абстрактного**. +Юзер говорит «сделай что-нибудь» / «ну хз» / «сюрприз» → **придумай что-то, но четкое и точное, не абстрактное**. Скажи: «Давай определимся, я задам 3 коротких вопроса: 1. Это для тебя лично, для проекта/бизнеса, или для события? @@ -621,7 +622,7 @@ git push origin HEAD:pages ## ⚠️ ЖЕЛЕЗНЫЕ ПРАВИЛА (НЕ нарушать никогда) -1. **Дефолт — статика (HTML + CSS + JS).** Сайты и лендинги собирай статикой, публикация через `pages`. +1. **Дефолт — статика (HTML + CSS + JS), можешь добавить анимацию и паралакс эффекты.** Сайты и лендинги собирай можешь добавить анимацию и паралакс эффекты, публикация через `pages`. 2. **Бэкенд разрешён ТОЛЬКО через команду `run`** (раздел ниже). НИКОГДА не запускай серверы сам в шелле (`node server.js`, `npm start`, `python bot.py`) — шелл живёт на общем хосте: процесс убьют, а твоя сессия повиснет. 3. **Никакой аутентификации / OAuth / JWT.** 4. **Никакого Docker, nginx, sudo, системных настроек.** @@ -823,7 +824,7 @@ git push origin HEAD:pages - ❌ `git init` в workspace root - ❌ `npm install` с прод-зависимостями (express/mongoose/pg/prisma/next/nuxt) -- ❌ Поднимать бэкенд там, где хватает статики (лендинг, визитка, презентация) — сверься с таблицей стека +- ❌ Поднимать бэкенд там, где хватает статики (сайт с фронтом можно на javascript ) — сверься с таблицей стека - ❌ Ставить прод-фреймворки (express / nest / next / django) — сервер только на `node:http` - ❌ Использовать `gh` CLI или GitHub API - ❌ Вызывать Gitea Pages-API (его нет) @@ -832,9 +833,7 @@ git push origin HEAD:pages - ❌ Задавать юзеру 10 вопросов подряд (максимум 2-3 за раз) - ❌ **Публиковать сам (push в `pages`) без просьбы юзера / кнопки «Опубликовать»** — до публикации показывай результат только через Предпросмотр - ❌ **Запускать `./new-project` или уходить `cd` из текущей папки проекта** на обычный запрос «сделай сайт» — ты УЖЕ в папке проекта, собирай тут; иначе сайт уедет не в тот проект -- ❌ Показывать юзеру голый код больше 1 раза — ему важен результат, а не как написано -- ❌ Предлагать «давай сначала дизайн в Figma» — мы делаем сразу в HTML -- ❌ Говорить «это сложно» — переформулируй в простое +- ❌ Предлагать «давай сначала дизайн в Figma» — мы делаем сразу в HTML/CSS/JS - ❌ Зависать в обсуждениях — сделай первый вариант грубо, потом итерируй --- diff --git a/design.md b/design.md index 934bae8..d5ab368 100644 --- a/design.md +++ b/design.md @@ -1,33 +1,18 @@ -# AirSound Pro — Дизайн-система +# Iceland Travel — Дизайн-система ## Цвета -- Фон: `#000000` (глубокий чёрный) -- Текст основной: `#F5F5F7` (светло-серый Apple) -- Текст вторичный: `#86868B` (приглушённый серый) -- Акцент 1: `#6E6E73` (серый металл) -- Акцент 2: `#2997FF` (Apple blue) -- Градиент: `linear-gradient(135deg, #667eea 0%, #764ba2 100%)` +- Фон: `#0B0F19` (глубокий тёмно-синий) +- Текст: `#FFFFFF` +- Текст вторичный: `#94A3B8` +- Акцент: `#00D4FF` (северное сияние) +- Акцент 2: `#7C3AED` (фиолетовый закат) ## Типографика -- Заголовки: `-apple-system, BlinkMacSystemFont, "SF Pro Display"` -- Размер H1: `clamp(48px, 8vw, 96px)` -- Размер H2: `clamp(32px, 5vw, 64px)` -- Текст: `17px`, line-height `1.5` +- Заголовки: `-apple-system, "SF Pro Display"` +- H1: `clamp(56px, 9vw, 112px)` +- H2: `clamp(40px, 6vw, 72px)` ## Эффекты -- Параллакс: `transform: translateZ()` + `perspective` -- Блюр: `backdrop-filter: blur(20px)` -- Анимация: `transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1)` -- Тени: мягкие, рассеянные `box-shadow: 0 20px 40px rgba(0,0,0,0.4)` - -## Структура лендинга -1. **Hero** — продукт на фоне градиента, крупный заголовок, CTA -2. **Features** — 3 карточки преимуществ с иконками -3. **Showcase** — полноэкранная секция с параллаксом изображений -4. **Tech Specs** — характеристики в виде сетки -5. **CTA / Footer** — финальный призыв к действию - -## Изображения -- Picsum: `https://picsum.photos/1920/1080?random=1` -- Unsplash Source: `https://images.unsplash.com/photo-...` -- Градиентные фоны вместо тяжёлых фото +- Параллакс: multiple layers с разной скоростью +- Градиенты: `linear-gradient(180deg, transparent, #0B0F19)` +- Анимации: `cubic-bezier(0.25, 1, 0.5, 1)` diff --git a/index.html b/index.html index aea6d73..5025d0d 100644 --- a/index.html +++ b/index.html @@ -3,7 +3,7 @@ - AirSound Pro — Звук будущего + Исландия — Земля льда и пламени @@ -394,153 +476,172 @@
-
+
+
+
-

Звук за пределами реальности

-

Погрузитесь в мир идеального звучания с AirSound Pro

-
- Купить от 29 990 ₸ - Узнать больше +

Земля льда и пламени

+

Открой для себя самую загадочную страну мира

+ Начать путешествие +
+
+ + +
+
+

Направления

+

Места, которые захватывают дух

+
+
+
+ Водопад +
+

Водопад Гюдльфосс

+

Один из самых красивых водопадов Исландии

+
+
+
+ Гейзер +
+

Долина гейзеров

+

Гейзер Строккур извергается каждые 5-10 минут

+
+
+
+ Лагуна +
+

Голубая лагуна

+

Геотермальный спа-курорт мирового класса

+
+
+
+ Северное сияние +
+

Северное сияние

+

Природное явление, которое нужно увидеть хотя бы раз

+
- -
-

Технологии будущего

-
-
-
🎧
-

Активное шумоподавление

-

Поглощение до 99% внешнего шума для полного погружения в музыку

-
-
-
🔋
-

40 часов работы

-

Невероятная автономность без подзарядки в течение дней

-
-
-
🎵
-

Пространственное аудио

-

Эффект присутствия в концертном зале у вас дома

-
-
-
💧
-

Влагозащита IPX4

-

Защита от пота и брызг для активных тренировок

-
-
-
⚡
-

Быстрая зарядка

-

5 минут зарядки = 2 часа прослушивания

-
-
-
📱
-

Мгновенное подключение

-

Автоматическое сопряжение со всеми устройствами Apple

+ +
+
+
+
+

Приключение всей жизни

+

Вулканы, ледники, водопады, гейзеры и северное сияние — Исландия собрала все чудеса природы в одном месте

+ Выбрать тур +
+
+ + +
+
+
+
+

10K+

+

Водопадов

+
+
+

130

+

Вулканов

+
+
+

600

+

Горячих источников

+
+
+

24/7

+

Северное сияние зимой

+
- -
-
-
-
-

Дизайн, который вдохновляет

-

Премиальные материалы, безупречная эргономика и внимание к каждой детали

- Смотреть цвета + + - - -
-
-

Характеристики

-
-
-
40ч
-
Время работы
-
-
-
40мм
-
Драйверы
-
-
-
250г
-
Вес
-
-
-
BT 5.3
-
Bluetooth
-
-
-
ANC
-
Шумоподавление
-
-
-
USB-C
-
Зарядка
-
+
+
+ Пейзаж +
+
+ Горы +
+
+ Океан +
+
+ Ледник +
+
+ Пляж +
+
+ Фьорд
-
-

Готовы к новому уровню?

-

AirSound Pro уже ждут вас. Закажите сегодня и получите бесплатную доставку.

-
- - -
+
+

Готовы к приключению?

+

Забронируйте тур в Исландию прямо сейчас и получите скидку 20% на групповые поездки

+ Забронировать тур