Skip to content

Commit 948ea16

Browse files
mskrasnovmskrasnov
committed
Large-scale redesign of the website
1 parent c445b0f commit 948ea16

File tree

13 files changed

+1255
-340
lines changed

13 files changed

+1255
-340
lines changed

‎assets/logo.png

-103 KB
Loading

‎clock.svg

Lines changed: 23 additions & 0 deletions
Loading

‎css/donate.css

Lines changed: 94 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,94 @@
1+
.support-page {
2+
max-width: 800px;
3+
margin: 0 auto;
4+
padding: 2rem;
5+
}
6+
7+
.support-hero {
8+
text-align: center;
9+
margin-bottom: 3rem;
10+
}
11+
12+
.support-hero h1 {
13+
color: var(--yellow);
14+
font-size: 2.2rem;
15+
margin-bottom: 1.5rem;
16+
}
17+
18+
.support-hero p {
19+
font-size: 1.1rem;
20+
line-height: 1.8;
21+
color: var(--fg-dim);
22+
}
23+
24+
.donation-section {
25+
background-color: var(--bg);
26+
padding: 2rem;
27+
border-radius: 10px;
28+
border: 1px solid var(--bg-light);
29+
margin-bottom: 3rem;
30+
}
31+
32+
.donation-section h2 {
33+
color: var(--yellow);
34+
margin-top: 0;
35+
margin-bottom: 1.5rem;
36+
text-align: center;
37+
}
38+
39+
.donation-methods {
40+
display: grid;
41+
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
42+
gap: 1.5rem;
43+
}
44+
45+
.donation-method {
46+
background-color: var(--bg-light);
47+
padding: 1.5rem;
48+
border-radius: 8px;
49+
border: 1px solid var(--bg);
50+
}
51+
52+
.donation-method h3 {
53+
color: var(--yellow);
54+
margin-top: 0;
55+
margin-bottom: 1rem;
56+
display: flex;
57+
align-items: center;
58+
gap: 0.5rem;
59+
}
60+
61+
.donation-method p {
62+
color: var(--fg-dim);
63+
margin-bottom: 1.5rem;
64+
}
65+
66+
.donation-number {
67+
font-family: monospace;
68+
font-size: 1.3rem;
69+
background-color: var(--bg-dark);
70+
padding: 0.8rem 1rem;
71+
border-radius: 6px;
72+
border: 1px solid var(--yellow);
73+
color: var(--yellow);
74+
text-align: center;
75+
margin: 1rem 0;
76+
word-break: break-all;
77+
}
78+
79+
.note {
80+
font-size: 0.9rem;
81+
color: var(--fg-dim);
82+
text-align: center;
83+
margin-top: 2rem;
84+
}
85+
86+
@media (max-width: 768px) {
87+
.support-page {
88+
padding: 1rem;
89+
}
90+
91+
.donation-methods {
92+
grid-template-columns: 1fr;
93+
}
94+
}

‎css/download.css

