diff --git a/AGENTS.md b/AGENTS.md new file mode 100644 index 0000000..95fdabe --- /dev/null +++ b/AGENTS.md @@ -0,0 +1,69 @@ +# AGENTS.md + +## Repo overview + +Docker Compose hosting for 4 websites (yalarba.ru, begushiybashkir.ru, easysite102.ru, valitovgaziz.ru). +All infrastructure lives under `main_dc/`. Root `package.json` is vestigial — do not use it. + +## Directory structure + +``` +main_dc/ + docker-compose.yml -- single compose file orchestrating everything + Makefile -- the primary dev/ops interface; use `make` not raw docker + .env -- shared env: domains, email, api_es port + BB/api_bb/ -- Go REST API (GORM+Chi), port 7777, DB: db_bb (5433) + BB/bbvue/ -- Vue 3 + Vite frontend for begushiybashkir.ru + yalarba/api_tp/ -- Go REST API (GORM+Chi), port 8888, DB: db (5432) + yalarba/api_es/ -- Go REST API (GORM+Chi), port 8088, DB: db (5432) + yalarba/api_yal/ -- Go REST API (GORM+Chi), port 8787, DB: db (5432) + yalarba/easySite/easySite/ -- Nuxt 4 SPA for easysite102.ru + yalarba/serv_spa/spa/vue/ -- Vue 3 + Vite SPA for yalarba.ru + valitovgaziz/analytics/ -- Node.js (Express) analytics server, port 9999 + valitovgaziz/html/ -- static HTML for valitovgaziz.ru + nginx/ -- nginx with automatic HTTP↔HTTPS switching + certbot/ -- Let's Encrypt cert management + stubSite/ -- placeholder site while building +``` + +## Developer commands (always run from `main_dc/`) + +| Command | What it does | +|---|---| +| `make all` | Full cycle: down → git pull → build --no-cache → up -d → watch | +| `make ` | Full cycle for one service, e.g. `make api_bb`, `make nginx`, `make es`, `make analytics` | +| `make bbvue` | Rebuild Vue frontend (calls `npm run build` in `BB/bbvue/`) | +| `make vue_bb` | git pull + npm cache clean + bbvue build + watch | +| `make wn` | `watch -n2 docker ps` — monitor containers | +| `make bb_db` | `psql -U postgres -d bb_db` inside db_bb container | + +All `build_*` targets use `--no-cache`. +All full-cycle targets follow: `stop_ → git → build_ → start_ → wn`. + +## Frontend dev (outside compose) + +```bash +cd main_dc/BB/bbvue && npm run dev # Vite dev server +cd main_dc/BB/bbvue && npm run lint # ESLint --fix +cd main_dc/BB/bbvue && npm run format # Prettier --write src/ + +cd main_dc/yalarba/serv_spa/spa/vue && npm run dev # Vite dev (yalarba SPA) + +cd main_dc/yalarba/easySite/easySite && npm run dev # Nuxt dev +cd main_dc/yalarba/easySite/easySite && npm run build # Nuxt build +``` + +## Service quirks + +- **Nginx SSL**: `switch-config.sh` is all-or-nothing — HTTPS only activates when *every* domain has a cert. Until then, SSL port redirects back to HTTP. +- **`yalarba/serv_spa/spa/`**: Dockerfile is incomplete (build stage only, no runtime). The `spa/vue/` package.json includes express/pg deps despite being a Vite SPA — likely unused or legacy. The nginx compose mounts `yalarba/serv_spa/spa/vue/dist`. +- **`api_yal`** is the only container that runs as non-root. Runs on port 8787. +- **`api_es`** port is configurable via `API_ES_APP_PORT` in `.env` (default 8088). All other API ports are hardcoded. +- **Databases**: `db` (port 5432) is shared between api_tp, api_es, api_yal. `db_bb` (port 5433) is dedicated to api_bb. +- **GORM auto-migration**: All Go APIs use GORM auto-migrate at startup — no manual migration tooling. +- **Keycloak** referenced in Makefile targets but absent from docker-compose.yml — likely not deployed. +- **`api_yal/testrunner`**: standalone Go test runner binary (not containerized), for running integration test suites. + +## Docs convention + +READMEs and documentation are primarily in Russian. See `documentation/` for Makefile, Docker, restart, and LLM info docs. diff --git a/main_dc/valitovgaziz/html/blog.html b/main_dc/valitovgaziz/html/blog.html index 47451ad..a1572c5 100644 --- a/main_dc/valitovgaziz/html/blog.html +++ b/main_dc/valitovgaziz/html/blog.html @@ -1,590 +1,187 @@ - - - - - Блог | ValitovGaziz - Мысли и обновления - - + + + + + + Блог | ValitovGaziz + - - - - - - - -
-
-

Блог

-

Мысли, проекты и обновления из мира разработки и предпринимательства

-
- 📝 Личный блог - 🔄 Регулярные обновления - 🎯 Фокус на содержании -
-
-
- -
- - - - -
- -
-
- Проекты -

Новый этап развития Yalarba.ru

-
- - • - 5 минут чтения -
-
- -
-

Сегодня хочу поделиться важным обновлением по проекту Yalarba.ru. Мы завершили переход на новую - архитектуру и готовимся к запуску нескольких ключевых функций, которые существенно улучшат - пользовательский опыт.

- -

Что изменилось:

-
    -
  • Полностью переработанный интерфейс поиска маршрутов
    • -
  • Интеграция с картографическими сервисами
    • -
  • Улучшенная система рекомендаций
    • -
  • Подготовка к мобильному приложению
    • -
- -

Этот этап занял больше времени, чем планировалось, но результат того стоит. Особенно горжусь тем, - как команда справилась с техническими вызовами.

- -
- "Технологии должны решать реальные проблемы людей, а не создавать новые" -
- -

В ближайших планах — запуск бета-тестирования новых функций и привлечение первых партнеров из - туристической отрасли.

-
- - -
- - -
-
- Разработка -

Переход с Vue 2 на Vue 3: опыт и выводы

-
- - • - 7 минут чтения -
-
- -
-

После нескольких месяцев работы с Vue 3 в продакшене хочу поделиться наблюдениями о переходе с - Vue 2.

- -

Основные преимущества:

-
    -
  1. Composition API — действительно улучшает переиспользование кода
    2. -
  2. Улучшенная производительность — заметный прирост в больших приложениях
    3. -
  3. TypeScript поддержка — наконец-то полноценная интеграция
    4. -
  4. Меньший размер бандла — tree-shaking работает лучше
    5. -
- -

Сложности перехода:

-

Не всё прошло гладко. Некоторые библиотеки ещё не обновились, пришлось искать альтернативы или - писать собственные решения. Также Composition API требует изменения мышления, особенно для - разработчиков, долго работавших с Options API.

- -

В целом, переход оправдан. Особенно для новых проектов — рекомендую сразу начинать с Vue 3.

-
- - -
- - -
-
- Мысли -

О важности сообщества в разработке

-
- - • - 4 минуты чтения -
-
- -
-

