Skip to content

Commit a7a684b

Browse files
init: Add initial website structure with navigation, sections, and styling
1 parent 6e30000 commit a7a684b

4 files changed

Lines changed: 814 additions & 72 deletions

File tree

README.md

Lines changed: 0 additions & 72 deletions
This file was deleted.

index.html

Lines changed: 288 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1 +1,289 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
13

4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>WebBro Software - Open Source Innovation</title>
8+
<meta name="description"
9+
content="WebBro Software - Open-source initiative developing tools, libraries, games, and developer utilities. Building creative software solutions for developers worldwide.">
10+
<meta name="author" content="WebBro Software">
11+
<meta name="keywords"
12+
content="open source, software development, tools, libraries, games, developer utilities, WebBro">
13+
14+
<meta property="og:title" content="WebBro Software - Open Source Innovation">
15+
<meta property="og:description"
16+
content="Open-source initiative developing tools, libraries, games, and developer utilities for developers worldwide.">
17+
<meta property="og:type" content="website">
18+
19+
<link rel="stylesheet" href="styles.css">
20+
21+
<link rel="preconnect" href="https://fonts.googleapis.com">
22+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
23+
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap"
24+
rel="stylesheet">
25+
26+
</head>
27+
28+
<body>
29+
<nav class="navbar" id="navbar">
30+
<div class="navbar-container">
31+
<a href="#" class="logo">Webbro</a>
32+
<a href="https://github.com/webbro-software" target="_blank" rel="noopener noreferrer" class="github-btn">
33+
<span class="icon-github"></span>
34+
<span>GitHub</span>
35+
</a>
36+
</div>
37+
</nav>
38+
39+
<section class="hero">
40+
<div class="hero-content">
41+
<h1>Webbro</h1>
42+
<h2>Software</h2>
43+
<p>
44+
Open-source initiative developing tools, libraries, games, and developer utilities.
45+
Building a strong ecosystem of creative software solutions.
46+
</p>
47+
<p class="hero-quote">
48+
"We don't just code for work. We code for soul."
49+
</p>
50+
</div>
51+
<div class="scroll-indicator">
52+
<span class="icon-arrow-down"></span>
53+
</div>
54+
</section>
55+
56+
<section class="section">
57+
<div class="section-title">
58+
<h2>Featured Projects</h2>
59+
</div>
60+
<div class="grid grid-3">
61+
<div class="card">
62+
<span class="card-icon">🤖</span>
63+
<h3>brofs</h3>
64+
<p class="card-description">The Bro File System CLI</p>
65+
<p class="card-detail">A minimalist file system CLI for developers. Super fast, clean, and open-source.
66+
</p>
67+
<a href="https://github.com/webbro-software/brofs" target="_blank" rel="noopener noreferrer"
68+
class="card-link">
69+
<span class="icon-github"></span>
70+
<span>View Project</span>
71+
<span class="icon-external"></span>
72+
</a>
73+
</div>
74+
75+
<div class="card">
76+
<span class="card-icon">🎨</span>
77+
<h3>uzcss</h3>
78+
<p class="card-description">Uzbek-to-CSS Compiler</p>
79+
<p class="card-detail">Write your styles in Uzbek! A unique compiler translating Uzbek syntax to valid
80+
CSS.</p>
81+
<a href="https://github.com/webbro-software/uzcss" target="_blank" rel="noopener noreferrer"
82+
class="card-link">
83+
<span class="icon-github"></span>
84+
<span>View Project</span>
85+
<span class="icon-external"></span>
86+
</a>
87+
</div>
88+
89+
<div class="card">
90+
<span class="card-icon">🧠</span>
91+
<h3>brainfuck-interpreter</h3>
92+
<p class="card-description">Interpreter for Brainfuck language in C#</p>
93+
<p class="card-detail">For minimalism lovers and low-level explorers.</p>
94+
<a href="https://github.com/webbro-software/brainfuck-interpreter" target="_blank"
95+
rel="noopener noreferrer" class="card-link">
96+
<span class="icon-github"></span>
97+
<span>View Project</span>
98+
<span class="icon-external"></span>
99+
</a>
100+
</div>
101+
102+
<div class="card">
103+
<span class="card-icon">🔊</span>
104+
<h3>easy_speak</h3>
105+
<p class="card-description">Powerful text-to-speech conversion for Python</p>
106+
<p class="card-detail">Simple yet powerful TTS for Python apps.</p>
107+
<a href="https://github.com/webbro-software/easy_speak" target="_blank" rel="noopener noreferrer"
108+
class="card-link">
109+
<span class="icon-github"></span>
110+
<span>View Project</span>
111+
<span class="icon-external"></span>
112+
</a>
113+
</div>
114+
115+
<div class="card">
116+
<span class="card-icon">🎮</span>
117+
<h3>kill-the-monsters-3d</h3>
118+
<p class="card-description">A 3D monster-killing desktop game built with Python</p>
119+
<p class="card-detail">Action-packed 3D gaming experience.</p>
120+
<a href="https://github.com/webbro-software/kill-the-monsters-3d" target="_blank"
121+
rel="noopener noreferrer" class="card-link">
122+
<span class="icon-github"></span>
123+
<span>View Project</span>
124+
<span class="icon-external"></span>
125+
</a>
126+
</div>
127+
</div>
128+
</section>
129+
130+
<section class="section section-gray">
131+
<div class="section-title">
132+
<h2>Developer Utilities</h2>
133+
</div>
134+
<div class="grid grid-3">
135+
<div class="card">
136+
<h3>styled_print</h3>
137+
<p class="card-detail">Terminal text styling for Python</p>
138+
<a href="https://github.com/webbro-software/styled_print" target="_blank" rel="noopener noreferrer"
139+
class="card-link">
140+
<span class="icon-github"></span>
141+
<span>View on GitHub</span>
142+
<span class="icon-external"></span>
143+
</a>
144+
</div>
145+
146+
<div class="card">
147+
<h3>styled-console</h3>
148+
<p class="card-detail">Styled console logger for JavaScript</p>
149+
<a href="https://github.com/webbro-software/styled-console" target="_blank" rel="noopener noreferrer"
150+
class="card-link">
151+
<span class="icon-github"></span>
152+
<span>View on GitHub</span>
153+
<span class="icon-external"></span>
154+
</a>
155+
</div>
156+
157+
<div class="card">
158+
<h3>gcd-calculator</h3>
159+
<p class="card-detail">Simple GCD calculator in Python</p>
160+
<a href="https://github.com/webbro-software/gcd-calculator" target="_blank" rel="noopener noreferrer"
161+
class="card-link">
162+
<span class="icon-github"></span>
163+
<span>View on GitHub</span>
164+
<span class="icon-external"></span>
165+
</a>
166+
</div>
167+
</div>
168+
</section>
169+
170+
<section class="section">
171+
<div class="section-title">
172+
<h2>Experiments & Research</h2>
173+
</div>
174+
<div class="grid grid-4">
175+
<div class="card">
176+
<h3>nitrovim</h3>
177+
<p class="card-detail">VIM setup in Lua for fast dev</p>
178+
<a href="https://github.com/webbro-software/nitrovim" target="_blank" rel="noopener noreferrer"
179+
class="card-link">
180+
<span class="icon-github"></span>
181+
<span>Explore</span>
182+
<span class="icon-external"></span>
183+
</a>
184+
</div>
185+
186+
<div class="card">
187+
<h3>simple-translate</h3>
188+
<p class="card-detail">Multilingual translator for Python</p>
189+
<a href="https://github.com/webbro-software/simple-translate" target="_blank" rel="noopener noreferrer"
190+
class="card-link">
191+
<span class="icon-github"></span>
192+
<span>Explore</span>
193+
<span class="icon-external"></span>
194+
</a>
195+
</div>
196+
197+
<div class="card">
198+
<h3>voice-js</h3>
199+
<p class="card-detail">Web Speech API abstraction</p>
200+
<a href="https://github.com/webbro-software/voice-js" target="_blank" rel="noopener noreferrer"
201+
class="card-link">
202+
<span class="icon-github"></span>
203+
<span>Explore</span>
204+
<span class="icon-external"></span>
205+
</a>
206+
</div>
207+
208+
<div class="card">
209+
<h3>pencil_art</h3>
210+
<p class="card-detail">Convert images to sketch</p>
211+
<a href="https://github.com/webbro-software/pencil_art" target="_blank" rel="noopener noreferrer"
212+
class="card-link">
213+
<span class="icon-github"></span>
214+
<span>Explore</span>
215+
<span class="icon-external"></span>
216+
</a>
217+
</div>
218+
</div>
219+
</section>
220+
221+
<section class="vscode-section">
222+
<div class="section-title">
223+
<h2>VS Code Extensions</h2>
224+
</div>
225+
<div class="vscode-card card">
226+
<h3>uzcss-syntax</h3>
227+
<p class="card-detail">Syntax highlighting for uzcss - bringing Uzbek CSS to VS Code</p>
228+
<a href="https://github.com/webbro-software/uzcss-syntax" target="_blank" rel="noopener noreferrer"
229+
class="card-link">
230+
<span class="icon-github"></span>
231+
<span>View Extension</span>
232+
<span class="icon-external"></span>
233+
</a>
234+
</div>
235+
</section>
236+
237+
<section class="philosophy">
238+
<div class="section-title">
239+
<h2>Our Philosophy</h2>
240+
</div>
241+
<p
242+
style="font-size: 1.25rem; color: #666; margin-bottom: 3rem; max-width: 600px; margin-left: auto; margin-right: auto;">
243+
We build for the soul of development
244+
</p>
245+
246+
<div class="values-grid">
247+
<div class="value-item">
248+
<span class="value-icon">📚</span>
249+
<p class="value-text">Learning</p>
250+
</div>
251+
<div class="value-item">
252+
<span class="value-icon">💡</span>
253+
<p class="value-text">Innovation</p>
254+
</div>
255+
<div class="value-item">
256+
<span class="value-icon">💻</span>
257+
<p class="value-text">Developers</p>
258+
</div>
259+
<div class="value-item">
260+
<span class="value-icon">🎮</span>
261+
<p class="value-text">Fun</p>
262+
</div>
263+
</div>
264+
265+
<blockquote class="philosophy-quote">
266+
"We don't just code for work. We code for soul."
267+
</blockquote>
268+
</section>
269+
270+
<footer class="footer">
271+
<h3>Connect with WebBro</h3>
272+
<a href="https://github.com/webbro-software" target="_blank" rel="noopener noreferrer" class="footer-github">
273+
<span class="icon-github"></span>
274+
<span>github.com/webbro-software</span>
275+
</a>
276+
277+
<hr class="footer-divider">
278+
279+
<div class="footer-copyright">
280+
<span>© 2025 WebBro Software | Built with</span>
281+
<span class="heart"></span>
282+
<span>by developers for developers</span>
283+
</div>
284+
</footer>
285+
286+
<script src="script.js"></script>
287+
</body>
288+
289+
</html>

0 commit comments

Comments
 (0)