Lines changed: 204 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,204 @@
1+
.download-page {
2+
padding: 2rem 0;
3+
}
4+
5+
.download-hero {
6+
position: relative;
7+
max-width: 900px;
8+
margin: 0 auto 3rem;
9+
padding: 2rem;
10+
background-color: var(--bg);
11+
border-radius: 10px;
12+
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
13+
border: 1px solid var(--bg-light);
14+
overflow: hidden;
15+
z-index: 1;
16+
}
17+
18+
.download-hero::before {
19+
content: "";
20+
position: absolute;
21+
top: 0;
22+
left: 0;
23+
right: 0;
24+
height: 4px;
25+
background: linear-gradient(90deg, var(--yellow), var(--orange));
26+
z-index: 2;
27+
}
28+
29+
.download-hero::after {
30+
content: "";
31+
position: absolute;
32+
bottom: 0;
33+
right: 0;
34+
width: 300px;
35+
height: 300px;
36+
background-image: url('clock.svg');
37+
background-repeat: no-repeat;
38+
background-position: bottom right;
39+
background-size: contain;
40+
z-index: -1;
41+
}
42+
43+
.download-hero h1 {
44+
color: var(--yellow);
45+
text-align: center;
46+
margin-bottom: 1.5rem;
47+
font-size: 2rem;
48+
position: relative;
49+
z-index: 3;
50+
}
51+
52+
.download-buttons {
53+
display: flex;
54+
justify-content: center;
55+
gap: 1rem;
56+
flex-wrap: wrap;
57+
margin: 2rem 0;
58+
position: relative;
59+
z-index: 3;
60+
}
61+
62+
.download-btn {
63+
display: inline-flex;
64+
align-items: center;
65+
justify-content: center;
66+
padding: 0.8rem 1.8rem;
67+
background-color: var(--blue);
68+
color: white;
69+
text-decoration: none;
70+
border-radius: 6px;
71+
font-weight: 600;
72+
font-size: 1rem;
73+
transition: all 0.3s ease;
74+
min-width: 220px;
75+
}
76+
77+
.download-btn:hover {
78+
background-color: #5a9b9b;
79+
transform: translateY(-2px);
80+
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
81+
}
82+
83+
.download-btn i {
84+
margin-right: 0.5rem;
85+
font-size: 1.2rem;
86+
}
87+
88+
.alternative-downloads {
89+
margin-top: 2rem;
90+
text-align: center;
91+
position: relative;
92+
z-index: 3;
93+
}
94+
95+
.alternative-downloads p {
96+
color: var(--fg-dim);
97+
margin-bottom: 1rem;
98+
}
99+
100+
.secondary-btn {
101+
background-color: var(--bg-light);
102+
color: var(--fg);
103+
}
104+
105+
.secondary-btn:hover {
106+
background-color: var(--bg);
107+
}
108+
109+
.info-columns {
110+
display: flex;
111+
gap: 2rem;
112+
max-width: 1200px;
113+
margin: 0 auto;
114+
padding: 0 2rem;
115+
}
116+
117+
.column {
118+
flex: 1;
119+
background-color: var(--bg);
120+
padding: 1.5rem;
121+
border-radius: 8px;
122+
border: 1px solid var(--bg-light);
123+
}
124+
125+
.column h2 {
126+
color: var(--yellow);
127+
margin-top: 0;
128+
margin-bottom: 1.5rem;
129+
font-size: 1.5rem;
130+
padding-bottom: 0.5rem;
131+
border-bottom: 1px solid var(--bg-light);
132+
}
133+
134+
.requirements-list {
135+
list-style-type: none;
136+
padding-left: 0;
137+
}
138+
139+
.requirements-list li {
140+
padding: 0.8rem 0;
141+
border-bottom: 1px solid var(--bg-light);
142+
display: flex;
143+
}
144+
145+
.requirements-list li:last-child {
146+
border-bottom: none;
147+
}
148+
149+
.requirements-list strong {
150+
display: inline-block;
151+
width: 150px;
152+
color: var(--yellow);
153+
}
154+
155+
.version-list {
156+
list-style-type: none;
157+
padding-left: 0;
158+
}
159+
160+
.version-list li {
161+
padding: 0.8rem 0;
162+
border-bottom: 1px solid var(--bg-light);
163+
}
164+
165+
.version-list li:last-child {
166+
border-bottom: none;
167+
}
168+
169+
.version-list a {
170+
color: var(--blue);
171+
text-decoration: none;
172+
transition: color 0.3s;
173+
}
174+
175+
.version-list a:hover {
176+
color: #8ec07c;
177+
text-decoration: underline;
178+
}
179+
180+
.version-date {
181+
color: var(--fg-dim);
182+
font-size: 0.9rem;
183+
margin-left: 0.5rem;
184+
}
185+
186+
@media (max-width: 768px) {
187+
.info-columns {
188+
flex-direction: column;
189+
}
190+
191+
.download-buttons {
192+
flex-direction: column;
193+
align-items: center;
194+
}
195+
196+
.requirements-list li {
197+
flex-direction: column;
198+
}
199+
200+
.requirements-list strong {
201+
width: auto;
202+
margin-bottom: 0.3rem;
203+
}
204+
}

0 commit comments

Comments
 (0)