В последнее время всё чаще задумываюсь о том, насколько важно окружение для профессионального - роста. Особенно в IT, где технологии меняются так быстро.

- -

Когда работаешь один, легко застрять в своих паттернах, не замечать новые подходы или повторять - одни и те же ошибки. Сообщество — это не только нетворкинг, это:

- -
    -
  • Обратная связь — свежий взгляд на твои решения
    • -
  • Совместное обучение — каждый знает что-то, чего не знаешь ты
    • -
  • Поддержка — особенно важна в сложные периоды
    • -
  • Вдохновение — видеть успехи других мотивирует
    • -
- -

Именно поэтому я решил больше инвестировать в развитие сообщества вокруг своих проектов. Если вы - читаете это — возможно, нам стоит пообщаться :)

-
- - -
- - -
-
- Проекты -

EasySite & YalArba: Текущее состояние и роадмап развития

-
- - • - 6 минут чтения -
-
- -
-

С момента запуска первых версий EasySite102.ru и YalArba.ru - прошло - несколько месяцев интенсивной разработки. Хочу поделиться текущим состоянием проекта, - достигнутыми - результатами и планами на ближайшее будущее.

- -

🎯 Суть проекта сегодня

-

Мы строим полноценную экосистему для туристического рынка:

-
    -
  • EasySite (B2B) — конструктор сайтов для владельцев отелей, санаториев, - ресторанов и - достопримечательностей
    • -
  • YalArba (B2C) — агрегатор для туристов с поиском, отзывами, маршрутами и - системой - бронирования
    • -
- -

✅ Что уже работает (стабильно в продакшене)

-
    -
  • JWT-аутентификация — безопасный вход для всех типов пользователей
    • -
  • Полностью контейнеризованная инфраструктура — Docker, Docker Compose
    • -
  • SSL шифрование — HTTPS на всех доменах через Let's Encrypt
    • -
  • Базовая аналитика — отслеживание посещений и пользовательского поведения -
    • -
- -

🛠️ Технологический стек (актуальный)

-
-
- Frontend: Nuxt.js 3 (EasySite), Vue 3 + Composition API (YalArba) -
-
- Backend: Go (Golang) с использованием GORM, Chi -
-
- База данных: PostgreSQL (раздельные инстансы для разных сервисов) -
-
- Инфраструктура: Docker, Nginx, система автоматического обновления SSL -
-
- -

📊 API-архитектура

-

Проект построен по микросервисной архитектуре:

-
    -
  • EasySite API: localhost:8088/docs (управление сайтами)
    • -
  • YalArba API: localhost:8888/docs (поиск и бронирование)
    • -
  • Auth Service: централизованная аутентификация
    • -
- -
- "Статус проекта на 20.03.2026: 🟢 Активная разработка. Основная функциональность работает, идёт - наполнение - контентом и привлечение первых пользователей." -
- -

📅 Роадмап развития (2026 год)

-

Приоритеты на ближайшие месяцы:

- -

Q3 2026 (Июль–Сентябрь)

-
    -
  • Платежная система — интеграция с ЮKassa, Tinkoff
    • -
  • Мультиязычность — поддержка английского и башкирского языков
    • -
  • API для партнеров — возможность интеграции сторонних сервисов
    • -
  • Система кэширования — Redis для повышения производительности
    • -
- -

Q4 2026 (Октябрь–Декабрь)

-
    -
  • Мобильные приложения — iOS и Android (React Native)
    • -
  • Система рекомендаций — AI-based подборки на основе поведения
    • -
  • Масштабирование инфраструктуры — переход на Kubernetes
    • -
  • Реферальная программа — для владельцев и туристов
    • -
- -

👥 Командная ситуация

-

Сейчас проект развивается силами небольшой команды (2 человека). Мы активно ищем:

-
    -
  • Frontend-разработчиков (Vue 3, Nuxt.js)
    • -
  • Дизайнеров UI/UX
    • -
  • Маркетологов для продвижения в туристической нише
    • -
  • Контент-менеджеров для наполнения платформы
    • -
- -

🎯 Когда ждать полноценного запуска?

-

Бета-версия с основной функциональностью уже доступна по адресам:

- - -

Полноценный запуск с платежами и мобильным приложением планируется на - сентябрь - 2026. -

- -

Масштабирование на весь Урал и Поволжье — цель на 2026 год.

- -

💬 Как можно поучаствовать?

-

Проект открыт для сотрудничества в разных форматах:

-
    -
  • Технические специалисты — присоединяйтесь к разработке (удаленно)
    • -
  • Владельцы туристических объектов — создайте свой сайт на EasySite
    • -
  • Инвесторы и партнеры — обсуждаем стратегическое сотрудничество
    • -
  • Тестировщики — помогайте улучшать пользовательский опыт
    • -
- -

Если вас заинтересовал проект — давайте обсудим возможности сотрудничества!

-
- - -
- - -
-
- Мысли -

Зачем я создаю YalArba: история и миссия

-
- - • - 8 минут чтения -
-
- -
-

Эта история началась в 2017 году, когда я работал на заводе УМПО и параллельно учился в УКСиВТ. - Зимой - захотелось отдохнуть — съездить куда-нибудь на машине или просто развеяться в парке. Я, конечно, - полез в - интернет искать сайты и информацию. И ни на одном сайте не смог найти маршрут или место, куда - можно сходить - бесплатно.

- -

Везде мне продавали туры, гостиницы, ещё много вариантов, которые для меня, простого рабочего, - совершенно не - имели никакой ценности. Пришлось искать через знакомых, через группы, куда можно поехать на - отдых с - корзинкой, бутербродами, на своей машине.

- -
- «После этого случая мне сильно захотелось создать приложение, которое приводило бы людей к - простому и - быстрому решению по отдыху. Особенно это ценно для рабочих, у которых нет особой насмотренности, - много - возможностей и ресурсов для отдыха вдали от дома или за границей.» -
- -

Социальность проекта

-

Большая часть услуг будет бесплатной для всех, включая предпринимателей. Потому что я сам работал - на заводе и - был всегда (большую часть времени) за станком. Но остальная жизнь тогда больше походила на - несистематизированные пьянки и гулянки. В то время это было интересно, сейчас это совершенно не - вписывается - в моё мировоззрение.

- -

Мне кажется, в те годы мне не хватало широты взгляда, в общем, некому было подсказать, что - отдыхать можно - по-другому. Что есть много исторических мест, памятников природы. Я просто не видел альтернативы - своему - образу отдыха.

- -

Миссия сегодня

-

Сейчас я надеюсь, что смогу предоставить эту альтернативу. Зумеры, конечно, уже меньше подвержены - старым - способам отдыха (алкоголь употребляют меньше). Но я хочу добавить приложение (веб-портал), - которое сможет - подсказать, подкинуть идею, что отдых может быть более культурным, не таким дорогим. И главное — - недалеко от - дома. В рамках района, области или страны.

- -

