Skip to content

Repository files navigation

Mops Storage

Оновлена версія особистого сайту Indi Mops. Це, як і раніше, звичайний статичний сайт для GitHub Pages — без npm, фреймворків, бази даних і зовнішньої CMS.

Редизайн зберігає характер версії 2021–2022 років: темне тло, жовтий акцент, круглий аватар, кольорові деталі та особистий архів. Водночас навігація, мобільна версія, семантика й доступність написані заново.

Структура

.
├── index.html              # українська головна
├── about.html              # історія та інтереси
├── projects.html           # новіші й архівні проєкти
├── game.html               # ігровий архів
├── manga.html              # архів перекладів
├── support.html            # способи підтримки
├── 404.html
├── en/                     # англійські відповідники сторінок
├── assets/
│   ├── css/site.css        # одна адаптивна система стилів
│   ├── js/site.js          # header/footer, меню, фільтри, анімації
│   └── ...                 # зображення, шрифти й архівні медіа
├── scripts/build-site.ps1  # збирає чистий production-каталог
└── .github/workflows/static.yml

Каталог version/ залишений у робочому дереві як архів старого релізу, але не потрапляє у GitHub Pages artifact. Старі каталоги pl/, modules/ та невикористані медіа видалені з актуальної версії проєкту.

Мови

Українська версія живе в корені сайту (/), англійська — у /en/. Перемикач у спільному header веде на сторінку з тим самим іменем у вибраній мові, наприклад /about.html ↔ /en/about.html. Спільні ресурси завжди завантажуються з /assets/, тому однаково працюють на обох рівнях.

Коренева 404.html визначає мовний префікс адреси: невідома сторінка всередині /en/ також показує англійський інтерфейс без редиректу й зберігає справжню HTTP-відповідь 404.

Щоб додати ще одну мову:

  1. Додайте її код у localeOrder і конфігурацію з pathPrefix та перекладами спільного інтерфейсу в assets/js/site.js.
  2. Створіть каталог мови з відповідниками всіх активних *.html, зберігаючи ті самі імена файлів.
  3. Установіть відповідний lang на <html>, <site-header> і <site-footer>. Збережіть атрибути current, data-filter та цільові id, від яких залежать спільні компоненти.
  4. Оновіть canonical і взаємні hreflang-посилання на кожному мовному відповіднику сторінки.
  5. Додайте каталог до allowlist $siteInputs у scripts/build-site.ps1.

Текст і метадані самої сторінки перекладаються в її HTML. Header, footer, стрічка оновлення, лічильник фільтра й підписи перемикача мов беруть переклади зі спільної конфігурації JavaScript.

Локальний запуск

У корені репозиторію:

python -m http.server 8000

Після цього відкрийте http://localhost:8000.

Production-збірка

powershell -ExecutionPolicy Bypass -File .\scripts\build-site.ps1
python -m http.server 8000 --directory dist

Скрипт щоразу безпечно перевідтворює dist/ і копіює тільки файли, які потрібні сайту. Каталог dist/ не комітиться.

Де редагувати

  • Тексти сторінок — у відповідних *.html у корені та en/.
  • Кольори, сітки й адаптивність — у assets/css/site.css.
  • Спільна навігація, footer, соціальні посилання, мови та фільтри — у assets/js/site.js.
  • Перелік файлів production-збірки — у scripts/build-site.ps1.

Статуси ігор, манґи та ранніх проєктів позначені як архівний знімок 2021–2022 років. Їх не варто сприймати як актуальні, доки вони не будуть оновлені вручну.

GitHub Pages

Push у master запускає .github/workflows/static.yml: workflow будує dist/ і публікує лише його.

About

My personal website

Resources

Stars

2 stars

Watchers

1 watching

Forks

Releases

Used by

Contributors

Languages