Skip to content

Commit 965850c

Browse files
RainyXeonRainyXeon
committed
add: org history section
1 parent fd225ab commit 965850c

4 files changed

Lines changed: 159 additions & 13 deletions

File tree

‎css/navbar.css‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,24 +2,23 @@ nav-constructor {
22
display: flex;
33
align-items: center;
44
position: fixed;
5-
top: 0;
6-
left: 30px;
5+
top: 30px;
6+
left: 40px;
77
right: 0;
88
}
99

1010
nav {
1111
background: rgba(28, 28, 28, 0.7);
1212
border-radius: 40px;
1313
display: flex;
14-
margin-top: 20px;
1514
align-items: center;
1615
justify-content: space-between;
1716
backdrop-filter: blur(10px);
1817
}
1918

2019
nav-item {
2120
margin: 10px;
22-
padding: 12px;
21+
padding: 13px;
2322
border-radius: 30px;
2423
cursor: pointer;
2524
background-color: var(--dim-bright);
@@ -48,6 +47,14 @@ nav-item[logo-checked] {
4847
}
4948

5049
@media (max-width: 1000px) {
50+
nav-constructor {
51+
display: flex;
52+
align-items: center;
53+
position: fixed;
54+
top: 20px;
55+
left: 30px;
56+
right: 0;
57+
}
5158
#nav-button {
5259
display: none;
5360
}

‎index.css‎

Lines changed: 83 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
#home {
55
display: block;
66
height: 100vh;
7+
margin-left: 50px;
78
}
89

910
hero-section {
@@ -13,8 +14,8 @@ hero-section {
1314
}
1415

1516
hero-content {
16-
width: 50%;
17-
margin-left: 40px;
17+
width: 55%;
18+
margin-left: 10px;
1819
}
1920

2021
footer {
@@ -26,16 +27,93 @@ footer {
2627
}
2728

2829
.hero-header {
29-
font-size: 50px;
30+
font-size: 60px;
3031
margin-bottom: 20px;
3132
letter-spacing: -0.02em;
3233
}
3334

35+
#history {
36+
display: block;
37+
margin-left: 50px;
38+
margin-top: 50px;
39+
margin-bottom: 50px;
40+
}
41+
42+
timeline {
43+
display: flex;
44+
flex-direction: column;
45+
border-left: 5px solid var(--font);
46+
margin-left: 30px;
47+
width: fit-content;
48+
margin-bottom: 50px;
49+
}
50+
51+
timeline-part {
52+
display: flex;
53+
flex-direction: column;
54+
55+
margin-left: 30px;
56+
margin-top: 30px;
57+
margin-bottom: 30px;
58+
}
59+
60+
timeline-part-header {
61+
font-size: 30px;
62+
font-weight: bold;
63+
margin-bottom: 10px;
64+
}
65+
66+
timeline-part-desc {
67+
font-size: 18px;
68+
margin-bottom: 10px;
69+
}
70+
71+
timeline-part-desc ul {
72+
margin-top: 10px;
73+
margin-bottom: 10px;
74+
padding-left: 20px;
75+
}
76+
77+
timeline-part-desc li {
78+
margin-top: 3px;
79+
margin-bottom: 3px;
80+
}
81+
82+
timeline-part-desc a:link,
83+
timeline-part-desc a:visited,
84+
timeline-part-desc a:hover,
85+
timeline-part-desc a:active {
86+
text-decoration: underline;
87+
}
88+
89+
hero-content[type="history"] {
90+
width: 70%
91+
}
92+
3493
@media (max-width: 1000px) {
3594
hero-content {
3695
width: 100%;
37-
margin-left: 40px;
38-
margin-right: 40px;
96+
margin-left: 0px;
97+
margin-right: 0px;
98+
}
99+
100+
hero-content[type="history"] {
101+
width: 100%
102+
}
103+
104+
#history {
105+
display: block;
106+
margin-left: 30px;
107+
margin-right: 30px;
108+
margin-top: 50px;
109+
margin-bottom: 50px;
110+
}
111+
112+
#home {
113+
display: block;
114+
height: 100vh;
115+
margin-left: 30px;
116+
margin-right: 30px;
39117
}
40118