И я уверен, что это будет работать и в других странах. Ведь везде есть просто очень занятые люди, - всё - внимание которых направлено на работу и дом. В этом я вижу мейнстрим, большую цель для своего - приложения. -

- -

Международный потенциал

-

Через это же приложение можно будет привлекать самостоятельных туристов в нашу страну — через - рекламу, - распространение в другие страны. Открывать наши места отдыха не только для внутреннего туриста, - но и для - иностранного (выборочно, конечно).

- -

Бизнес-модель

-

Основная прибыль в этом проекте спрятана в количестве пользователей, которые будут пользоваться - порталом - (приложением). Конечно, приложение должно буквально делать за пользователя часть работы по - поиску, подбору, - исследованию и выбору маршрутов отдыха — чтобы получить наилучший результат.

- -

Личный путь

-

Поставленная высокая цель помогает мне добиваться высоких результатов в жизни. Для реализации - проекта я - выучил несколько языков программирования, английский язык, добился от себя внятных установок на - жизнь, - развил в себе планирование и смог познакомиться с невероятным количеством людей. Каждый новый - рубль, - потраченный на этом пути, будет воздан.

- -

Инвестиции или самостоятельная разработка?

-

Часто ловлю себя на мысли: а нужны ли мне инвестиции? И да, я часто и с большой уверенностью - говорю: да! - Нужны. На сервер, на человеко-часы, на заказные части программы. С другой стороны, передо мной - часто - возникает дилемма — хочется сделать всё самому.

- -

Это, конечно, ошибка, которая уже стоила мне пары лет в разработке и ещё аукнется большим - количеством - времени, потраченным на разработку приложения самостоятельно. Я всё ещё на что-то надеюсь, что - как-то смогу - завершить приложение (я смогу). Просто это будет не так пафосно и круто, как хотелось бы. И - дальше, конечно, - встанет вопрос о том, как же его продавать (продвигать). Здесь уже заложены некоторые - маркетинговые фишки и - ходы для создания нового рынка и выхода на существующие.

- -

В данный момент больше стараюсь уделять время семье и дому. Но часть моих усилий всегда - направлена на работу - над проектом. Конкретно сейчас работаю над блогом для проекта, хотя, казалось бы, должен - вгрызаться в - реализацию серверного приложения на Golang (gorm, chi).

- -

Но я верю, что этот блог — тоже часть пути. Часть истории, которую я хочу рассказать. Чтобы - другие, кто, - возможно, оказался в похожей ситуации, знали: альтернатива есть. И мы её создаём.

-
- - -
- -
- - - - - -
- - -
- ← Назад - Страница 1 из 4 - Вперед → + - -
-
-

© 2024 Блог Валитова Газиза. Все записи — личные размышления и опыт.

-

- На главную • - Telegram • - Email -

-
-
+
+
+ ← На главную +

Блог

+

Мысли, проекты и обновления

+
+
- + - - \ No newline at end of file + diff --git a/main_dc/valitovgaziz/html/index.html b/main_dc/valitovgaziz/html/index.html index 16a186f..d5a8585 100644 --- a/main_dc/valitovgaziz/html/index.html +++ b/main_dc/valitovgaziz/html/index.html @@ -1,681 +1,201 @@ - - - - - - - - - - - - ValitovGaziz - Предприниматель - Fullstack-разработчик + + + + + + ValitovGaziz — Предприниматель · Fullstack-разработчик - -
-
-
-

ВАЛИТОВ ГАЗИЗ

-

- Технологический предриниматель & Fullstack-разработчик -

-

- Создаю цифровое решение для отдыха. Развиваю проект - Yalarba.ru — платформу, которая меняет подход к - путешествиям по Башкортостану. -

-
- - - - 📝 Читать блог - -
-
-
- - - -
+
+ -
-
- Valitov Gaziz +
+
+

Валитов Газиз

+

Технологический предприниматель & Fullstack-разработчик

+

+ Создаю цифровые решения для отдыха. Развиваю проект + Yalarba.ru — платформу, которая меняет подход к путешествиям по Башкортостану. +

+
+ Написать в Telegram + Читать блог
+ +
+
+ Валитов Газиз +
+
+ +
+
+

Обо мне

+
+
+ Валитов Газиз
-

Технический предприниматель и Fullstack-разработчик

-
    -
  • г. Кумерау, 1985 год родиля
    • -
  • 1992 - 2002 г. Кумертау, БРГИ 3
    • -
  • 2002 - 2005 г.Уфа, УГАТУ, специальность "Сварочное производство"
    • -
  • 2005 - 2009 Росстовская область, СКВО, служба в армии по контракту
    • -
  • 2009 - 2012 г. Кумертау, станочник "Токарь-расточник" КумАПП
    • -
  • 2012 -2015 село Старосубхангулово, ремонт электроники. ООО "БААС - сервис" владелец
    • -
  • 2015 - 2020 г. Уфа, учеба в УКСиВТ "Техник по Информационным Системам"
    • -
  • с 2021 самообучние и работа над проектом Ял Арба, владелец
    • -
-
- resume -

- Мой подход: - "Технологии как инструмент для решения реальных проблем". Именно этот принцип лежит в основе - моего флагманского проекта - - Yalarba.ru - - easysite102.ru - — - платформы, которая упрощает планирование путешествий и открывает новые - возможности для туризма. + Родился в г. Кумертау в 1985 году. После школы окончил УГАТУ, отслужил в армии, работал на производстве. + С 2015 года погрузился в IT — прошёл путь от техника до основателя собственного технологического проекта.

- -
-
-

🎯 Техническое видение

-

- Создаю архитектуру, которая масштабируется и адаптируется под - растущие потребности бизнеса -

-
-
-

💡 Бизнес-ориентация

-

- Фокусируюсь на создании ценности для пользователей и устойчивых - бизнес-моделях -

-
-
-

🚀 Практический подход

-

- От прототипа к продукту: быстрое тестирование гипотез и - итерационная разработка -

-
-
-

❤️‍🔥 Меня мотивирует

-

- Процесс создания проекта с большой пользой многим людям - это то, - что по-настоящему подпитывает меня, давая энергию для ежедневного - стремления к лучшему будущему. -

-
-
-
-
- - -
-

- 👨‍💻 О репозитории - - ValitovGaziz-GitHub.com - -

-

- Добро пожаловать! Этот репозиторий — моё цифровое портфолио и - пространство для экспериментов. -

- -
-
-

- 🌐 - ValitovGaziz.ru -

-

- Сайт-визитка, который вы сейчас просматриваете. Здесь собрана - информация о моих навыках, проектах и способах связи. -

-
-
-

- 🏞️ - Yalarba.ru -

-

- Платформа для туризма по Башкортостану. Помогает путешественникам - открывать новые места и планировать маршруты. -

-
-
-

- 🏃‍♂️ - BegushiyBashkir.ru -

-

- Сайт бегового клуба "Бегущий Башкир", основанного моим другом - Аминевым Загиром. -

-
-
- -
-

- Что сейчас в работе? - easysite102.ru -

