diff --git a/_site/css/styles.css b/_site/css/styles.css index 5bb6b54..b45fc94 100644 --- a/_site/css/styles.css +++ b/_site/css/styles.css @@ -1,244 +1,305 @@ :root { - /* Tokyo Night Night colors */ - --tokyo-bg: #1a1b26; - --tokyo-bg-lighter: #24283b; - --tokyo-bg-lightest: #2f334d; - --tokyo-fg: #c0caf5; - --tokyo-fg-bright: #a9b1d6; - --tokyo-fg-brighter: #9aa5ce; - --tokyo-blue: #7aa2f7; - --tokyo-cyan: #7dcfff; - --tokyo-green: #9ece6a; - --tokyo-purple: #bb9af7; - --tokyo-orange: #ff9e64; - --tokyo-red: #f7768e; - --tokyo-yellow: #e0af68; - --tokyo-magenta: #bb9af7; - - /* Mapping the old Nord variables to Tokyo Night */ - --primary-color: var(--tokyo-bg); - --secondary-color: var(--tokyo-blue); - --bg-color: var(--tokyo-bg-lighter); - --text-color: var(--tokyo-fg); - --next-semester-color: var(--tokyo-orange); - --self-learning-color: var(--tokyo-purple); - --section-bg: var(--tokyo-bg-lightest); - --project-bg: var(--tokyo-bg); - --link-color: var(--tokyo-cyan); + --nord0: #2E3440; + --nord1: #3B4252; + --nord2: #434C5E; + --nord3: #4C566A; + --text-primary: #ECEFF4; + --text-secondary: #D8DEE9; + --accent: #88C0D0; } * { margin: 0; padding: 0; box-sizing: border-box; - font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } body { - background-color: var(--bg-color); - color: var(--text-color); + background-color: var(--nord0); + color: var(--text-primary); + font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; line-height: 1.6; } -header { - background-color: var(--primary-color); - color: var(--text-color); - padding: 2rem; - text-align: center; -} - -.contact-links { - margin-top: 1rem; - display: flex; - justify-content: center; - gap: 1.5rem; -} - -.contact-links a { - color: var(--link-color); - text-decoration: none; - transition: all 0.3s ease; - display: flex; - align-items: center; - gap: 0.5rem; -} - -.contact-links a:hover { - color: var(--tokyo-green); - transform: translateY(-2px); -} - -.education-item { - background: var(--project-bg); - padding: 1rem; - margin: 1rem 0; - border-radius: 4px; -} - -.education-item p { - margin: 0.3rem 0; -} - .container { - max-width: 1000px; + max-width: 1200px; margin: 0 auto; padding: 2rem; } -.section { - background: var(--section-bg); +header { + background-color: var(--nord1); padding: 2rem; - margin: 1rem 0; - border-radius: 8px; - box-shadow: 0 2px 4px rgba(0,0,0,0.1); - transition: transform 0.3s ease; + text-align: center; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); } -.section:hover { - transform: translateY(-5px); -} - -.section h2 { - color: var(--secondary-color); - margin-bottom: 1rem; - border-bottom: 2px solid var(--secondary-color); - padding-bottom: 0.5rem; +.header-top { display: flex; justify-content: space-between; align-items: center; + margin-bottom: 1rem; +} + +.language-container { + width: 64px; +} + +.language-switch { + display: inline-block; + transition: transform 0.3s ease; +} + +.language-switch:hover { + transform: scale(1.1); +} + +.flag-icon { + border-radius: 4px; +} + +h1 { + color: var(--text-primary); + font-size: 2.5rem; + margin: 0; +} + +h2 { + color: var(--text-primary); + font-size: 2rem; + margin-bottom: 1.5rem; +} + +h3 { + color: var(--text-primary); + font-size: 1.5rem; + margin-bottom: 1rem; +} + +.contact-links { + display: flex; + justify-content: center; + gap: 2rem; + flex-wrap: wrap; + margin-top: 1.5rem; +} + +.contact-links a { + color: var(--accent); + text-decoration: none; + display: flex; + align-items: center; + gap: 0.5rem; + transition: color 0.3s ease; + padding: 0.5rem; + border-radius: 4px; +} + +.contact-links a:hover { + color: var(--text-primary); + background-color: var(--nord2); +} + +.section { + background-color: var(--nord1); + border-radius: 8px; + padding: 2rem; + margin-bottom: 2rem; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } .skills-container { - margin-bottom: 1.5rem; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: 1.5rem; +} + +.skills-grid { + display: flex; + flex-direction: column; + gap: 2rem; +} + +.skills-row { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 2rem; } .skills-category { - margin-bottom: 1.5rem; + background-color: var(--nord2); + border-radius: 6px; + padding: 1.5rem; } .skills-category h3 { - color: var(--tokyo-green); - margin-bottom: 0.5rem; + color: var(--text-primary); + margin-bottom: 1.5rem; + padding-bottom: 0.5rem; + border-bottom: 2px solid var(--nord3); } .skills { display: flex; flex-wrap: wrap; - gap: 1rem; + gap: 0.75rem; } .skill-tag { - background: var(--secondary-color); - color: var(--tokyo-bg); + background-color: var(--accent); + color: var(--nord0); padding: 0.5rem 1rem; - border-radius: 20px; - cursor: pointer; - transition: all 0.3s ease; - font-weight: bold; -} - -.skill-tag.next-semester { - background: var(--next-semester-color); -} - -.skill-tag.self-learning { - background: var(--self-learning-color); + border-radius: 4px; + display: inline-block; + font-size: 0.9rem; + transition: transform 0.3s ease; + font-weight: 500; } .skill-tag:hover { transform: translateY(-2px); - filter: brightness(1.1); } -.project-type { - display: flex; - flex-direction: column; - height: 100%; +.skill-tag.next-semester { + background-color: var(--nord2); + color: var(--text-secondary); + border: 1px solid var(--nord3); } -.project { - flex-grow: 1; - background: var(--project-bg); - padding: 1rem; - margin-bottom: 1rem; - border-radius: 4px; +.skill-tag.self-learning { + background-color: var(--nord2); + color: var(--text-secondary); + border: 1px dashed var(--accent); } -.project-links { - margin-top: auto; - padding-top: 1rem; - border-top: 1px solid var(--tokyo-bg-lightest); +.education-item { + margin-bottom: 2rem; + padding: 1.5rem; + background-color: var(--nord2); + border-radius: 6px; +} + +.education-item:last-child { + margin-bottom: 0; +} + +.education-item p { + margin-bottom: 0.5rem; +} + +.education-item p:last-child { + margin-bottom: 0; + color: var(--text-secondary); } .projects-container { display: grid; - grid-template-columns: 1fr 1fr; - gap: 1rem; + gap: 2rem; } -@media (max-width: 768px) { - .projects-container { - grid-template-columns: 1fr; - } +.project { + background-color: var(--nord2); + border-radius: 6px; + padding: 1.5rem; + margin-bottom: 1.5rem; + transition: transform 0.3s ease; +} + +.project:hover { + transform: translateY(-2px); +} + +.project h3 { + margin-bottom: 1rem; +} + +.project p { + margin-bottom: 1rem; +} + +.project ul { + margin-bottom: 1rem; +} + +.project-links { + margin-top: 1.5rem; } .portfolio-link { - color: var(--link-color); + color: var(--accent); text-decoration: none; - transition: color 0.3s ease; - font-weight: bold; + display: inline-block; + padding: 0.5rem 1rem; + border-radius: 4px; + transition: all 0.3s ease; } .portfolio-link:hover { - color: var(--tokyo-green); - text-decoration: underline; + color: var(--text-primary); + background-color: var(--nord2); +} + +ul { + list-style-position: inside; +} + +ul li { + margin-bottom: 0.5rem; } @media (max-width: 768px) { .container { - padding: 1rem; + padding: 1rem; } - + + header { + padding: 1rem; + } + + .header-top { + flex-direction: column; + gap: 1rem; + } + + .contact-links { + flex-direction: column; + align-items: center; + gap: 1rem; + } + + .skills-container { + grid-template-columns: 1fr; + } + + h1 { + font-size: 2rem; + } + + h2 { + font-size: 1.75rem; + } + + h3 { + font-size: 1.25rem; + } + + .skills-row { + grid-template-columns: 1fr; + gap: 1.5rem; + } + + .skills-category { + padding: 1rem; + } +} + +@media (max-width: 480px) { .section { - padding: 1rem; + padding: 1rem; + } + + .contact-links a { + width: 100%; + justify-content: center; } } - -.header-top { - display: grid; - grid-template-columns: 200px auto 200px; - align-items: center; - margin-bottom: 1rem; - width: 100%; -} - -.header-top h1 { - text-align: center; - margin: 0; -} - -.language-container { - display: flex; - align-items: center; -} - -.language-switch { - display: flex; - align-items: center; - width: 30px; - height: 20px; - overflow: hidden; - text-decoration: none; /* Usuwa domyślne podkreślenie linku */ -} - -.language-switch:hover { - transform: none; /* Wyłącza wszelkie transformacje przy hover */ -} - -.flag-icon { - width: 100%; - height: 100%; - object-fit: contain; - border: none; - display: block; /* Zapobiega problemom z inline-block */ -} \ No newline at end of file diff --git a/_site/img/poland.png b/_site/img/poland.png new file mode 100644 index 0000000..c92319b Binary files /dev/null and b/_site/img/poland.png differ diff --git a/_site/index.html b/_site/index.html index 86b8f7e..65d9e9d 100644 --- a/_site/index.html +++ b/_site/index.html @@ -1,12 +1,15 @@ - + + + + + Bartłomiej Piekarski -
@@ -14,8 +17,8 @@

Bartłomiej Piekarski

- - + +
@@ -54,43 +57,47 @@

Umiejętności

-
-
-

Języki programowania

-
- C# - Python - Kotlin (następny semestr) - Rust (samodzielna nauka) - Ruby (samodzielna nauka) +
+
+
+

Języki programowania

+
+ C# + Python + Kotlin (następny semestr) + Rust (samodzielna nauka) + Ruby (samodzielna nauka) +
+
+
+

Technologie i narzędzia

+
+ Visual Studio + Unity + MSSQL + Android Studio (następny semestr) + Git (samodzielna nauka) +
- -
-

Technologie i narzędzia

-
- Unity - MSSQL - Git (samodzielna nauka) +
+
+

Systemy operacyjne

+
+ Windows + Linux (Ubuntu) + Android (następny semestr) + Linux (Arch/Fedora) (samodzielna nauka) +
-
- -
-

Systemy operacyjne

-
- Windows - Linux (Ubuntu) - Linux (Arch/Fedora) (samodzielna nauka) -
-
- -
-

Oprogramowanie kreatywne

-
- Krita - GIMP - Kdenlive - Blender (następny semestr) +
+

Oprogramowanie kreatywne

+
+ Krita + GIMP + Kdenlive + Blender (następny semestr) +
@@ -164,7 +171,7 @@

Kasjer Sprzedawca

-

MINIT Polska | 02.2020 - 01.2021

+

MINIT Polska | 02.2021 - 01.2022

  • Obsługa kasy fiskalnej i terminala płatniczego
  • Zarządzanie towarem i prowadzenie inwentaryzacji
  • @@ -173,8 +180,8 @@
-

Magazynier (Dorywczo)

-

MotoProfil | 2019-2022 (wakacje)

+

Magazynier

+

MotoProfil | 2019-2022 (dorywczo)

  • Kompletacja zamówień i przygotowanie do wysyłki
  • Obsługa systemu WMS i skanerów kodów kreskowych
  • @@ -187,12 +194,12 @@

    Zainteresowania

      -
    • Game development
    • +
    • Game Development
    • Cyberbezpieczeństwo
    • -
    • Linux i open source
    • -
    • E-sport
    • +
    • Linux i Technologie Open Source
    • +
    • E-Sport
- \ No newline at end of file + diff --git a/css/styles.css b/css/styles.css index 5bb6b54..b45fc94 100644 --- a/css/styles.css +++ b/css/styles.css @@ -1,244 +1,305 @@ :root { - /* Tokyo Night Night colors */ - --tokyo-bg: #1a1b26; - --tokyo-bg-lighter: #24283b; - --tokyo-bg-lightest: #2f334d; - --tokyo-fg: #c0caf5; - --tokyo-fg-bright: #a9b1d6; - --tokyo-fg-brighter: #9aa5ce; - --tokyo-blue: #7aa2f7; - --tokyo-cyan: #7dcfff; - --tokyo-green: #9ece6a; - --tokyo-purple: #bb9af7; - --tokyo-orange: #ff9e64; - --tokyo-red: #f7768e; - --tokyo-yellow: #e0af68; - --tokyo-magenta: #bb9af7; - - /* Mapping the old Nord variables to Tokyo Night */ - --primary-color: var(--tokyo-bg); - --secondary-color: var(--tokyo-blue); - --bg-color: var(--tokyo-bg-lighter); - --text-color: var(--tokyo-fg); - --next-semester-color: var(--tokyo-orange); - --self-learning-color: var(--tokyo-purple); - --section-bg: var(--tokyo-bg-lightest); - --project-bg: var(--tokyo-bg); - --link-color: var(--tokyo-cyan); + --nord0: #2E3440; + --nord1: #3B4252; + --nord2: #434C5E; + --nord3: #4C566A; + --text-primary: #ECEFF4; + --text-secondary: #D8DEE9; + --accent: #88C0D0; } * { margin: 0; padding: 0; box-sizing: border-box; - font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } body { - background-color: var(--bg-color); - color: var(--text-color); + background-color: var(--nord0); + color: var(--text-primary); + font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; line-height: 1.6; } -header { - background-color: var(--primary-color); - color: var(--text-color); - padding: 2rem; - text-align: center; -} - -.contact-links { - margin-top: 1rem; - display: flex; - justify-content: center; - gap: 1.5rem; -} - -.contact-links a { - color: var(--link-color); - text-decoration: none; - transition: all 0.3s ease; - display: flex; - align-items: center; - gap: 0.5rem; -} - -.contact-links a:hover { - color: var(--tokyo-green); - transform: translateY(-2px); -} - -.education-item { - background: var(--project-bg); - padding: 1rem; - margin: 1rem 0; - border-radius: 4px; -} - -.education-item p { - margin: 0.3rem 0; -} - .container { - max-width: 1000px; + max-width: 1200px; margin: 0 auto; padding: 2rem; } -.section { - background: var(--section-bg); +header { + background-color: var(--nord1); padding: 2rem; - margin: 1rem 0; - border-radius: 8px; - box-shadow: 0 2px 4px rgba(0,0,0,0.1); - transition: transform 0.3s ease; + text-align: center; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); } -.section:hover { - transform: translateY(-5px); -} - -.section h2 { - color: var(--secondary-color); - margin-bottom: 1rem; - border-bottom: 2px solid var(--secondary-color); - padding-bottom: 0.5rem; +.header-top { display: flex; justify-content: space-between; align-items: center; + margin-bottom: 1rem; +} + +.language-container { + width: 64px; +} + +.language-switch { + display: inline-block; + transition: transform 0.3s ease; +} + +.language-switch:hover { + transform: scale(1.1); +} + +.flag-icon { + border-radius: 4px; +} + +h1 { + color: var(--text-primary); + font-size: 2.5rem; + margin: 0; +} + +h2 { + color: var(--text-primary); + font-size: 2rem; + margin-bottom: 1.5rem; +} + +h3 { + color: var(--text-primary); + font-size: 1.5rem; + margin-bottom: 1rem; +} + +.contact-links { + display: flex; + justify-content: center; + gap: 2rem; + flex-wrap: wrap; + margin-top: 1.5rem; +} + +.contact-links a { + color: var(--accent); + text-decoration: none; + display: flex; + align-items: center; + gap: 0.5rem; + transition: color 0.3s ease; + padding: 0.5rem; + border-radius: 4px; +} + +.contact-links a:hover { + color: var(--text-primary); + background-color: var(--nord2); +} + +.section { + background-color: var(--nord1); + border-radius: 8px; + padding: 2rem; + margin-bottom: 2rem; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } .skills-container { - margin-bottom: 1.5rem; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: 1.5rem; +} + +.skills-grid { + display: flex; + flex-direction: column; + gap: 2rem; +} + +.skills-row { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 2rem; } .skills-category { - margin-bottom: 1.5rem; + background-color: var(--nord2); + border-radius: 6px; + padding: 1.5rem; } .skills-category h3 { - color: var(--tokyo-green); - margin-bottom: 0.5rem; + color: var(--text-primary); + margin-bottom: 1.5rem; + padding-bottom: 0.5rem; + border-bottom: 2px solid var(--nord3); } .skills { display: flex; flex-wrap: wrap; - gap: 1rem; + gap: 0.75rem; } .skill-tag { - background: var(--secondary-color); - color: var(--tokyo-bg); + background-color: var(--accent); + color: var(--nord0); padding: 0.5rem 1rem; - border-radius: 20px; - cursor: pointer; - transition: all 0.3s ease; - font-weight: bold; -} - -.skill-tag.next-semester { - background: var(--next-semester-color); -} - -.skill-tag.self-learning { - background: var(--self-learning-color); + border-radius: 4px; + display: inline-block; + font-size: 0.9rem; + transition: transform 0.3s ease; + font-weight: 500; } .skill-tag:hover { transform: translateY(-2px); - filter: brightness(1.1); } -.project-type { - display: flex; - flex-direction: column; - height: 100%; +.skill-tag.next-semester { + background-color: var(--nord2); + color: var(--text-secondary); + border: 1px solid var(--nord3); } -.project { - flex-grow: 1; - background: var(--project-bg); - padding: 1rem; - margin-bottom: 1rem; - border-radius: 4px; +.skill-tag.self-learning { + background-color: var(--nord2); + color: var(--text-secondary); + border: 1px dashed var(--accent); } -.project-links { - margin-top: auto; - padding-top: 1rem; - border-top: 1px solid var(--tokyo-bg-lightest); +.education-item { + margin-bottom: 2rem; + padding: 1.5rem; + background-color: var(--nord2); + border-radius: 6px; +} + +.education-item:last-child { + margin-bottom: 0; +} + +.education-item p { + margin-bottom: 0.5rem; +} + +.education-item p:last-child { + margin-bottom: 0; + color: var(--text-secondary); } .projects-container { display: grid; - grid-template-columns: 1fr 1fr; - gap: 1rem; + gap: 2rem; } -@media (max-width: 768px) { - .projects-container { - grid-template-columns: 1fr; - } +.project { + background-color: var(--nord2); + border-radius: 6px; + padding: 1.5rem; + margin-bottom: 1.5rem; + transition: transform 0.3s ease; +} + +.project:hover { + transform: translateY(-2px); +} + +.project h3 { + margin-bottom: 1rem; +} + +.project p { + margin-bottom: 1rem; +} + +.project ul { + margin-bottom: 1rem; +} + +.project-links { + margin-top: 1.5rem; } .portfolio-link { - color: var(--link-color); + color: var(--accent); text-decoration: none; - transition: color 0.3s ease; - font-weight: bold; + display: inline-block; + padding: 0.5rem 1rem; + border-radius: 4px; + transition: all 0.3s ease; } .portfolio-link:hover { - color: var(--tokyo-green); - text-decoration: underline; + color: var(--text-primary); + background-color: var(--nord2); +} + +ul { + list-style-position: inside; +} + +ul li { + margin-bottom: 0.5rem; } @media (max-width: 768px) { .container { - padding: 1rem; + padding: 1rem; } - + + header { + padding: 1rem; + } + + .header-top { + flex-direction: column; + gap: 1rem; + } + + .contact-links { + flex-direction: column; + align-items: center; + gap: 1rem; + } + + .skills-container { + grid-template-columns: 1fr; + } + + h1 { + font-size: 2rem; + } + + h2 { + font-size: 1.75rem; + } + + h3 { + font-size: 1.25rem; + } + + .skills-row { + grid-template-columns: 1fr; + gap: 1.5rem; + } + + .skills-category { + padding: 1rem; + } +} + +@media (max-width: 480px) { .section { - padding: 1rem; + padding: 1rem; + } + + .contact-links a { + width: 100%; + justify-content: center; } } - -.header-top { - display: grid; - grid-template-columns: 200px auto 200px; - align-items: center; - margin-bottom: 1rem; - width: 100%; -} - -.header-top h1 { - text-align: center; - margin: 0; -} - -.language-container { - display: flex; - align-items: center; -} - -.language-switch { - display: flex; - align-items: center; - width: 30px; - height: 20px; - overflow: hidden; - text-decoration: none; /* Usuwa domyślne podkreślenie linku */ -} - -.language-switch:hover { - transform: none; /* Wyłącza wszelkie transformacje przy hover */ -} - -.flag-icon { - width: 100%; - height: 100%; - object-fit: contain; - border: none; - display: block; /* Zapobiega problemom z inline-block */ -} \ No newline at end of file diff --git a/img/poland.png b/img/poland.png new file mode 100644 index 0000000..c92319b Binary files /dev/null and b/img/poland.png differ diff --git a/index.html b/index.html index 86b8f7e..65d9e9d 100644 --- a/index.html +++ b/index.html @@ -1,12 +1,15 @@ - + + + + + Bartłomiej Piekarski -
@@ -14,8 +17,8 @@

Bartłomiej Piekarski

@@ -54,43 +57,47 @@

Umiejętności

-
-
-

Języki programowania

-
- C# - Python - Kotlin (następny semestr) - Rust (samodzielna nauka) - Ruby (samodzielna nauka) +
+
+
+

Języki programowania

+
+ C# + Python + Kotlin (następny semestr) + Rust (samodzielna nauka) + Ruby (samodzielna nauka) +
+
+
+

Technologie i narzędzia

+
+ Visual Studio + Unity + MSSQL + Android Studio (następny semestr) + Git (samodzielna nauka) +
- -
-

Technologie i narzędzia

-
- Unity - MSSQL - Git (samodzielna nauka) +
+
+

Systemy operacyjne

+
+ Windows + Linux (Ubuntu) + Android (następny semestr) + Linux (Arch/Fedora) (samodzielna nauka) +
-
- -
-

Systemy operacyjne

-
- Windows - Linux (Ubuntu) - Linux (Arch/Fedora) (samodzielna nauka) -
-
- -
-

Oprogramowanie kreatywne

-
- Krita - GIMP - Kdenlive - Blender (następny semestr) +
+

Oprogramowanie kreatywne

+
+ Krita + GIMP + Kdenlive + Blender (następny semestr) +
@@ -164,7 +171,7 @@

Kasjer Sprzedawca

-

MINIT Polska | 02.2020 - 01.2021

+

MINIT Polska | 02.2021 - 01.2022

  • Obsługa kasy fiskalnej i terminala płatniczego
  • Zarządzanie towarem i prowadzenie inwentaryzacji
  • @@ -173,8 +180,8 @@
-

Magazynier (Dorywczo)

-

MotoProfil | 2019-2022 (wakacje)

+

Magazynier

+

MotoProfil | 2019-2022 (dorywczo)

  • Kompletacja zamówień i przygotowanie do wysyłki
  • Obsługa systemu WMS i skanerów kodów kreskowych
  • @@ -187,12 +194,12 @@

    Zainteresowania

      -
    • Game development
    • +
    • Game Development
    • Cyberbezpieczeństwo
    • -
    • Linux i open source
    • -
    • E-sport
    • +
    • Linux i Technologie Open Source
    • +
    • E-Sport
- \ No newline at end of file +