diff --git a/main_dc/valitovgaziz/html/index.html b/main_dc/valitovgaziz/html/index.html index 76538b2..f9da420 100644 --- a/main_dc/valitovgaziz/html/index.html +++ b/main_dc/valitovgaziz/html/index.html @@ -444,30 +444,150 @@ - +

Навыки

- Java - Spring Framework - JavaScript - Vue3 - Nuxt - HTML/CSS/SASS/SCSS - PostgreSQL - Git - Docker - Golang - ООП - Алгоритмы - Agile - Figma - SQL - Linux - REST API - Intelij Idea - VS Code - Fleet +
+
+

Golang

+ Начальный +
+

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

+
+ Опыт: Основы языка, простые 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, микросервисная архитектура +
+
+ +
+
+

REST API

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

Проектирование и разработка API

+
+ Опыт: RESTful архитектура, документация, + версионирование +
+
+ GraphQL, gRPC, API security best practices +
+
diff --git a/main_dc/valitovgaziz/html/style.css b/main_dc/valitovgaziz/html/style.css index 8648960..c73ba49 100644 --- a/main_dc/valitovgaziz/html/style.css +++ b/main_dc/valitovgaziz/html/style.css @@ -7,6 +7,7 @@ @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 { @@ -186,29 +187,6 @@ header { gap: 0.5rem; } -/* Сетка для навыков */ -.skills-container { - display: grid; - grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); - gap: 1rem; -} - -.skill-tag { - background-color: var(--secondary); - color: white; - padding: 0.5rem 1rem; - border-radius: 1em; - font-size: 0.9rem; - box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4); - text-align: center; - transition: var(--transition); - overflow: hidden; -} - -.skill-tag:hover { - transform: scale(1.05); -} - /* Сетка для контактов */ .contact-info { display: grid; diff --git a/main_dc/valitovgaziz/html/style/skill_section.css b/main_dc/valitovgaziz/html/style/skill_section.css new file mode 100644 index 0000000..0f8e630 --- /dev/null +++ b/main_dc/valitovgaziz/html/style/skill_section.css @@ -0,0 +1,136 @@ +/* [file name]: skill_section.css */ +.skills-container { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); + gap: 1.5rem; + margin-top: 1.5rem; +} + +.skill-card { + background: linear-gradient(135deg, var(--secondary) 0%, #2980b9 100%); + color: white; + padding: 1.5rem; + border-radius: 12px; + box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); + transition: var(--transition); + display: grid; + grid-template-rows: auto auto 1fr auto; + gap: 0.8rem; + position: relative; + overflow: hidden; +} + +.skill-card::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + height: 4px; + background: rgba(255, 255, 255, 0.3); +} + +.skill-card:hover { + transform: translateY(-5px); + box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3); +} + +.skill-header { + display: grid; + grid-template-columns: 1fr auto; + align-items: start; + gap: 0.5rem; +} + +.skill-name { + font-size: 1.2rem; + font-weight: bold; + margin: 0; + color: white; +} + +.skill-level { + background: rgba(255, 255, 255, 0.2); + padding: 0.3rem 0.8rem; + border-radius: 20px; + font-size: 0.8rem; + font-weight: bold; + backdrop-filter: blur(10px); +} + +.skill-description { + font-size: 0.9rem; + line-height: 1.4; + opacity: 0.9; + margin: 0; +} + +.skill-acquisition { + background: rgba(255, 255, 255, 0.1); + padding: 0.8rem; + border-radius: 8px; + font-size: 0.85rem; + line-height: 1.3; +} + +.skill-growth { + display: flex; + align-items: center; + gap: 0.5rem; + font-size: 0.85rem; + color: #e8f4fc; + margin-top: 0.5rem; +} + +.skill-growth::before { + content: '🚀'; + font-size: 0.9rem; +} + +/* Уровни навыков */ +.skill-level.beginner { background: rgba(231, 76, 60, 0.8); } +.skill-level.intermediate { background: rgba(241, 196, 15, 0.8); } +.skill-level.advanced { background: rgba(46, 204, 113, 0.8); } +.skill-level.expert { background: rgba(52, 152, 219, 0.8); } + +/* Темная тема */ +body.dark-mode .skill-card { + background: linear-gradient(135deg, var(--dark-card) 0%, #34495e 100%); + border: 1px solid var(--dark-border); +} + +body.dark-mode .skill-level { + background: rgba(255, 255, 255, 0.15); +} + +body.dark-mode .skill-acquisition { + background: rgba(255, 255, 255, 0.08); +} + +/* Адаптивность */ +@media (max-width: 768px) { + .skills-container { + grid-template-columns: 1fr; + gap: 1rem; + } + + .skill-card { + padding: 1.2rem; + } + + .skill-header { + grid-template-columns: 1fr; + gap: 0.3rem; + } + + .skill-level { + justify-self: start; + margin-top: 0.3rem; + } +} + +@media (min-width: 1024px) { + .skills-container { + grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); + } +} \ No newline at end of file