1010 < style >
1111 : root { --bg-body : # 050505 ; --bg-nav : # 050505 ; --text-main : # f0f0f0 ; --text-muted : # 8b9bb4 ; --border-color : rgba (255 , 255 , 255 , 0.08 ); --accent-blue : # 3b82f6 ; }
1212 body { font-family : 'Inter' , sans-serif; background : var (--bg-body ); color : var (--text-main ); margin : 0 ; overflow-x : hidden; background-image : radial-gradient (circle at 1px 1px , rgba (255 , 255 , 255 , 0.015 ) 1px , transparent 0 ); background-size : 32px 32px ; }
13+
1314 .navbar { background : var (--bg-nav ); border-bottom : 1px solid var (--border-color ); padding : 22px 40px ; display : grid; grid-template-columns : 1fr auto 1fr ; align-items : center; position : sticky; top : 0 ; z-index : 1000 ; }
1415 .nav-left { display : flex; align-items : center; justify-content : flex-start; }
1516 .nav-brand { font-size : 1.5rem ; font-weight : 900 ; text-decoration : none; color : # fff ; letter-spacing : -0.5px ; }
16- .nav-center { display : flex; justify-content : center; align-items : center; gap : 25px ; }
17- .nav-center a { text-decoration : none; color : var (--text-muted ); font-weight : 600 ; font-size : 0.95rem ; transition : 0.3s ; }
17+
18+ /* POPRAWIONA NAWIGACJA Z BENCHMARKS */
19+ .nav-center { display : flex; justify-content : center; align-items : center; gap : 20px ; }
20+ .nav-center a { text-decoration : none; color : var (--text-muted ); font-weight : 600 ; font-size : 0.9rem ; transition : 0.3s ; }
1821 .nav-center a : hover , .nav-center a .active { color : var (--accent-blue ); }
22+
1923 .nav-right { display : flex; justify-content : flex-end; }
2024 .dropdown { position : relative; display : inline-block; }
2125 .dropbtn { background : # 111 ; color : # fff ; padding : 8px 16px ; border-radius : 6px ; border : 1px solid rgba (255 , 255 , 255 , 0.1 ); cursor : pointer; font-family : 'Inter' , sans-serif; font-weight : 600 ; font-size : 0.9rem ; }
2226 .dropdown-content { display : none; position : absolute; right : 0 ; top : 130% ; background : # 0a0a0a ; min-width : 180px ; border : 1px solid rgba (255 , 255 , 255 , 0.1 ); border-radius : 6px ; box-shadow : 0 10px 30px rgba (0 , 0 , 0 , 0.8 ); }
2327 .dropdown-content a { display : flex; justify-content : space-between; align-items : center; color : # fff ; padding : 12px 16px ; text-decoration : none; font-size : 0.85rem ; font-weight : 600 ; border-bottom : 1px solid rgba (255 , 255 , 255 , 0.05 ); }
24- .dropdown-content a : hover { background : # 1a1a1a ; color : var (--accent-blue ); }
2528 .dropdown : hover .dropdown-content { display : block; }
29+
2630 .hero-header { max-width : 1000px ; margin : 60px auto 40px auto; text-align : center; padding : 0 20px ; }
2731 .hero-title { font-size : 3.5rem ; font-weight : 900 ; margin : 0 ; letter-spacing : -2px ; line-height : 1 ; color : # fff ; }
2832 .hero-title span { color : var (--accent-blue ); }
29- . hero-subtitle { font-size : 1.05 rem ; color : var ( --text-muted ); margin-top : 15 px ; max-width : 700 px ; margin-left : auto; margin-right : auto; line-height : 1.5 ; }
33+
3034 .dashboard { width : 100% ; max-width : 100% ; padding : 0 40px ; margin : 0 auto 40px auto; box-sizing : border-box; }
3135 .grid-container { display : grid; grid-template-columns : 240px 1px 1fr ; gap : 50px ; align-items : start; }
3236 .vertical-divider { background : var (--border-color ); width : 1px ; height : 100% ; min-height : 400px ; }
3337 .left-sidebar { display : flex; flex-direction : column; gap : 20px ; position : sticky; top : 100px ; }
3438 .main-content { display : flex; flex-direction : column; gap : 30px ; max-width : 1200px ; }
39+
3540 .card { background : rgba (10 , 10 , 10 , 0.7 ); border : 1px solid var (--border-color ); padding : 20px ; border-radius : 12px ; backdrop-filter : blur (10px ); }
3641 .vinted-card { border-color : # 00bfb2 !important ; background : transparent !important ; }
3742 .support-btn { display : block; text-decoration : none; padding : 12px ; border-radius : 8px ; font-weight : 800 ; font-size : 0.8rem ; text-align : center; margin-top : 10px ; transition : 0.3s ; }
3843 .do-badge { display : block; margin-top : 10px ; transition : 0.3s ; }
3944 .do-badge img { width : 100% ; border-radius : 8px ; }
4045
41- /* STOPKA KONTAKTOWA */
4246 .contact-section { max-width : 1000px ; margin : 0 auto 40px auto; padding : 0 40px ; }
4347 .contact-card { border-style : dashed; border-color : rgba (255 , 255 , 255 , 0.15 ); text-align : center; padding : 30px ; }
44- .contact-grid { display : flex; justify-content : center; gap : 40px ; font-family : 'JetBrains Mono' , monospace; font-size : 0.85rem ; }
4548
4649 @media (max-width : 1024px ) {
47- .navbar { display : flex; flex-direction : column; gap : 15px ; align-items : center; padding : 15px 20px ; }
48- .nav-center { gap : 15px ; flex-wrap : wrap; justify-content : center; }
49- .hero-title { font-size : 2.2rem ; }
50+ .navbar { display : flex; flex-direction : column; gap : 15px ; padding : 15px 20px ; }
51+ .nav-center { gap : 10px ; flex-wrap : wrap; justify-content : center; }
5052 .dashboard { padding : 0 15px ; }
5153 .grid-container { grid-template-columns : 1fr ; gap : 20px ; }
5254 .vertical-divider { display : none; }
5355 .left-sidebar { position : static; }
54- .contact-section { padding : 0 15px ; }
55- .contact-grid { flex-direction : column; gap : 15px ; align-items : center; }
5656 }
5757 </ style >
5858</ head >
6464 < a href ="/ " {% if page.url == "/ " %}class ="active "{% endif %} > Hub</ a >
6565 < a href ="/blog " {% if page.url contains "blog" %}class="active "{% endif %} > Blog</ a >
6666 < a href ="/homelab " {% if page.url contains "homelab" %}class="active "{% endif %} > HomeLab</ a >
67+ < a href ="/benchmarks " {% if page.url contains "benchmarks" %}class="active "{% endif %} > Benchmarks</ a >
6768 < a href ="/orbit " {% if page.url contains "orbit" %}class="active "{% endif %} > Orbit™</ a >
6869 </ div >
6970 < div class ="nav-right ">
8182 </ nav >
8283
8384 < header class ="hero-header ">
84- {% if page.url == "/" %}
85- < h1 class ="hero-title "> DevLab < span > Environment</ span > </ h1 >
86- < p class ="hero-subtitle "> Eksploracja domowej infrastruktury IT, klastrów Proxmox i automatyzacji.</ p >
87- {% else %}
88- < h1 class ="hero-title "> < span > {{ page.title }}</ span > </ h1 >
89- {% endif %}
85+ < h1 class ="hero-title "> {% if page.url == "/" %}DevLab < span > Environment</ span > {% else %}< span > {{ page.title }}</ span > {% endif %}</ h1 >
9086 </ header >
9187
9288 < main class ="dashboard ">
@@ -115,8 +111,7 @@ <h3 style="font-size: 0.8rem; color: var(--accent-blue); margin: 0 0 10px 0; tex
115111
116112 < section class ="contact-section ">
117113 < div class ="card contact-card ">
118- < h3 style ="font-family: 'JetBrains Mono', monospace; font-size: 0.9rem; color: var(--text-muted); margin-bottom: 20px; text-transform: uppercase; "> [ Contact_Channels ]</ h3 >
119- < div class ="contact-grid ">
114+ < div style ="display: flex; justify-content: center; gap: 40px; font-family: 'JetBrains Mono', monospace; font-size: 0.85rem; flex-wrap: wrap; ">
120115 < p style ="margin: 0; "> > Widzowie: < a href ="mailto:widzowie@devlabstudy.ovh " style ="color: var(--accent-blue); text-decoration: none; "> widzowie@devlabstudy.ovh</ a > </ p >
121116 < p style ="margin: 0; "> > Business: < a href ="mailto:contact@devlabstudy.ovh " style ="color: #10b981; text-decoration: none; "> contact@devlabstudy.ovh</ a > </ p >
122117 </ div >
@@ -125,7 +120,7 @@ <h3 style="font-family: 'JetBrains Mono', monospace; font-size: 0.9rem; color: v
125120
126121 < footer style ="text-align: center; padding: 40px; color: #334155; font-family: 'JetBrains Mono', monospace; font-size: 0.75rem; ">
127122 > root@devlab:~# uptime _ < br >
128- 21:55:00 up 34 days, 12:45 , 1 user
123+ {{ "now" | date: "%Y-%m-%d %H:%M" }} up 34 days, 1 user
129124 </ footer >
130125
131126</ body >
0 commit comments