Skip to content

Commit 61350f2

Browse files
DevLabStudyDevLabStudy
authored
Update index.html
1 parent 6f13150 commit 61350f2

1 file changed

Lines changed: 78 additions & 67 deletions

File tree

‎index.html‎

Lines changed: 78 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -3,100 +3,111 @@
33
<head>
44
<meta charset="UTF-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6-
<title>TobiMessi | Project Orbit</title>
6+
<title>TobiMessi | Infrastructure & Dev</title>
77
<style>
8+
:root {
9+
--bg: #0d1117;
10+
--card: #161b22;
11+
--border: #30363d;
12+
--text: #c9d1d9;
13+
--accent: #58a6ff;
14+
--yellow: #f0e042;
15+
}
816
body {
9-
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
10-
background-color: #0d1117;
11-
color: #c9d1d9;
17+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
18+
background-color: var(--bg);
19+
color: var(--text);
1220
margin: 0;
1321
display: flex;
14-
flex-direction: column;
15-
align-items: center;
22+
justify-content: center;
23+
padding: 40px 20px;
1624
}
17-
/* Baner z Patreona */
18-
.hero-banner {
25+
.wrapper {
26+
max-width: 600px;
1927
width: 100%;
20-
max-width: 1000px;
21-
height: auto;
22-
border-bottom: 2px solid #30363d;
2328
}
24-
.container {
25-
max-width: 650px;
26-
width: 90%;
29+
.profile-header {
2730
text-align: center;
28-
padding: 20px;
31+
margin-bottom: 40px;
2932
}
30-
.tech-stack {
31-
background: #161b22;
32-
padding: 20px;
33-
border-radius: 10px;
34-
border: 1px solid #30363d;
35-
margin: 20px 0;
36-
text-align: left;
33+
.profile-header h1 {
34+
font-size: 2rem;
35+
margin-bottom: 5px;
36+
color: var(--accent);
3737
}
38-
.sponsor-section {
39-
background: #21262d;
40-
padding: 20px;
41-
border-radius: 15px;
42-
border: 1px solid #FFDD00;
43-
margin-top: 10px;
38+
.card {
39+
background: var(--card);
40+
border: 1px solid var(--border);
41+
border-radius: 12px;
42+
padding: 24px;
43+
margin-bottom: 20px;
44+
transition: transform 0.2s;
4445
}
45-
.iframe-container {
46-
margin: 15px 0;
47-
overflow: hidden;
48-
border-radius: 8px;
49-
}
50-
/* Twój kod QR */
51-
.qr-image {
52-
width: 150px;
53-
height: auto;
54-
border-radius: 10px;
55-
border: 2px solid #30363d;
56-
margin-top: 10px;
46+
.card:hover { border-color: #8b949e; }
47+
.card h2 { margin-top: 0; font-size: 1.2rem; color: var(--accent); }
48+
.card p { line-height: 1.6; font-size: 0.95rem; color: #8b949e; }
49+
50+
.grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
51+
.status-dot { height: 10px; width: 10px; background-color: #238636; border-radius: 50%; display: inline-block; margin-right: 5px; }
52+
53+
/* Styl dla przycisków wsparcia */
54+
.sponsor-grid {
55+
display: flex;
56+
flex-direction: column;
57+
gap: 15px;
58+
align-items: center;
59+
margin-top: 20px;
5760
}
58-
h1 { color: #58a6ff; margin-top: 30px; }
59-
strong { color: #FFDD00; }
60-
iframe { max-width: 100%; }
61+
.mini-qr { width: 100px; opacity: 0.7; transition: 0.3s; }
62+
.mini-qr:hover { opacity: 1; }
63+
64+
iframe { border-radius: 12px; }
6165
</style>
6266
</head>
6367
<body>
6468

65-
<img src="banner.png" alt="TobiMessi Support Banner" class="hero-banner">
69+
<div class="wrapper">
70+
<div class="profile-header">
71+
<h1>TobiMessi</h1>
72+
<p>Full-stack Dev • Self-Hosting Enthusiast • Creator of Orbit</p>
73+
</div>
6674

67-
<div class="container">
68-
<h1>TobiMessi</h1>
69-
70-
<div class="tech-stack">
71-
<h3>Project Orbit & Infrastructure</h3>
72-
<p>Managing a production cluster on <strong>HP Enterprise</strong> and <strong>Asus</strong> hardware. Optimized for Docker orchestration and high-speed fiber networking.</p>
75+
<div class="card">
76+
<h2>About Me & My Projects</h2>
77+
<p>I'm a developer building <strong>Project Orbit</strong>, a lightweight container management tool. I focus on automation and high-performance server architecture.</p>
7378
</div>
7479

75-
<div class="sponsor-section">
76-
<h2>Official Support Links</h2>
77-
78-
<div class="iframe-container">
79-
<iframe src="https://github.com/sponsors/TobiMessi/card" title="Sponsor TobiMessi" height="225" width="600" style="border: 0;"></iframe>
80+
<div class="grid">
81+
<div class="card">
82+
<h2><span class="status-dot"></span> HP Server</h2>
83+
<p style="font-size: 0.8rem;">Production Node. Docker & Orbit environment.</p>
8084
</div>
81-
82-
<div class="iframe-container">
83-
<iframe src="https://github.com/sponsors/TobiMessi/button" title="Sponsor TobiMessi" height="32" width="114" style="border: 0; border-radius: 6px;"></iframe>
85+
<div class="card">
86+
<h2><span class="status-dot"></span> Asus Node</h2>
87+
<p style="font-size: 0.8rem;">Monitoring & RSS services. 24/7 uptime.</p>
8488
</div>
89+
</div>
8590

86-
<div style="margin-top: 20px;">
91+
<div class="card">
92+
<h2>Support the Infrastructure</h2>
93+
<p>All contributions help maintain the 24/7 home-lab and electricity costs for Project Orbit development.</p>
94+
95+
<div class="sponsor-grid">
96+
<iframe src="https://github.com/sponsors/TobiMessi/button" title="Sponsor TobiMessi" height="32" width="114" style="border: 0;"></iframe>
97+
8798
<script type="text/javascript" src="https://cdnjs.buymeacoffee.com/1.0.0/button.prod.min.js" data-name="bmc-button" data-slug="TobiK0" data-color="#FFDD00" data-emoji="" data-font="Cookie" data-text="Buy me a coffee" data-outline-color="#000000" data-font-color="#000000" data-coffee-color="#ffffff" ></script>
88-
</div>
89-
90-
<div style="margin-top: 25px;">
91-
<p style="font-size: 0.9em; color: #8b949e;">Scan to support via Mobile:</p>
92-
<img src="qr-code.png" alt="Support QR Code" class="qr-image">
99+
100+
<p style="font-size: 0.8rem; margin-bottom: 5px;">Or scan for mobile support:</p>
101+
<img src="qr-code.png" class="mini-qr" alt="QR">
93102
</div>
94103
</div>
95104

96-
<p style="margin-top: 40px; font-size: 0.8em; color: #8b949e;">
97-
Hosted on GitHub Pages | Infrastructure powered by HP Enterprise hardware
98-
</p>
105+
<footer style="text-align: center; font-size: 0.8rem; color: #484f58; margin-top: 20px;">
106+
<p>1 Gbps Fiber • Linux/Docker • JetBrains IDE</p>
107+
</footer>
99108
</div>
100109

101110
</body>
102111
</html>
112+
</body>
113+
</html>

0 commit comments

Comments
 (0)