Skip to content

Commit 39afdee

Browse files
John220099John220099
committed
changes
1 parent 3d1b821 commit 39afdee

File tree

5 files changed

+52
-71
lines changed

5 files changed

+52
-71
lines changed

‎Styles.css‎

Lines changed: 15 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,70 +1,54 @@
11
body {
2-
/*text*/
3-
font-family: 'Helvetica Neue, Arial, sans-serif';
2+
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
43
line-height: 1.6;
5-
background-color: #5c5c5c;
6-
color: #99999999;
7-
padding: 20px;
4+
background-image: linear-gradient(hsl(231, 49%, 26%), hsl(181, 100%, 50%));
5+
background-attachment: fixed;
6+
color: hsl(210, 9%, 22%);
7+
padding: 10%;
88
text-align: center;
99
}
1010

1111
nav {
12-
/*navigation color*/
13-
background-color: #5c5c5c;
14-
color: #c2c2c2;
12+
color: hsl(0, 0%, 76%);
1513
padding: 10px;
1614
text-align: center;
17-
/*creates a line (color = black)*/
18-
border-bottom: 1.5px solid #000000;
15+
border-bottom: 1.5px solid hsl(0, 0%, 0%);
1916
}
2017

2118
p {
22-
/*text color*/
23-
color: #96d35f;
19+
color: hsl(210, 9%, 22%);
2420
}
2521

2622
p a {
27-
/*link color*/
28-
color: #96d35f;
23+
color: hsl(210, 9%, 22%);
2924
}
3025

31-
footer {
32-
/*Footer color*/
33-
background-color: #474747;
34-
color: #b51a00;
35-
text-align: center;
36-
padding: 10px;
37-
margin-top: 20px;
38-
/*creates a line (color = black)*/
39-
border-top: 1px solid #000000;
40-
}
41-
4226
.code p img {
43-
/*image border*/
44-
border: 4px solid #3d3c4c;
27+
border: 4px solid hsl(244, 12%, 27%);
28+
border-radius: 20px;
4529
}
4630

4731
a img {
48-
/*sets image to default size*/
4932
max-width: 100%;
5033
max-height: 100%;
5134
}
5235

5336
.github {
54-
/*github logo width and height*/
5537
height: 50px;
5638
width: 50px;
5739
position: relative;
58-
position: relative;
5940
margin: auto;
6041
padding: 10px;
6142
}
6243

6344
.youtube {
64-
/*youtube logo width and height*/
6545
height: 75px;
6646
width: 75px;
6747
position: relative;
6848
margin: auto;
6949
padding: 10px;
7050
}
51+
52+
.line {
53+
border-bottom: 1.5px solid hsl(0, 0%, 0%);
54+
}

‎assets/assets.txt‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

favicon.png renamed to assets/favicon.png

File renamed without changes.

‎index.html‎

Lines changed: 26 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -23,51 +23,38 @@
2323
<!--displays websites title-->
2424
<title>welcome to john220099s portfolio</title>
2525

26-
<!--website css style-->
26+
<!--style-->
2727
<link rel="stylesheet" href="Styles.css">
28+
29+
<!--script-->
30+
<script src="script.js"></script>
2831

2932
<!--website icon-->
30-
<link rel="icon" type="image/png" href="favicon.png">
33+
<link rel="icon" type="image/png" href="assets/favicon.png">
3134
</head>
3235
<body>
33-
<nav>
36+
<nav>
3437
<ul>
35-
<h1>Welcome to John220099 stuff</h1>
38+
<h1>John220099 stuff</h1>
3639
<ul>
3740
</nav>
38-
<!--about-->
39-
<h2>about me</h2>
40-
<p>Hi, I’m @John220099 👋🏻</p>
41-
<p>i make/code stuff🛠️</p>
42-
<p>I’m currently learning python, c++ ,kotlin and html 📒</p>
43-
<div class="code"><p><img align="center" src="https://github-readme-stats.vercel.app/api/top-langs?username=john220099&show_icons=true&locale=en&layout=compact" alt="john220099" /></p></div>
44-
<!--active repo's and favorite-->
45-
<h2>repositories💻</h2>
46-
<p><a href="https://github.com/John220099/Anti-revoke-blacklist" target="_blank">antirevoke-dns</a></p>
47-
<p><a href="https://github.com/John220099/john220099-stuff" target="_blank">john220099-stuff</a></p>
48-
<p><a href="https://github.com/John220099/Bedrock-Clients" target="_blank">bedrock-clients</a></p>
49-
<p><a href="https://github.com/John220099/Java-clients" target="_bank">java-clients</a></p>
50-
<!--socials github / youtube-->
51-
<h2>socials📱</h2>
52-
<!--the link that will be opened if you click the image-->
53-
<div class="github">
54-
<a href="https://github.com/John220099" target="_blank" title="Will Redirect you to my github profile.">
55-
<!--shows an image-->
56-
<img src="assets/github.png"/>
57-
</a>
58-
</div>
41+
<h2>about me</h2>
42+
<p>Hi, I’m @John220099 👋🏻</p>
43+
<p>i make/code stuff🛠️</p>
44+
<p>I’m currently learning python, c++ ,kotlin and html 📒</p>
45+
<div class="code"><p><img align="center" src="https://github-readme-stats.vercel.app/api/top-langs?username=john220099&show_icons=true&locale=en&layout=compact" alt="john220099" /></p></div>
46+
<h2>socials📱</h2>
47+
<div class="github">
48+
<a href="https://github.com/John220099" target="_blank" title="Will Redirect you to my github profile.">
49+
<img src="assets/github.png"/>
50+
</a>
51+
</div>
5952
<div class="youtube">
60-
<!--the link that will be opened if you click the image-->
61-
<a href="https://youtube.com/@john2009_?si=o_Ir5jyeSwx2duCN" target="_blank" title="Will Redirect you to my YT.">
62-
<!--shows an image-->
63-
<img src="assets/youtube.png"/>
64-
</a>
65-
</div>
66-
<!--shows a line-->
67-
<nav>
68-
</nav>
69-
<footer>
70-
<!--footer-->
71-
<h4>&copy; 2025 My Website. All rights reserved under github.</h4>
72-
</footer>
73-
</body>
53+
<a href="https://www.youtube.com/@john22009" target="_blank" title="Will Redirect you to my YT.">
54+
<img src="assets/youtube.png"/>
55+
</a>
56+
</div>
57+
<div class="line">
58+
</div>
59+
</body>
60+
</html>

‎script.js‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
document.addEventListener("DOMContentLoaded", () => {
2+
let hue = 0;
3+
function animate() {
4+
hue = (hue + 1) % 360;
5+
const color1 = `hsl(${hue}, 49%, 26%)`;
6+
const color2 = `hsl(${(hue + 60) % 360}, 100%, 50%)`;
7+
document.body.style.background = `linear-gradient(120deg, ${color1}, ${color2})`;
8+
requestAnimationFrame(animate);
9+
}
10+
animate();
11+
});

0 commit comments

Comments
 (0)