-
    -
  • - Разрабатываю: easysite102.ru - как часть экосистемы - YalArba.ru. -
    • -
  • - Открыт к сотрудничеству: Участвую в разработке - open-source проектов. -
    • -
  • Нужна помощь: В развитии моих проектов.
    • -
-

- Задавайте вопросы по моим проектам или всему, в чём - могу быть полезен. + Полное резюме →

-
-
- - -
-
-

🚀 Ищем тимейтов для роста и прорыва

-

- Создаем digital-будущее вместе через разработку цифровых решений -

-
- -
-
-

💫 Наша миссия

-

- Мы строим сообщество профессионалов, которые через технологии - создают реальную пользу для людей. Это не коммерческая работа — это - возможность расти, решая сложные задачи и открывая новые горизонты. -

-
- -
-

👥 Кого мы ищем:

-
-
-

💻 Программисты

-

- Fullstack, Backend, Frontend, Mobile — все, кто готов строить - масштабируемые решения -

-
-
-

🎨 Дизайнеры

-

UI/UX, продуктовые дизайнеры, креативные мыслители

-
-
-

📊 Аналитики

-

- Ищем аналитика (системного и бизнес‑аналитика) для анализа - процессов, сбора требований и перевода бизнес‑потребностей в - технические решения. -

-
-
-

🚀 Продавцы-стратеги

-

Кто понимает, как digital-продукты меняют рынки

-
+
+
+

Техническое видение

+

Создаю архитектуру, которая масштабируется и адаптируется под растущие потребности бизнеса.

+
+
+

Бизнес-ориентация

+

Фокусируюсь на создании ценности для пользователей и устойчивых бизнес-моделях.

+
+
+

Практический подход

+

От прототипа к продукту: быстрое тестирование гипотез и итерационная разработка.

+
+
+

Мотивация

+

Процесс создания проекта с большой пользой для многих людей — то, что даёт энергию для ежедневного роста.

-
- -
-

🎯 Что получаете взамен:

-
    -
  • - ✅ Реальный опыт — задачи уровня коммерческих - проектов -
    • -
  • - ✅ Профессиональный рост — следующий уровень - навыков гарантирован -
    • -
  • - ✅ Нетворкинг — сообщество сильных специалистов -
    • -
  • - ✅ Портфолио — проекты, которые впечатляют - работодателей -
    • -
  • - ✅ Горизонтальное развитие — возможность - пробовать себя в смежных ролях -
    • -
-
- -
-

⚡ Уровень сложности:

-

- Спектр задач достаточно высок — решая их, вы гарантированно - подниметесь на следующую ступень развития. Мы работаем с - технологиями, которые определяют будущее: микросервисы, AI/ML, - масштабируемые архитектуры, современный UX и бизнес-модели. -

-
- -
-

Готовы расти вместе?

-

- Если вы ищете не просто проект, а сообщество для профессионального - прорыва — давайте знакомиться! -

-
+
- -
-
-

- 🚀 Yalarba.ru — - Travel Tech проект -

-

- Платформа для планирования путешествий нового поколения -

+
+
+

Проекты

+

Над чем я работаю сейчас

+
+
+
+

🏞️ Yalarba.ru

+

Платформа для туризма по Башкортостану. Помогает путешественникам открывать новые места и планировать маршруты.

- -
-
-
-

❤️

-

проект, рожденный от любви к краю

-
-
-

🤝

-

открыт для помощи и сотрудничества

-
-
-

🚀

-

готов к росту с правильной командой

-
-
- -
-

Технологический стек проекта:

-
    -
  • ✅ Микросервисная архитектура на Golang (Gorm, Chi)
    • -
  • ✅ Современный фронтенд на Nuxt.js 4, Vue3.js
    • -
  • ✅ Оптимизированная база данных PostgreSQL
    • -
  • - ✅ Контейнеризация и легкое масштабирование через Docker, Docker - Swarm -
    • -
  • ✅ Полный цикл разработки от идеи до продукта
    • -
-
- -
-

Инвестиционные возможности

-

- Проект открыт для стратегических партнерств и инвестиций. Если вас - заинтересовала платформа, давайте обсудим перспективы - сотрудничества. -

- -
+
+

🌐 EasySite102.ru

+

Конструктор сайтов для туристических объектов. Часть экосистемы YalArba для владельцев отелей, санаториев и ресторанов.

+
+
+

🏃‍♂️ BegushiyBashkir.ru

+

Сайт бегового клуба «Бегущий Башкир», основанного другом Аминевым Загиром.

+
-
+
+

Опыт работы

-
-
-

Основатель и Tech Lead - Yalarba.ru

-

2020 — настоящее время (5+ лет)

-

- Разработка и продвижение инновационной платформы для планирования - путешествий с полным циклом разработки: -

-
    -
  • Создание архитектуры микросервисов на Nuxt.js 4 и Golang
    • -
  • Разработка современного фронтенда на Nuxt.js 4 & Vue3.js
    • -
  • Проектирование и оптимизация баз данных PostgreSQL
    • -
  • Внедрение Docker и контейнеризации для масштабирования
    • -
  • Управление проектом, планирование развития продукта
    • -
-
- -
-

Fullstack-разработчик (Проектная работа)

-

2017 — настоящее время (7+ лет)

-

Участие в различных IT-проектах:

-
    -
  • Разработка лендинг-страниц и сайтов-визиток
    • -
  • Создание маркетплейсов и туристических агрегаторов
    • -
  • - Проектирование REST API на Golang (gorm, chi), PostgresQL, https -
    • -
  • Разработка фронтенда на Nuxt.js 4 (vue3.js)
    • -
-
+
+
+
+

Основатель и Tech Lead — Yalarba.ru

+

2020 — настоящее время

+
    +
  • Разработка архитектуры микросервисов на Go + Nuxt.js 4
    • +
  • Проектирование и оптимизация PostgreSQL
    • +
  • Внедрение Docker-контейнеризации
    • +
  • Управление продуктом и планирование развития
    • +
+
+
+

Fullstack-разработчик (Проектная работа)

+

2017 — настоящее время

+
    +
  • Разработка REST API на Go (GORM, Chi), PostgreSQL
    • +
  • Создание фронтенда на Nuxt.js 4, Vue 3
    • +
  • Разработка лендингов и сайтов-визиток
    • +
+
- -
-

Навыки

-
-
-
-

Golang

- Продвинутый -
-

- Высокопроизводительные backend сервисы -

-
- Опыт: 2+ лет коммерческой разработки, REST API, - best practices -
-
- Concurrency patterns, advanced Go features -
-
- -
-
-

JavaScript

- Продвинутый -
-

- Fullstack разработка, современный ES6+ -

-
- Опыт: 3+ лет коммерческой разработки, Vue.js, - Node.js -
-
- TypeScript, advanced patterns, performance optimization -
-
- -
-
-

Vue3

- Средний -
-

- Современный фронтенд с Composition API -

-
- Опыт: Разработка SPA приложений, Vue Router, Pinia -
-
Vue 3 advanced patterns, testing, SSR
-
- -
-
-

