Skip to content

Commit 7e50490

Browse files
jbey251jbey251
authored
feat: adds Jbey HTML README (#103)
* Create README.html * Create placeholder * Add files via upload * Delete lesson_01/JohnBey/images/placeholder * Create styles.css * Rename Splatoon 3.jpg to JbeyS3.jpg * Delete lesson_01/JohnBey/images directory * Create placeholder * Add files via upload * Delete lesson_01/JohnBey/Images/placeholder
1 parent a59f368 commit 7e50490

File tree

8 files changed

+188
-0
lines changed

8 files changed

+188
-0
lines changed

‎lesson_01/JohnBey/Images/JBEY.jpg

144 KB
Loading

‎lesson_01/JohnBey/Images/JBeySU.jpg

224 KB
Loading

‎lesson_01/JohnBey/Images/JbeyS3.jpg

319 KB
Loading

‎lesson_01/JohnBey/Images/Lucky.jpg

205 KB
Loading

‎lesson_01/JohnBey/Images/Rowdy.jpg

653 KB
Loading

‎lesson_01/JohnBey/Images/Sasha.jpg

131 KB
Loading

‎lesson_01/JohnBey/README.html

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>The Mundane Life of John W. Bey</title>
7+
<link rel="stylesheet" href="styles.css">
8+
</head>
9+
<body>
10+
<div class="container">
11+
<h1>The mundane life of John W. Bey</h1>
12+
<section class="content">
13+
<h2>Who am I?</h2>
14+
<p>Originally born and raised in Philly, I am simply someone looking for an opportunity in what I can only describe to be my passion. That passion is finally becoming a software engineer. Or at least, using whatever knowledge I can gain to finally pursue the projects that I want to pursue.</p>
15+
</section>
16+
<section class="content">
17+
<h2>What I like</h2>
18+
<ul>
19+
<li>Money. Need that in order to do anything, ESPECIALLY the things that I WANT to do.</li>
20+
<li>Pets. I want an attack dog. The dogs that I've taken care of in the past weren't exactly attack-dog capable (I miss them 😢).</li>
21+
<li>Females. Self-explanatory.</li>
22+
<li>Computers. But only when they work. I don't want to even look at a computer when it's having personal issues.</li>
23+
<li>Lemons. This is just my weird guilty pleasure.</li>
24+
<liAnime & video games. I probably don't watch or play the same things that most people play, but that's fine. This is definitely one of my main hobbies. The 2 main games I do play are called Super Smash Bros. Ultimate and Splatoon 3.</li>
25+
</ul>
26+
</section>
27+
28+
<section class="content">
29+
<h2>What I hate</h2>
30+
<p>I hate potatoes on top of my pizza. I hate when my phone decides to act slow for no reason. I hate Twitter. I hate, HATE losing when competing seriously. Even when I'm not competing seriously, losing just irks me the wrong way.</p>
31+
</section>
32+
33+
<section class="content">
34+
<h2>What am I like?</h2>
35+
<p>I'm a chill person. I don't like to cause trouble for anyone that's around me. In fact, I'd like to avoid that as much as possible. I'm also disciplined when it comes to things that I really want. I don't really like to talk when I'm trying really hard to understand something, but I will help others if the need arises. Sometimes I can come off as too passive or too abrasive. It's hard to balance the two sometimes. But overall, I'm just another normal dude.</p>
36+
</section>
37+
38+
<section class="content">
39+
<h2>Any controversial opinions?</h2>
40+
<ul>
41+
<li>Samsung is better than iPhone.</li>
42+
<li>Comic books look ugly.</li>
43+
<li>Video games don't make people violent.</li>
44+
</ul>
45+
</section>
46+
47+
<section class="content">
48+
<h2>Contacts</h2>
49+
<p class="last-paragraph">You can contact me by sending an email to <a href="mailto:[email protected]">[email protected]</a>, or <a href="mailto:[email protected]">[email protected]</a> (this one is my Code Differently email). They're both really my work email to be honest.</p>
50+
</section>
51+
52+
<footer>
53+
<img src="images/JBEY.jpg" class="images">
54+
<img src="images/JBeyS3.jpg" class="images">
55+
<img src="images/JBeySU.jpg" class="SUimage">
56+
<img src="images/Lucky.jpg" class="images">
57+
<img src="images/Rowdy.jpg" class="images">
58+
<img src="images/Sasha.jpg" class="images">
59+
</footer>
60+
</div>
61+
62+
</body>
63+
</html>

‎lesson_01/JohnBey/styles.css

Lines changed: 125 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,125 @@
1+
* {
2+
margin: 0;
3+
padding: 0;
4+
box-sizing: border-box;
5+
}
6+
7+
body {
8+
font-family: 'Arial', sans-serif;
9+
background-color: black;
10+
color: #333;
11+
line-height: 1.6;
12+
display: flex;
13+
justify-content: center;
14+
align-items: flex-start;
15+
height: 100vh;
16+
padding: 0;
17+
margin: 0;
18+
}
19+
20+
.container {
21+
width: 100%;
22+
max-width: 1030px;
23+
background-color: black;
24+
border-radius: 8px;
25+
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
26+
padding: 40px;
27+
overflow: hidden;
28+
margin: -5px auto;
29+
}
30+
31+
header {
32+
text-align: center;
33+
margin-bottom: 30px;
34+
}
35+
36+
header h1 {
37+
font-size: 2.5rem;
38+
font-weight: 700;
39+
color: #333;
40+
letter-spacing: -0.5px;
41+
}
42+
43+
.content {
44+
margin-bottom: 30px;
45+
46+
}
47+
48+
h1 {
49+
font-size: 2em;
50+
font-weight: 600;
51+
color: white;
52+
border-bottom: 1px solid grey;
53+
padding-top: 0px;
54+
padding-bottom: -30px;
55+
margin-bottom: 35px;
56+
width: 110%;
57+
}
58+
59+
h2 {
60+
font-size: 1.3rem;
61+
font-weight: var(--base-text-weight-semibold, 600);
62+
color: white;
63+
border-bottom: 1px solid grey;
64+
padding-bottom: -30px;
65+
margin-bottom: 15px;
66+
margin-top: -10px;
67+
width: 110%;
68+
}
69+
70+
71+
p {
72+
font-size: 1rem;
73+
color: white;
74+
line-height: 1.6;
75+
margin-bottom: var(--base-size-16);
76+
margin-top: 0;
77+
}
78+
79+
ul {
80+
margin-left: 20px;
81+
font-size: 1rem;
82+
color: #555;
83+
list-style-type: disc;
84+
padding-left: 0;
85+
}
86+
87+
ul li {
88+
margin-bottom: 1px;
89+
color: white;
90+
}
91+
92+
a {
93+
color: #007BFF;
94+
text-decoration: none;
95+
}
96+
97+
a:hover {
98+
text-decoration: underline;
99+
}
100+
101+
footer {
102+
text-align: center;
103+
margin-top: 30px;
104+
margin-bottom: -15px;
105+
}
106+
107+
.images {
108+
width: 1012px;
109+
height: 1349px;
110+
margin-top: -10px;
111+
margin-bottom: 10px
112+
}
113+
114+
.SUimage {
115+
padding-right: 150px;
116+
margin-bottom: 10px;
117+
margin-top: -10px
118+
}
119+
120+
.last-paragraph {
121+
border-bottom: 3px solid grey;
122+
padding-bottom: 10px;
123+
margin-bottom: 15px;
124+
width: 110%;
125+
}

0 commit comments

Comments
 (0)