41119
.hero-header {

‎index.html‎

Lines changed: 64 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<!-- INFO: Metadata -->
55
<meta charset="UTF-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7-
<title>ALPHA | PerfomanC</title>
7+
<title>PerfomanC</title>
88
<meta name="description" content="Working for the best of the future">
99
<meta name="robots" content="index, follow">
1010
<meta http-equiv="content-language" content="en">
@@ -74,7 +74,7 @@
7474
<hero-section>
7575
<hero-content>
7676
<h1 class="hero-header">Workforce towards the commonwealth</h1>
77-
<p style="font-size: 20px;">
77+
<p style="font-size: 22px;">
7878
Empowering a workforce for the commonwealth,
7979
we build systems rooted in transparency, trust, and shared purpose.
8080
By opening access and fostering accountability,
@@ -84,6 +84,68 @@ <h1 class="hero-header">Workforce towards the commonwealth</h1>
8484
</hero-section>
8585
</div>
8686

87+
<div id="history">
88+
<hero-section>
89+
<hero-content type="history">
90+
<h1 class="hero-header" style="font-size: 50px;">Our History</h1>
91+
<timeline>
92+
<timeline-part style="margin-top: 15px;">
93+
<timeline-part-header>2022 — Foundation</timeline-part-header>
94+
<timeline-part-desc>
95+
Born in the aftermath of the COVID-19 pandemic, The PerformanC Organization (TPO) was established with a clear vision:
96+
to build and publish high-quality software that prioritizes performance, efficiency, and minimal resource usage.
97+
</timeline-part-desc>
98+
<timeline-part-desc>
99+
From the very beginning, the organization committed to something deeper than just code,
100+
transparency, and accountability at every step of development.
101+
</timeline-part-desc>
102+
</timeline-part>
103+
104+
<timeline-part>
105+
<timeline-part-header>First Release — CogLink</timeline-part-header>
106+
<timeline-part-desc>The first project released under the organization marked its technical direction.</timeline-part-desc>
107+
<timeline-part-desc>
108+
CogLink, a LavaLink client written in C99, became the foundation of PerformanC’s identity—
109+
lean, efficient, and engineered with precision.
110+
</timeline-part-desc>
111+
</timeline-part>
112+
113+
<timeline-part>
114+
<timeline-part-header>Growth — Expanding the Ecosystem</timeline-part-header>
115+
<timeline-part-desc>As time progressed, PerformanC continued to grow beyond its initial scope.</timeline-part-desc>
116+
<timeline-part-desc>More projects were developed and released, each carrying the same philosophy:</timeline-part-desc>
117+
<timeline-part-desc>
118+
<ul>
119+
<li>performance-first design</li>
120+
<li>clean and reliable implementation</li>
121+
<li>practical value for real-world use</li>
122+
</ul>
123+
</timeline-part-desc>
124+
<timeline-part-desc>
125+
Some of these projects began gaining traction, gradually building recognition within the community.
126+
</timeline-part-desc>
127+
</timeline-part>
128+
129+
<timeline-part style="margin-bottom: 0;">
130+
<timeline-part-header>Today — A Global Effort</timeline-part-header>
131+
<timeline-part-desc>Today, PerformanC stands as a collaborative effort formed by:</timeline-part-desc>
132+
<timeline-part-desc>
133+
<a href="https://github.com/1Lucas1apk" target="_blank">Lucas</a>,
134+
<a href="https://deeplunaria.pages.dev/rainyxeon/" target="_blank">Rainy</a>,
135+
<a href="https://github.com/TehPig" target="_blank">TehPig</a>,
136+
<a href="https://github.com/ThePedroo" target="_blank">ThePedroo</a>, and
137+
<a href="https://github.com/TheToddyn" target="_blank">Nicolas</a>
138+
</timeline-part-desc>
139+
<timeline-part-desc>
140+
With 10+ active projects, the organization delivers high-standard
141+
software used by individuals and other projects across the globe.
142+
</timeline-part-desc>
143+
</timeline-part>
144+
</timeline>
145+
</hero-content>
146+
</hero-section>
147+
</div>
148+
87149
<footer>
88150
<a id="copyright_notice" href="/LICENSE" target="_blank"></a>
89151
<br>

‎index.js‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,14 +5,13 @@ copyright_notice_element.innerHTML = `© ${year} PerformanC Website — Licensed
55

66
// INFO: Mobile Menu Handler
77
let isOpen = false
8-
const mobileQuery = window.matchMedia('(max-width: 1000px)');
98

109
const nav_brand_button = document.getElementById('nav-brand')
1110
const menu_close_button = document.getElementById('menu-close-button')
1211
const menu = document.getElementById('menu')
1312

1413
nav_brand_button.addEventListener('click', () => {
15-
if (!mobileQuery.matches) return;
14+
if (!window.matchMedia('(max-width: 1000px)').matches) return;
1615
if (!isOpen) {
1716
menu.classList.add('open')
1817
isOpen = true

0 commit comments

Comments
 (0)