Nuxt

- Средний -
-

SSR/SSG приложения на Vue.js

-
- Опыт: Nuxt 3, server-side rendering, static site - generation -
-
Nuxt 4, advanced caching strategies
-
- -
-
-

PostgreSQL

- Средний -
-

- Реляционные базы данных, оптимизация запросов -

-
- Опыт: Проектирование схем, индексы, сложные запросы -
-
- Advanced SQL, partitioning, replication -
-
- -
-
-

Docker

- Средний -
-

Контейнеризация приложений

-
- Опыт: Docker Compose, multi-stage builds, - оптимизация образов -
-
- Kubernetes, Docker Swarm, orchestration -
-
- -
-
-

Java

- Начинающий -
-

- Backend разработка микросервисов и enterprise приложений -

-
- Опыт: Коммерческая разработка 2+ лет, Spring - Framework, Hibernate -
-
- Углубление в Spring Boot 3, reactive programming -
-
- -
-
-

Spring Framework

- Начинающий -
-

- Создание масштабируемых enterprise приложений -

-
- Опыт: Spring Boot, Spring Security, Spring Data, - Spring MVC -
-
- Изучение Spring Cloud, микросервисная архитектура -
-
-
-
- -
+
+

Образование

-
-
-

УКСИВТ

-

Уфимский колледж статистики и информатики

-

Техник по информационным системам

-

2016 - 2020

-
-
-

- Автономная некоммерческая организация высшего образования - «Университет Иннополис» -

-

Java enterprise, Java enterprise developer

-

2021 - 2021

-
-
-

МТИ - Московский технологический институт.

-

Разработка программного обеспечения

-

2025 - >

-
+
+
+
+

МТИ — Московский технологический институт

+

Разработка программного обеспечения · 2025 — н.в.

+
+
+

Университет Иннополис

+

Java Enterprise developer · 2021

+
+
+

УКСиВТ — Уфимский колледж статистики и информатики

+

Техник по информационным системам · 2016–2020

+
+
+

УГАТУ

+

Сварочное производство · 2002–2005

+
-
-

Курсы и сертификаты

-
    -
  • 2024: Управление проектами (Skillbox, Эффективный руководитель)
    • -
  • 2022: Java Full Stack Developer (JetBrains Academy)
    • -
  • 2021: Java Enterprise developer (Университет Иннополис)
    • -
  • - 2020: Управление по Agile: Scrum, Kanban, Lean (Нетология-групп) -
    • -
  • 2019: English intermediate (Frog-school)
    • -
+
+
+

Навыки

- -
-

Языки

-
    -
  • Башкирский — Родной
    • -
  • Русский — C1 (Продвинутый)
    • -
  • Английский — B2 (Средне-продвинутый)
    • -
+
+ Golang Advanced + JavaScript Advanced + Vue 3 Intermediate + Nuxt.js Intermediate + PostgreSQL Intermediate + Docker Intermediate + Java Beginner + Spring Framework Beginner + Go (Chi, GORM) + REST API + Nginx + Linux + Git
+
-
+
+

Контакты

-

- Всегда рад новым знакомствам и интересным предложениям о сотрудничестве. -

-
-

- 📱 Телеграм: - @valitovgaziz -

-

- 📧 Email: - valitovgaziz@yandex.ru -

-

- 📞 Телефон: - +7(962)543-93-43 -

-
- +

Всегда рад новым знакомствам и интересным предложениям

