Skip to content

Commit 0106487

Browse files
moehreagmoehreag
authored
Merge pull request #2 from xlingyy/new_website
New background, buttons, tooltip
2 parents ca71b42 + 4f7d0fa commit 0106487

File tree

4 files changed

+197
-170
lines changed

4 files changed

+197
-170
lines changed

‎images/8.jpg‎

-73 KB
Binary file not shown.

‎images/background.png‎

609 KB
Loading

‎index.css‎

Lines changed: 195 additions & 169 deletions
Original file line numberDiff line numberDiff line change
@@ -1,175 +1,201 @@
11
html {
2-
scroll-behavior: smooth;
3-
}
4-
5-
::-webkit-scrollbar {
6-
width: 10px;
7-
}
8-
2+
scroll-behavior: smooth;
3+
}
94

10-
::-webkit-scrollbar-track {
11-
background: #3d3d3d;
12-
}
13-
14-
::-webkit-scrollbar-thumb {
15-
background: #707070;
16-
}
17-
18-
body {
19-
margin: 0px;
20-
font-family: "Fira Sans", sans-serif;
21-
}
22-
23-
.main {
24-
position: relative;
25-
align-items: center;
26-
display: flex;
27-
flex-direction: column;
28-
justify-content: center;
29-
text-align: center;
30-
display: flex;
31-
flex-direction: column;
32-
background-image: url(images/8.jpg);
33-
background-repeat: no-repeat;
34-
background-position: center;
35-
background-size: cover;
36-
min-height: 100vh;
37-
min-width: 100%;
38-
top: 0;
39-
left: 0;
40-
}
41-
42-
.main h1 {
43-
color: black;
44-
}
45-
46-
.main h3 {
47-
color: #100f0f;
48-
}
49-
50-
.main button {
51-
text-decoration: none;
52-
transition: 0.5s 5ms;
53-
font-family: sans-serif;
54-
font-size: 15px;
55-
width: 20vh;
56-
min-height: 7vh;
57-
height: 9vh;
58-
background-color: #35353f69;
59-
color: #ffffff;
60-
border: none;
61-
text-decoration: none;
62-
border: 1px black solid;
63-
border-radius: 20px;
64-
}
65-
66-
.main button:hover {
67-
background-color: #35353f;
68-
}
69-
70-
.main img {
71-
width: 10vh;
72-
}
73-
74-
.next__slide {
75-
padding: 20px;
76-
text-align: center;
77-
color: white;
78-
background-color: #121212;
79-
min-height: 60vh;
80-
}
81-
82-
.reasons {
83-
flex-wrap: wrap;
84-
gap: 20px;
85-
display: flex;
86-
justify-content: space-between;
87-
justify-content: center;
88-
text-align: center;
89-
background-color: #121212;
90-
color: white;
91-
}
92-
93-
.reason {
94-
text-decoration: none;
95-
text-align: center;
96-
width: 250px;
97-
height: 270px;
98-
border: 2px solid;
99-
border-color: #22ff88;
100-
background-color: #38384f;
101-
border-radius: 10px;
102-
padding: 20px;
103-
transition-duration: 0.5s;
104-
font-size: 16px;
105-
}
106-
107-
.reason:hover {
108-
border-color: #ff95d6;
109-
color: #ff95d6;
110-
font-size: 17.6px;
111-
height: 280px;
112-
width: 270px;
113-
margin-left: 0px;
114-
margin-right: 0px;
115-
margin-bottom: 10px;
116-
}
117-
118-
.navbar {
119-
backdrop-filter: blur(5px);
120-
z-index: 1;
121-
overflow: hidden;
122-
background-color: #00000080;
123-
position: fixed;
124-
top: 0;
125-
width: 100%;
126-
}
127-
128-
.navbar a {
129-
transition: 1s 5ms;
130-
float: left;
131-
display: block;
132-
color: #f2f2f2;
133-
text-align: center;
134-
padding: 20px;
135-
text-decoration: none;
136-
}
137-
138-
.navbar img {
139-
padding: 10px;
140-
float: left;
141-
width: 5vh;
142-
143-
}
144-
145-
.navbar a:hover {
146-
background: #ffffff90;
147-
color: black;
148-
}
149-
150-
.about {
151-
background-color: #121212;
152-
color: #ffffff;
153-
padding: 1px;
154-
text-align: center;
5+
::-webkit-scrollbar {
6+
width: 10px;
7+
}
8+
9+
::-webkit-scrollbar-track {
10+
background: #3d3d3d;
11+
}
12+
13+
::-webkit-scrollbar-thumb {
14+
background: #717171;
15+
}
16+
17+
body {
18+
margin: 0px;
19+
font-family: "Fira Sans", sans-serif;
20+
}
21+
22+
.main {
23+
position: relative;
24+
align-items: center;
25+
display: flex;
26+
flex-direction: column;
27+
justify-content: center;
28+
text-align: center;
29+
display: flex;
30+
flex-direction: column;
31+
background-image: url(images/background.png);
32+
background-repeat: no-repeat;
33+
background-position: center;
34+
background-size: cover;
35+
min-height: 100vh;
36+
min-width: 100%;
37+
top: 0;
38+
left: 0;
39+
}
40+
41+
.main h1 {
42+
color: rgb(224, 224, 224);
43+
}
44+
45+
.main h3 {
46+
color: #a4a4a4;
47+
}
48+
49+
.main button {
50+
background-image: linear-gradient(
51+
92.88deg,
52+
#455eb5 9.16%,
53+
#5643cc 43.89%,
54+
#673fd7 64.72%
55+
);
56+
border-radius: 12px;
57+
margin: 5px;
58+
border-style: none;
59+
box-sizing: border-box;
60+
color: #ffffff;
61+
cursor: pointer;
62+
flex-shrink: 0;
63+
font-family: "Inter UI", "SF Pro Display", -apple-system, BlinkMacSystemFont,
64+
"Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue",
65+
sans-serif;
66+
font-size: 16px;
67+
font-weight: 500;
68+
height: 4rem;
69+
padding: 0 1.6rem;
70+
text-align: center;
71+
text-shadow: rgba(0, 0, 0, 0.25) 0 3px 8px;
72+
transition: all 1s;
73+
user-select: none;
74+
-webkit-user-select: none;
75+
touch-action: manipulation;
76+
width: 50%;
77+
min-height: 7vh;
78+
height: 9vh;
79+
text-decoration: none;
80+
}
81+
82+
.main button:hover {
83+
box-shadow: rgba(80, 63, 205, 0.5) 0 1px 30px;
84+
transition-duration: 0.5s;
85+
}
86+
87+
@media (min-width: 768px) {
88+
.button-36 {
89+
padding: 0 2.6rem;
15590
}
156-
91+
}
92+
93+
94+
.main button:hover {
95+
background-color: #35353f;
96+
}
97+
98+
.main img {
99+
width: 10vh;
100+
}
101+
102+
.next__slide {
103+
padding: 20px;
104+
text-align: center;
105+
color: white;
106+
background-color: #121212;
107+
min-height: 60vh;
108+
}
109+
110+
.reasons {
111+
flex-wrap: wrap;
112+
gap: 20px;
113+
display: flex;
114+
justify-content: space-between;
115+
justify-content: center;
116+
text-align: center;
117+
background-color: #121212;
118+
color: white;
119+
}
120+
121+
.reason {
122+
text-decoration: none;
123+
text-align: center;
124+
width: 250px;
125+
height: 270px;
126+
border: 2px solid;
127+
border-color: #22ff88;
128+
background-color: #38384f;
129+
border-radius: 10px;
130+
padding: 20px;
131+
transition-duration: 0.5s;
132+
font-size: 16px;
133+
}
134+
135+
.reason:hover {
136+
border-color: #ff95d6;
137+
color: #ff95d6;
138+
font-size: 17.6px;
139+
height: 280px;
140+
width: 270px;
141+
margin-left: 0px;
142+
margin-right: 0px;
143+
margin-bottom: 10px;
144+
}
145+
146+
.navbar {
147+
backdrop-filter: blur(5px);
148+
z-index: 1;
149+
overflow: hidden;
150+
background-color: #00000080;
151+
position: fixed;
152+
top: 0;
153+
width: 100%;
154+
}
155+
156+
.navbar a {
157+
transition: 1s 5ms;
158+
float: left;
159+
display: block;
160+
color: #f2f2f2;
161+
text-align: center;
162+
padding: 20px;
163+
text-decoration: none;
164+
}
165+
166+
.navbar img {
167+
padding: 10px;
168+
float: left;
169+
width: 40px;
170+
}
171+
172+
.navbar a:hover {
173+
background: #ffffff90;
174+
color: black;
175+
}
176+
177+
.about {
178+
background-color: #121212;
179+
color: #ffffff;
180+
padding: 1px;
181+
text-align: center;
182+
}
183+
184+
.about p {
185+
color: #9f9f9f;
186+
margin-left: 20vh;
187+
margin-right: 20vh;
188+
}
189+
190+
@media (max-width: 1000px) {
157191
.about p {
158192
color: #9f9f9f;
159-
margin-left: 20vh;
160-
margin-right: 20vh;
161-
}
162-
163-
@media (max-width: 1000px) {
164-
.about p {
165-
color: #9f9f9f;
166-
margin-left: 5vh;
167-
margin-right: 5vh;
168-
}
193+
margin-left: 5vh;
194+
margin-right: 5vh;
169195
}
170-
171-
.warning {
172-
color: #ffffff;
173-
padding-top: 30px;
174-
}
175-
196+
}
197+
198+
.warning {
199+
color: #ffffff;
200+
padding-top: 30px;
201+
}

‎index.html‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,8 @@
2424
<img src="images/icon.png" alt="">
2525
<h1>AxolotlClient</h1>
2626
<h3>A Free & Open-source Minecraft Client</h3>
27-
<a href="https://modrinth.com/mod/axolotlclient/versions#all-versions"><button>Download</button></a>
27+
<a href="https://modrinth.com/mod/axolotlclient/versions#all-versions"><button class="tooltip">
28+
Download</button></a>
2829
<a href="https://modrinth.com/mod/axolotlclient/gallery"><button>Screenshots</button></a>
2930
</div>
3031
</div>

0 commit comments

Comments
 (0)