Skip to content

Commit c76e938

Browse files
DevLabStudyDevLabStudy
authored
Update default.html
1 parent 1f1290d commit c76e938

1 file changed

Lines changed: 132 additions & 142 deletions

File tree

‎_layouts/default.html‎

Lines changed: 132 additions & 142 deletions
Original file line numberDiff line numberDiff line change
@@ -3,86 +3,48 @@
33
<head>
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6-
<title>DEVLABSTUDY | {{ page.title }}</title>
6+
<meta name="description" content="DevLabStudy - Homelab documentation, Proxmox clusters, and Project Orbit.">
7+
<title>DevLabStudy | {{ page.title }}</title>
78

8-
<!-- Ikona terminala w SVG jako Favicon -->
9+
<!-- Bezpośredni Favicon w SVG -->
910
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff5e00' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='4 17 10 11 4 5'></polyline><line x1='12' y1='19' x2='20' y2='19'></line></svg>">
1011

11-
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;700;800&family=Inter:wght@400;500;700;900&display=swap" rel="stylesheet">
12+
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;700;800&family=Inter:wght@400;600;700;900&display=swap" rel="stylesheet">
1213
<style>
13-
:root {
14-
--bg-dark: #030305;
15-
--bg-blue-glow: #0b192c;
16-
--text-main: #f1f5f9;
17-
--text-muted: #8b9bb4;
14+
:root {
15+
--bg-body: #030305;
16+
--bg-nav: #030305;
17+
--text-main: #f1f5f9;
18+
--text-muted: #8b9bb4;
19+
--border-color: rgba(0, 210, 255, 0.15);
1820
--accent-blue: #00d2ff;
1921
--accent-contrast: #ff5e00;
20-
--border: rgba(0, 210, 255, 0.15);
21-
--card-bg: rgba(10, 15, 25, 0.6);
2222
}
23-
24-
body {
25-
font-family: 'Inter', sans-serif;
26-
background: radial-gradient(circle at top right, var(--bg-blue-glow), var(--bg-dark) 60%);
27-
background-color: var(--bg-dark);
28-
background-attachment: fixed;
29-
color: var(--text-main);
30-
margin: 0;
31-
padding: 0;
32-
line-height: 1.6;
23+
24+
body {
25+
font-family: 'Inter', sans-serif;
26+
background: radial-gradient(circle at top right, #0b192c, var(--bg-body) 60%);
27+
background-color: var(--bg-body);
28+
color: var(--text-main);
29+
margin: 0;
3330
min-height: 100vh;
3431
display: flex;
3532
flex-direction: column;
33+
background-attachment: fixed;
3634
}
3735

3836
a { color: inherit; text-decoration: none; }
3937

40-
/* HEADER & NAWIGACJA */
41-
.navbar {
42-
display: flex;
43-
justify-content: space-between;
44-
align-items: center;
45-
padding: 30px 60px;
46-
max-width: 1500px;
47-
width: 100%;
48-
margin: 0 auto;
49-
border-bottom: 1px solid rgba(255, 255, 255, 0.03);
50-
box-sizing: border-box;
51-
}
52-
53-
.logo {
54-
font-size: 1.3rem;
55-
font-weight: 900;
56-
letter-spacing: 1px;
57-
text-transform: uppercase;
58-
display: flex;
59-
align-items: center;
60-
gap: 12px;
61-
color: var(--text-main);
62-
}
38+
.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; }
39+
.nav-left { display: flex; align-items: center; }
40+
.nav-brand { font-size: 1.3rem; font-weight: 900; text-decoration: none; color: #fff; letter-spacing: 1px; text-transform: uppercase; display: flex; align-items: center; gap: 10px; }
41+
.nav-brand svg { width: 22px; height: 22px; stroke: var(--accent-contrast); }
6342

64-
.logo svg {
65-
width: 24px;
66-
height: 24px;
67-
stroke: var(--accent-contrast);
68-
}
69-
70-
.nav-links {
71-
display: flex;
72-
gap: 35px;
73-
font-size: 0.9rem;
74-
font-weight: 600;
75-
}
76-
.nav-links a {
77-
color: var(--text-muted);
78-
transition: 0.3s;
79-
position: relative;
80-
}
81-
.nav-links a:hover, .nav-links a.active {
82-
color: var(--accent-blue);
83-
}
43+
.nav-center { display: flex; justify-content: center; align-items: center; gap: 25px; }
44+
.nav-center a { text-decoration: none; color: var(--text-muted); font-weight: 600; font-size: 0.9rem; transition: 0.3s; position: relative; }
45+
.nav-center a:hover, .nav-center a.active { color: var(--accent-blue); }
8446

85-
.nav-links a.active::after {
47+
.nav-center a.active::after {
8648
content: '';
8749
position: absolute;
8850
bottom: -6px;
@@ -93,104 +55,132 @@
9355
border-radius: 2px;
9456
}
9557

96-
/* GŁÓWNY KONTENER - poszerzony, żeby nic się nie zbijało do środka */
97-
.container {
98-
max-width: 1400px;
99-
width: 100%;
100-
margin: 0 auto;
101-
padding: 50px 60px;
102-
flex: 1;
103-
box-sizing: border-box;
104-
}
58+
.nav-right { display: flex; justify-content: flex-end; }
10559

106-
/* WSPÓLNE ELEMENTY */
107-
.section-tag {
108-
font-family: 'JetBrains Mono', monospace;
109-
color: var(--accent-contrast);
110-
font-size: 0.75rem;
111-
font-weight: 800;
112-
text-transform: uppercase;
113-
letter-spacing: 2px;
114-
margin-bottom: 25px;
115-
display: flex;
116-
align-items: center;
117-
gap: 10px;
118-
}
60+
.dropdown { position: relative; display: inline-block; }
61+
.dropbtn { background: rgba(0, 210, 255, 0.05); color: var(--accent-blue); padding: 8px 16px; border-radius: 6px; border: 1px solid rgba(0, 210, 255, 0.3); cursor: pointer; font-family: 'JetBrains Mono', monospace; font-weight: 700; font-size: 0.85rem; text-transform: uppercase; }
62+
.dropbtn:hover { background: rgba(0, 210, 255, 0.1); }
11963

120-
.section-tag::before {
121-
content: '///';
122-
color: var(--accent-blue);
123-
}
64+
.dropdown-content { position: absolute; right: 0; top: 100%; padding-top: 15px; min-width: 200px; opacity: 0; visibility: hidden; transition: 0.25s ease; z-index: 1001; }
65+
.dropdown-links-wrapper { background: rgba(10, 15, 25, 0.95); border: 1px solid var(--border-color); border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,0.8); overflow: hidden; backdrop-filter: blur(10px); }
66+
.dropdown-content a { display: flex; justify-content: space-between; align-items: center; color: var(--text-main); padding: 12px 16px; text-decoration: none; font-size: 0.85rem; font-weight: 600; border-bottom: 1px solid rgba(255, 255, 255, 0.03); }
67+
.dropdown-content a:hover { color: var(--accent-blue); background: rgba(0, 210, 255, 0.05); }
68+
.dropdown:hover .dropdown-content { opacity: 1; visibility: visible; }
12469

125-
/* STOPKA */
126-
footer {
127-
max-width: 1500px;
128-
width: 100%;
129-
margin: 80px auto 40px auto;
130-
padding: 40px 60px;
131-
border-top: 1px solid var(--border);
132-
display: flex;
133-
justify-content: space-between;
134-
align-items: center;
135-
font-size: 0.8rem;
136-
color: var(--text-muted);
137-
font-family: 'JetBrains Mono', monospace;
138-
box-sizing: border-box;
139-
}
70+
.dashboard { width: 100%; max-width: 1400px; padding: 40px; margin: 0 auto; box-sizing: border-box; flex: 1; }
71+
.grid-container { display: grid; grid-template-columns: 260px 1fr; gap: 50px; align-items: start; }
14072

141-
.footer-links {
142-
display: flex;
143-
gap: 20px;
144-
}
145-
146-
.footer-links a {
147-
color: var(--text-muted);
148-
transition: 0.2s;
149-
}
150-
151-
.footer-links a:hover {
152-
color: var(--accent-blue);
153-
}
73+
.left-sidebar { display: flex; flex-direction: column; gap: 20px; position: sticky; top: 100px; }
74+
75+
.card { background: rgba(10, 15, 25, 0.6); border: 1px solid var(--border-color); padding: 20px; border-radius: 12px; backdrop-filter: blur(10px); }
76+
.vinted-card { border-color: #00bfb2 !important; }
77+
.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; font-family: 'JetBrains Mono', monospace; text-transform: uppercase; }
78+
.do-badge { display: block; margin-top: 10px; }
79+
.do-badge img { width: 100%; border-radius: 8px; }
80+
81+
.main-content { min-width: 0; }
15482

155-
@media (max-width: 768px) {
156-
.navbar { flex-direction: column; gap: 20px; padding: 20px; }
157-
.container { padding: 20px; }
158-
footer { flex-direction: column; gap: 20px; text-align: center; }
159-
.footer-links { justify-content: center; }
83+
/* RWD */
84+
@media (max-width: 1024px) {
85+
.grid-container { display: flex; flex-direction: column; }
86+
.left-sidebar { position: relative; top: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
87+
.navbar { display: flex; flex-direction: column; padding: 15px 20px; gap: 15px; }
88+
.nav-center { flex-wrap: wrap; gap: 12px; justify-content: center; }
89+
.dashboard { padding: 20px; }
16090
}
16191
</style>
16292
</head>
16393
<body>
16494

16595
<nav class="navbar">
166-
<a href="/" class="logo">
167-
<svg viewBox="0 0 24 24" fill="none" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
168-
<polyline points="4 17 10 11 4 5"></polyline>
169-
<line x1="12" y1="19" x2="20" y2="19"></line>
170-
</svg>
171-
DEVLABSTUDY
172-
</a>
173-
<div class="nav-links">
96+
<div class="nav-left">
97+
<a href="/" class="nav-brand">
98+
<svg viewBox="0 0 24 24" fill="none" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
99+
<polyline points="4 17 10 11 4 5"></polyline>
100+
<line x1="12" y1="19" x2="20" y2="19"></line>
101+
</svg>
102+
DEVLABSTUDY
103+
</a>
104+
</div>
105+
<div class="nav-center">
174106
<a href="/" {% if page.url == "/" %}class="active"{% endif %}>Hub</a>
175107
<a href="/blog" {% if page.url contains "blog" %}class="active"{% endif %}>Blog</a>
176-
<a href="/homelab" {% if page.url contains "homelab" %}class="active"{% endif %}>Homelab</a>
177-
<a href="/apps" {% if page.url contains "apps" %}class="active"{% endif %}>Aplikacje</a>
108+
<a href="/homelab" {% if page.url contains "homelab" %}class="active"{% endif %}>HomeLab</a>
109+
<a href="/sponsors" {% if page.url contains "sponsors" %}class="active"{% endif %}>Sponsors</a>
110+
<a href="/apps" {% if page.url contains "apps" %}class="active"{% endif %}>Apps</a>
178111
<a href="/kontakt" {% if page.url contains "kontakt" %}class="active"{% endif %}>Kontakt</a>
179112
</div>
113+
<div class="nav-right">
114+
<div class="dropdown">
115+
<button class="dropbtn">Community ▾</button>
116+
<div class="dropdown-content">
117+
<div class="dropdown-links-wrapper">
118+
<a href="https://github.com/DevLabStudy" target="_blank">GitHub <span>↗</span></a>
119+
<a href="https://www.youtube.com/channel/UCisFPSU_Y8hznpqrcewcJAg" target="_blank">DevLab YT <span>↗</span></a>
120+
<a href="https://www.youtube.com/channel/UCaTfVaE8Pb95CZvblqjNheA" target="_blank">PC Hub YT <span>↗</span></a>
121+
<a href="https://discord.gg/uwUTgEQcwj" target="_blank">Discord <span>↗</span></a>
122+
<a href="https://www.tiktok.com/@devlabstudy_official" target="_blank">TikTok <span>↗</span></a>
123+
<a href="https://www.reddit.com/user/TobiMessi201/" target="_blank">Reddit <span>↗</span></a>
124+
<a href="https://x.com/DevLabStudy" target="_blank">X/Twitter <span>↗</span></a>
125+
<a href="https://www.instagram.com/devlabstudy" target="_blank">Instagram <span>↗</span></a>
126+
<a href="https://pl.pinterest.com/DevLabStudy_Official/" target="_blank">Pinterest <span>↗</span></a>
127+
<a href="https://www.facebook.com/devlabstudy" target="_blank">Fanpage <span>↗</span></a>
128+
<a href="https://www.linkedin.com/in/tobiaszkajzer" target="_blank">LinkedIn <span>↗</span></a>
129+
</div>
130+
</div>
131+
</div>
132+
</div>
180133
</nav>
181134

182-
<main class="container">
183-
{{ content }}
135+
<main class="dashboard">
136+
<div class="grid-container">
137+
<aside class="left-sidebar">
138+
<div class="card vinted-card">
139+
<h3 style="font-size: 0.8rem; color: #00bfb2; margin: 0 0 10px 0; text-transform: uppercase; font-family: 'JetBrains Mono', monospace;">Marketplace:</h3>
140+
<a href="https://www.vinted.pl/member/306118036" target="_blank" class="support-btn" style="background: #00bfb2; color: #fff;">VINTED</a>
141+
<a href="#" target="_blank" class="support-btn" style="background: #002f34; border: 1px solid #23e5db; color: #fff;">OLX</a>
142+
<a href="https://allegrolokalnie.pl/uzytkownik/Client:137881965" target="_blank" class="support-btn" style="background: #ff5a00; color: #fff;">ALLEGRO LOKALNIE</a>
143+
</div>
144+
145+
<div class="card" style="border-color: var(--accent-blue); background: rgba(59, 130, 246, 0.05);">
146+
<h3 style="font-size: 0.8rem; color: var(--accent-blue); margin: 0 0 10px 0; text-transform: uppercase; font-family: 'JetBrains Mono', monospace;">Support:</h3>
147+
<a href="https://patreon.com/DevLabStudy" target="_blank" class="support-btn" style="background: #e11d48; color: #fff;">PATREON</a>
148+
<a href="https://www.digitalocean.com/?refcode=6fd6e2226432" class="do-badge" target="_blank"><img src="https://web-platforms.sfo2.cdn.digitaloceanspaces.com/WWW/Badge%201.svg" /></a>
149+
<a href="https://www.buymeacoffee.com/DevLabStudy" target="_blank" class="support-btn" style="background: #FFDD00; color: #000;">BUY ME A COFFEE</a>
150+
</div>
151+
</aside>
152+
153+
<section class="main-content">
154+
{{ content }}
155+
</section>
156+
</div>
184157
</main>
185158

186-
<footer>
187-
<div>// SYSTEM_ARCHIVE_2026 — Tobiasz Kajzer</div>
188-
<div class="footer-links">
189-
<a href="/polityka-prywatnosci">Polityka Prywatności</a>
190-
<a href="/regulamin">Regulamin</a>
191-
<a href="/kontakt">Kontakt</a>
159+
<footer style="max-width: 1300px; margin: 60px auto 40px auto; padding: 0 40px; width: 100%; box-sizing: border-box;">
160+
<div class="card" style="border-style: dashed; text-align: center; padding: 30px; background: rgba(10, 15, 25, 0.4);">
161+
<h3 style="font-size: 0.8rem; color: var(--text-muted); margin-bottom: 20px; text-transform: uppercase; font-family: 'JetBrains Mono', monospace;">[ Communication_Channels ]</h3>
162+
<div style="display: flex; flex-wrap: wrap; justify-content: center; gap: 40px;">
163+
<div style="text-align: center;">
164+
<div style="font-size: 0.7rem; color: var(--text-muted); margin-bottom: 5px; font-family: 'JetBrains Mono', monospace;">BUSINESS / COLLABORATION</div>
165+
<a href="mailto:contact@devlabstudy.ovh" style="color: #fff; font-weight: 700; text-decoration: none; border-bottom: 2px solid var(--accent-blue); font-family: 'JetBrains Mono', monospace; font-size: 0.85rem;">contact@devlabstudy.ovh</a>
166+
</div>
167+
<div style="text-align: center;">
168+
<div style="font-size: 0.7rem; color: var(--text-muted); margin-bottom: 5px; font-family: 'JetBrains Mono', monospace;">COMMUNITY / SUPPORT</div>
169+
<a href="mailto:widzowie@devlabstudy.ovh" style="color: #fff; font-weight: 700; text-decoration: none; border-bottom: 2px solid #64748b; font-family: 'JetBrains Mono', monospace; font-size: 0.85rem;">widzowie@devlabstudy.ovh</a>
170+
</div>
171+
<div style="text-align: center;">
172+
<div style="font-size: 0.7rem; color: var(--text-muted); margin-bottom: 5px; font-family: 'JetBrains Mono', monospace;">BUG REPORTING / APPS</div>
173+
<a href="mailto:bledy@devlabstudy.ovh" style="color: #fff; font-weight: 700; text-decoration: none; border-bottom: 2px solid #ef4444; font-family: 'JetBrains Mono', monospace; font-size: 0.85rem;">bledy@devlabstudy.ovh</a>
174+
</div>
175+
</div>
176+
<div style="margin-top: 30px; padding-top: 20px; border-top: 1px solid var(--border-color); display: flex; justify-content: center; gap: 20px; font-size: 0.8rem; color: var(--text-muted); font-family: 'JetBrains Mono', monospace;">
177+
<a href="/polityka-prywatnosci">Polityka Prywatności</a>
178+
<span>•</span>
179+
<a href="/regulamin">Regulamin</a>
180+
<span>•</span>
181+
<a href="/kontakt">Kontakt</a>
182+
</div>
192183
</div>
193184
</footer>
194-
195185
</body>
196186
</html>

0 commit comments

Comments
 (0)