+
+ Telegram: @valitovgaziz + valitovgaziz@yandex.ru + +7 (962) 543-93-43 +
+
- + - - \ No newline at end of file + diff --git a/main_dc/valitovgaziz/html/scripts.js b/main_dc/valitovgaziz/html/scripts.js index 3bc1e22..b72b292 100644 --- a/main_dc/valitovgaziz/html/scripts.js +++ b/main_dc/valitovgaziz/html/scripts.js @@ -1,132 +1,26 @@ -function saveContact() { - // Создаем содержимое vCard (VCF) - const vCardData = `BEGIN:VCARD -VERSION:3.0 -FN:Валитов Газиз Камилевич -N:Валитов;Газиз;Камилевич -ORG:FREELANCE -TITLE:FULLSTACK_DEVELOPER -TEL;TYPE=MOBILE:+79279238823 -TEL;TYPE=MOBILE:+79044513441 -TEL;TYPE=MOBILE:+79625439243 -EMAIL;TYPE=HOME:valitovgaziz@gmail.com -EMAIL;TYPE=WORK:valitovgaziz@yandex.ru -URL:https://valitovgaziz.ru -URL:https://t.me/valitovgaziz -URL:https://vk.ru/id378105199 -BDAY:1985-10-27 -END:VCARD`; +document.addEventListener('DOMContentLoaded', () => { + const themeToggle = document.getElementById('themeToggle'); + const saved = localStorage.getItem('theme'); - // Создаем Blob (бинарный объект) с данными vCard - const blob = new Blob([vCardData], { type: 'text/vcard' }); - - // Создаем URL для скачивания - const url = URL.createObjectURL(blob); - - // Создаем временную ссылку для скачивания - const link = document.createElement('a'); - link.href = url; - link.download = 'valitovgaziz.vcf'; // Имя файла - link.click(); - - // Освобождаем память - URL.revokeObjectURL(url); -} - -function loadTermSheet() { - // Create a temporary anchor element - const link = document.createElement('a'); - - // Set correct relative path to the PDF file - link.href = './assets/docs/TermSheet.pdf'; - - // Set download attribute with filename - link.download = 'TermSheet.pdf'; - - // Append to body to make it work in some browsers - document.body.appendChild(link); - - // Trigger the download - link.click(); - - // Clean up - document.body.removeChild(link); -} - - -// Обработчик для кнопки "Запросить презентацию" -function sendMessageTelegram() { - // Проверяем, поддерживает ли браузер диалоги - if (typeof window.orientation !== 'undefined' && !window.confirm) { - // Для мобильных браузеров без поддержки prompt - открываем Telegram напрямую - window.open('https://t.me/valitovgaziz', '_blank'); - return; + if (saved === 'dark') { + document.body.classList.add('dark'); + themeToggle.textContent = '☀️'; } - const message = prompt("Опишите, пожалуйста, ваше предложение или вопрос. Я свяжусь с вами в ближайшее время:"); - if (message) { - const BOT_TOKEN = "8470085635:AAEPZcsN3n-3FkMdr7DzxbiQ3q8mXZTGwug"; - const CHAT_ID = "559861569"; - - // Используем FormData вместо JSON (более надежно) - const formData = new FormData(); - formData.append('chat_id', CHAT_ID); - formData.append('text', `📥 Новое сообщение с сайта ValitovGaziz:\n\n${message}`); - formData.append('parse_mode', 'HTML'); - - // Альтернативный URL - fetch(`https://api.telegram.org/bot${BOT_TOKEN}/sendMessage`, { - method: 'POST', - body: formData - }) - .then(response => response.json()) - .then(data => { - if (data.ok) { - alert("Сообщение успешно отправлено! Я свяжусь с вами в ближайшее время."); - } else { - console.error('Telegram API Error:', data); - alert("Ошибка: " + (data.description || 'Неизвестная ошибка')); - } - }) - .catch(error => { - console.error("Ошибка:", error); - alert("Произошла ошибка сети. Попробуйте позже или свяжитесь со мной напрямую."); - }); - } -} - -// Универсальный обработчик для кнопок -function setupButtonHandlers() { - const buttons = document.querySelectorAll('button[onclick*="sendMessageTelegram"]'); - - buttons.forEach(button => { - // Удаляем старые обработчики - button.removeAttribute('onclick'); - - // Добавляем универсальные обработчики - button.addEventListener('click', handleTelegramButtonClick); - button.addEventListener('touchstart', handleTelegramButtonClick, { passive: true }); + themeToggle.addEventListener('click', () => { + document.body.classList.toggle('dark'); + const isDark = document.body.classList.contains('dark'); + themeToggle.textContent = isDark ? '☀️' : '🌙'; + localStorage.setItem('theme', isDark ? 'dark' : 'light'); }); -} -// Обработчик кликов для Telegram кнопок -function handleTelegramButtonClick(event) { - event.preventDefault(); - event.stopPropagation(); + const observer = new IntersectionObserver((entries) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('visible'); + } + }); + }, { threshold: 0.1 }); - // Для touch-событий, предотвращаем повторное срабатывание - if (event.type === 'touchstart') { - const now = Date.now(); - if (this.lastTouch && (now - this.lastTouch) < 500) { - return; - } - this.lastTouch = now; - } - - sendMessageTelegram(); -} - -// Инициализация при загрузке страницы -document.addEventListener('DOMContentLoaded', function () { - setupButtonHandlers(); -}); \ No newline at end of file + document.querySelectorAll('.fade-in').forEach(el => observer.observe(el)); +}); diff --git a/main_dc/valitovgaziz/html/style.css b/main_dc/valitovgaziz/html/style.css index c47d6fe..d902e93 100644 --- a/main_dc/valitovgaziz/html/style.css +++ b/main_dc/valitovgaziz/html/style.css @@ -1,464 +1,378 @@ -@import url("./style/digital_background.css"); -@import url("./style/saveContactsButtonStyle.css"); -@import url("./style/darkTheme.css"); -@import url("./style/about.css"); -@import url("./style/social_link.css"); -@import url("./style/hero_section.css"); -@import url("./style/yalarba_investmen.css"); -@import url("./style/footer.css"); -@import url("./style/repository_section.css"); -@import url("./style/links_style.css"); -@import url("./style/skill_section.css"); - -/* style.css - обновленный */ :root { - --primary: #a9e299; - --secondary: #63c1ff; - --light: #ecf0f1; - --dark: #36304d; - --success: #2ecc71; - --border-radius: 12px; - --shadow: 0 4px 6px rgba(0, 0, 0, 0.1); - --transition: all 0.3s ease; + --bg: #ffffff; + --surface: #f8fafc; + --text: #0f172a; + --text-secondary: #64748b; + --accent: #2563eb; + --accent-hover: #1d4ed8; + --accent-light: #eff6ff; + --border: #e2e8f0; + --shadow: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04); + --shadow-lg: 0 10px 25px rgba(0,0,0,0.06), 0 4px 10px rgba(0,0,0,0.04); + --radius: 12px; + --radius-sm: 8px; } -* { - transition: background-color 0.3s ease, color 0.3s ease, - border-color 0.3s ease; +body.dark { + --bg: #0f172a; + --surface: #1e293b; + --text: #f1f5f9; + --text-secondary: #94a3b8; + --accent: #60a5fa; + --accent-hover: #93bbfd; + --accent-light: #1e3a5f; + --border: #334155; + --shadow: 0 1px 3px rgba(0,0,0,0.3); + --shadow-lg: 0 10px 25px rgba(0,0,0,0.3); } -html { - margin: 0; - padding: 0; - width: 100%; - scroll-behavior: smooth; -} +* { margin: 0; padding: 0; box-sizing: border-box; } -a { - text-decoration: none; -} +html { scroll-behavior: smooth; } body { - font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; + background: var(--bg); + color: var(--text); line-height: 1.6; - color: #333; - min-width: 300px; - max-width: 1200px; - margin: 10px auto 5px auto; - padding: 10px 20px; - display: grid; - grid-template-rows: auto 1fr auto; - min-height: 100vh; + transition: background 0.3s, color 0.3s; } -/* Улучшенная сетка для header */ -header { - background-color: var(--primary); - color: var(--dark); - padding: 2rem 1rem; - text-align: center; - margin-bottom: 2rem; - border-radius: var(--border-radius); - display: grid; - grid-template-columns: 1fr auto; - grid-template-rows: auto auto; - gap: 1rem; - align-items: center; - position: relative; +a { color: var(--accent); text-decoration: none; transition: color 0.2s; } +a:hover { color: var(--accent-hover); } + +/* Navigation */ +nav { + position: sticky; + top: 0; + z-index: 100; + background: var(--bg); + border-bottom: 1px solid var(--border); + backdrop-filter: blur(12px); + background: rgba(255,255,255,0.85); + transition: background 0.3s, border-color 0.3s; } +body.dark nav { background: rgba(15,23,42,0.85); } + +.nav-inner { + max-width: 1100px; + margin: 0 auto; + padding: 0 24px; + display: flex; + align-items: center; + justify-content: space-between; + height: 60px; +} + +.nav-logo { font-weight: 700; font-size: 1.1rem; color: var(--text) !important; } + +.nav-links { display: flex; align-items: center; gap: 8px; } +.nav-links a { + padding: 6px 14px; + border-radius: var(--radius-sm); + color: var(--text-secondary) !important; + font-size: 0.9rem; + transition: background 0.2s, color 0.2s; +} +.nav-links a:hover { background: var(--accent-light); color: var(--accent) !important; } .theme-toggle { - grid-column: 2; - grid-row: 1; - justify-self: end; - padding: 8px 12px; - background: var(--secondary); - color: white; - border: none; - border-radius: 6px; + background: none; + border: 1px solid var(--border); + border-radius: var(--radius-sm); + padding: 6px 10px; cursor: pointer; - font-size: 14px; - transition: var(--transition); - z-index: 1000; + font-size: 1rem; + color: var(--text-secondary); + transition: background 0.2s, border-color 0.2s; + line-height: 1; } +.theme-toggle:hover { background: var(--surface); border-color: var(--accent); } -.social_links_block { - grid-column: 1 / -1; - display: grid; - grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); - gap: 1rem; - justify-items: center; - margin-top: 1rem; -} - -/* Улучшенная сетка для секций */ -.section { - background: rgb(226, 240, 241); - padding: 2rem; - margin-bottom: 2rem; - border-radius: var(--border-radius); - box-shadow: var(--shadow); - display: grid; - grid-template-columns: 1fr; - gap: 1.5rem; -} - -.entrepreneur-highlights { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 1.5rem; -} - -.highlight-item { - background: rgba(255, 255, 255, 0.7); - padding: 1.5rem; - border-radius: var(--border-radius); - box-shadow: var(--shadow); - transition: var(--transition); -} - -/* Сетка для команды */ -.team-section { - display: grid; - grid-template-columns: 1fr; - gap: 2rem; -} - -.team-header { - text-align: center; -} - -.roles-grid { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); - gap: 1.5rem; -} - -.role-card { - background: rgba(255, 255, 255, 0.7); - padding: 1.5rem; - border-radius: var(--border-radius); - box-shadow: var(--shadow); - transition: var(--transition); - display: grid; - grid-template-rows: auto 1fr; - gap: 1rem; -} - -.role-card:hover { - transform: translateY(-5px); - box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1); -} - -/* Сетка для Yalarba секции */ -.yalarba-section { - display: grid; - grid-template-columns: 1fr; - gap: 2rem; -} - -.yalarba-stats { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); - gap: 1rem; - justify-items: center; -} - -.yalarba-value ul { - display: grid; - grid-template-columns: 1fr; - gap: 0.5rem; -} - -/* Сетка для контактов */ -.contact-info { - display: grid; - grid-template-columns: 1fr; - gap: 1rem; -} - -/* Сетка для футера */ -footer { - display: grid; - grid-template-columns: 1fr; - gap: 2rem; - text-align: center; - padding: 1em 0 0 0; - color: var(--dark); - font-size: 0.9rem; - border-radius: 1rem; -} - -.footer-links { - display: grid; - grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); - gap: 2rem; - padding: 1em; -} - -.footer-section { - display: grid; - grid-template-columns: 1fr; - gap: 0.5rem; -} - -.two-column-grid { +/* Hero */ +.hero { + max-width: 1100px; + margin: 0 auto; + padding: 80px 24px 60px; display: grid; grid-template-columns: 1fr 1fr; - gap: 1rem; - border-left: 1px solid black; - grid-template-rows: auto; /* Явно указываем одну строку */ - grid-auto-flow: row; /* Запрещаем автоматическое создание новых строк */ + gap: 48px; + align-items: center; + min-height: 70vh; } -/* Кнопки */ +.hero-content { max-width: 540px; } + +.hero h1 { font-size: 3rem; font-weight: 800; letter-spacing: -0.03em; line-height: 1.15; margin-bottom: 12px; } + +.hero-subtitle { + font-size: 1.2rem; + color: var(--text-secondary); + margin-bottom: 20px; + font-weight: 400; +} + +.hero-description { font-size: 1rem; color: var(--text-secondary); margin-bottom: 32px; max-width: 480px; } + +.hero-buttons { display: flex; gap: 12px; flex-wrap: wrap; } + .btn { display: inline-flex; align-items: center; - justify-content: center; - padding: 0.8rem 1.5rem; - border-radius: 5px; - text-decoration: none; - font-weight: bold; - transition: var(--transition); + padding: 10px 24px; + border-radius: var(--radius-sm); + font-size: 0.9rem; + font-weight: 600; border: none; cursor: pointer; - text-align: center; + transition: all 0.2s; + text-decoration: none !important; } .btn-primary { - background-color: var(--secondary); - color: white; + background: var(--accent); + color: #fff !important; +} +.btn-primary:hover { background: var(--accent-hover); transform: translateY(-1px); box-shadow: var(--shadow); } + +.btn-outline { + background: transparent; + color: var(--text) !important; + border: 1px solid var(--border); +} +.btn-outline:hover { border-color: var(--accent); color: var(--accent) !important; } + +.hero-photo { + display: flex; + justify-content: center; + align-items: center; } -.btn-primary:hover { - background-color: #2980b9; - transform: translateY(-2px); - box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); +.hero-photo img { + width: 320px; + height: 320px; + object-fit: cover; + border-radius: 50%; + box-shadow: var(--shadow-lg); + border: 4px solid var(--bg); } -.btn-secondary { - color: white; +.social-links { display: flex; gap: 16px; margin-top: 24px; } +.social-links a { + display: flex; + align-items: center; + gap: 6px; + font-size: 0.9rem; + color: var(--text-secondary) !important; + padding: 8px 16px; + border-radius: var(--radius-sm); + border: 1px solid var(--border); + transition: all 0.2s; +} +.social-links a:hover { border-color: var(--accent); color: var(--accent) !important; background: var(--accent-light); } + +/* Sections */ +.section { + max-width: 1100px; + margin: 0 auto; + padding: 80px 24px; } -.btn-secondary:hover { - background-color: white; - color: var(--primary); -} +.section-header { margin-bottom: 48px; } +.section-header h2 { font-size: 2rem; font-weight: 700; letter-spacing: -0.02em; margin-bottom: 8px; } +.section-header p { color: var(--text-secondary); font-size: 1rem; } -/* Timeline улучшения */ -.timeline { +/* About */ +.about-grid { display: grid; - grid-template-columns: 1fr; - gap: 2rem; - position: relative; - padding-left: 30px; + grid-template-columns: 200px 1fr; + gap: 48px; + align-items: start; } -.timeline:before { - content: ""; +.about-photo { + width: 200px; + height: 200px; + object-fit: cover; + border-radius: var(--radius); + box-shadow: var(--shadow-lg); +} + +.about-text { color: var(--text-secondary); } +.about-text p + p { margin-top: 16px; } + +.about-highlights { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 16px; + margin-top: 24px; +} + +.highlight { + background: var(--surface); + padding: 20px; + border-radius: var(--radius-sm); + border: 1px solid var(--border); + transition: transform 0.2s, box-shadow 0.2s; +} +.highlight:hover { transform: translateY(-2px); box-shadow: var(--shadow); } +.highlight h4 { font-size: 0.95rem; margin-bottom: 6px; } +.highlight p { font-size: 0.85rem; color: var(--text-secondary); } + +/* Timeline */ +.timeline { position: relative; padding-left: 28px; } +.timeline::before { + content: ''; position: absolute; - left: 10px; - top: 0; - bottom: 0; + left: 7px; + top: 4px; + bottom: 4px; width: 2px; - background: var(--secondary); + background: var(--border); } -.timeline-item { - position: relative; - display: grid; - grid-template-columns: 1fr; - gap: 0.5rem; -} - -.timeline-item:before { - content: ""; +.timeline-item { position: relative; margin-bottom: 32px; } +.timeline-item::before { + content: ''; position: absolute; - left: -30px; - top: 5px; + left: -24px; + top: 6px; width: 12px; height: 12px; border-radius: 50%; - background: var(--primary); - border: 2px solid var(--secondary); + background: var(--accent); + border: 2px solid var(--bg); } -/* Адаптация для мелких экранов */ +.timeline-item h3 { font-size: 1.1rem; font-weight: 600; } +.timeline-item .period { font-size: 0.85rem; color: var(--text-secondary); margin: 2px 0 8px; } +.timeline-item p { font-size: 0.9rem; color: var(--text-secondary); } +.timeline-item ul { margin-top: 8px; padding-left: 20px; } +.timeline-item li { font-size: 0.88rem; color: var(--text-secondary); margin-bottom: 4px; } + +/* Projects */ +.projects-grid { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); + gap: 20px; +} + +.project-card { + background: var(--surface); + border: 1px solid var(--border); + border-radius: var(--radius); + padding: 28px; + transition: transform 0.2s, box-shadow 0.2s; +} +.project-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); } +.project-card h3 { font-size: 1.1rem; font-weight: 600; margin-bottom: 8px; } +.project-card p { font-size: 0.9rem; color: var(--text-secondary); } + +/* Skills */ +.skills-grid { + display: flex; + flex-wrap: wrap; + gap: 10px; +} + +.skill-badge { + display: inline-flex; + align-items: center; + gap: 6px; + background: var(--surface); + border: 1px solid var(--border); + border-radius: 20px; + padding: 6px 16px; + font-size: 0.85rem; + font-weight: 500; + transition: border-color 0.2s, background 0.2s; +} +.skill-badge:hover { border-color: var(--accent); background: var(--accent-light); } + +.skill-level { + font-size: 0.7rem; + padding: 1px 8px; + border-radius: 10px; + font-weight: 600; + text-transform: uppercase; +} +.skill-advanced { background: #22c55e; color: #fff; } +.skill-intermediate { background: #eab308; color: #000; } +.skill-beginner { background: #94a3b8; color: #fff; } + +/* Contact */ +.contact-grid { + display: flex; + flex-wrap: wrap; + gap: 12px; +} + +.contact-link { + display: inline-flex; + align-items: center; + gap: 8px; + padding: 12px 24px; + border: 1px solid var(--border); + border-radius: var(--radius-sm); + color: var(--text) !important; + font-size: 0.95rem; + transition: all 0.2s; +} +.contact-link:hover { border-color: var(--accent); color: var(--accent) !important; background: var(--accent-light); } + +/* Education */ +.edu-list { display: grid; gap: 20px; } +.edu-item { border-left: 3px solid var(--accent); padding-left: 16px; } +.edu-item h4 { font-size: 1rem; font-weight: 600; } +.edu-item .meta { font-size: 0.85rem; color: var(--text-secondary); } + +/* Footer */ +footer { + border-top: 1px solid var(--border); + padding: 40px 24px; + text-align: center; + color: var(--text-secondary); + font-size: 0.85rem; +} +footer a { color: var(--text-secondary) !important; } +footer a:hover { color: var(--accent) !important; } + +/* Animations */ +.fade-in { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease, transform 0.6s ease; } +.fade-in.visible { opacity: 1; transform: translateY(0); } + +/* Grid helpers */ +.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; } + +/* Languages */ +.lang-list { display: flex; gap: 24px; flex-wrap: wrap; } +.lang-item { display: flex; gap: 8px; font-size: 0.95rem; } +.lang-name { font-weight: 600; } +.lang-level { color: var(--text-secondary); } + +/* Responsive */ @media (max-width: 768px) { - body { - padding: 5px 10px; - margin: 5px auto; - } + .hero { grid-template-columns: 1fr; padding: 48px 24px 40px; text-align: center; } + .hero-content { max-width: 100%; } + .hero-description { max-width: 100%; } + .hero-buttons { justify-content: center; } + .hero-photo { order: -1; } + .hero-photo img { width: 200px; height: 200px; } + .social-links { justify-content: center; } - header { - grid-template-columns: 1fr; - grid-template-rows: auto auto auto; - padding: 1.5rem 1rem; - } + .about-grid { grid-template-columns: 1fr; text-align: center; } + .about-photo { margin: 0 auto; } + .about-highlights { grid-template-columns: 1fr; } - .theme-toggle { - grid-column: 1; - grid-row: 1; - justify-self: center; - margin-bottom: 1rem; - } + .section { padding: 48px 20px; } + .nav-links .nav-desktop { display: none; } - .section { - padding: 1.5rem; - } - - .about { - grid-template-columns: 1fr; - } - - .about-valitovgaziz-photo-box img { - min-width: 100%; - } - - .about-text { - width: 100%; - } - - .projects-grid { - grid-template-columns: 1fr; - } - - .roles-grid { - grid-template-columns: 1fr; - } - - .yalarba-stats { - grid-template-columns: repeat(2, 1fr); - } - - .footer-links { - grid-template-columns: 1fr; - } - - .two-column-grid { - border-left: none; - border-top: 1px solid black; - padding-top: 1rem; - } - - .timeline { - padding-left: 20px; - } - - .timeline:before { - left: 8px; - } - - .timeline-item:before { - left: -20px; - } + .grid-2 { grid-template-columns: 1fr; } + .projects-grid { grid-template-columns: 1fr; } } -/* Адаптация для очень маленьких экранов */ @media (max-width: 480px) { - body { - padding: 5px; - } - - .section { - padding: 1rem; - } - - .hero { - padding: 1.5rem 1rem; - } - - .hero-subtitle { - font-size: 1.2rem; - } - - .hero-description { - font-size: 1rem; - } - - .projects-grid, - .roles-grid, - .entrepreneur-highlights { - grid-template-columns: 1fr; - } - - .yalarba-stats { - grid-template-columns: 1fr; - } - - .skills-container { - grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); - } -} - -/* Улучшения для планшетов */ -@media (min-width: 769px) and (max-width: 1024px) { - .about { - grid-template-columns: 1fr; - gap: 2rem; - } - - .projects-grid { - grid-template-columns: repeat(2, 1fr); - } - - .roles-grid { - grid-template-columns: repeat(2, 1fr); - } - - .entrepreneur-highlights { - grid-template-columns: repeat(2, 1fr); - } -} - -/* Анимации и улучшения UX */ -@keyframes fadeIn { - from { - opacity: 0; - transform: translateY(20px); - } - to { - opacity: 1; - transform: translateY(0); - } -} - -.section { - animation: fadeIn 0.5s ease-out; -} - -.project-card, -.role-card, -.highlight-item { - animation: fadeIn 0.5s ease-out; -} - -/* Улучшения доступности */ -@media (prefers-reduced-motion: reduce) { - * { - animation-duration: 0.01ms !important; - animation-iteration-count: 1 !important; - transition-duration: 0.01ms !important; - } -} - -/* Улучшения фокуса для доступности */ -button:focus, -a:focus { - outline: 2px solid var(--secondary); - outline-offset: 2px; -} - -/* Улучшения для темной темы */ -body.dark-mode .highlight-item, -body.dark-mode .role-card { - background: var(--dark-card); -} - -body.dark-mode .project-card:hover, -body.dark-mode .role-card:hover, -body.dark-mode .highlight-item:hover { - transform: translateY(-5px); - box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3); + .hero h1 { font-size: 2rem; } + .hero-subtitle { font-size: 1rem; } + .section-header h2 { font-size: 1.5rem; } }