Skip to content

Commit bc0ed53

Browse files
committed
First Main Page
1 parent 363d8d7 commit bc0ed53

2 files changed

Lines changed: 151 additions & 1 deletion

File tree

.DS_Store

0 Bytes
Binary file not shown.

index.html

Lines changed: 151 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,151 @@
1-
<a href = "itis3135/">Click to go to ITIS3135 Site</a>
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" />
6+
<title>Iohannes Manus | Personal Home Page</title>
7+
8+
<!-- Required Accumulus Script -->
9+
<script src="https://lint.page/kit/4d0fe3.js" crossorigin="anonymous"></script>
10+
11+
<!-- Embedded CSS (required) -->
12+
<style>
13+
:root {
14+
--bg: #f7f7fb;
15+
--ink: #1f2937;
16+
--accent: #2f6df6;
17+
--muted: #6b7280;
18+
--card: #ffffff;
19+
--ring: rgba(47, 109, 246, 0.35);
20+
--maxw: 900px;
21+
}
22+
23+
html, body {
24+
height: 100%;
25+
}
26+
27+
body {
28+
margin: 0 auto;
29+
max-width: var(--maxw);
30+
width: 92%;
31+
background: var(--bg);
32+
color: var(--ink);
33+
font: 16px/1.6 system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
34+
}
35+
36+
header, main, footer {
37+
background: var(--card);
38+
border-radius: 14px;
39+
box-shadow: 0 2px 12px rgba(0,0,0,0.06);
40+
padding: 1.25rem;
41+
margin: 1.1rem 0;
42+
}
43+
44+
h1 {
45+
margin: 0 0 0.25rem 0;
46+
font-size: clamp(1.6rem, 3vw, 2rem);
47+
font-weight: 800;
48+
}
49+
50+
.tagline {
51+
margin: 0.15rem 0 0;
52+
color: var(--muted);
53+
font-size: 0.975rem;
54+
}
55+
56+
h2 {
57+
margin-top: 0;
58+
font-size: clamp(1.25rem, 2.2vw, 1.5rem);
59+
font-weight: 700;
60+
}
61+
62+
p { margin: 0 0 0.8rem; }
63+
64+
a {
65+
color: var(--accent);
66+
text-decoration: none;
67+
}
68+
a:hover { text-decoration: underline; }
69+
a:focus-visible {
70+
outline: 3px solid var(--ring);
71+
outline-offset: 2px;
72+
border-radius: 6px;
73+
}
74+
75+
.footer-nav {
76+
display: flex;
77+
flex-wrap: wrap;
78+
gap: 0.5rem 0.9rem;
79+
align-items: center;
80+
justify-content: center;
81+
margin-bottom: 0.6rem;
82+
font-weight: 600;
83+
}
84+
85+
.sep { color: var(--muted); }
86+
87+
.validators {
88+
display: flex;
89+
gap: 0.9rem;
90+
justify-content: center;
91+
flex-wrap: wrap;
92+
font-size: 0.95rem;
93+
}
94+
95+
.smallprint {
96+
margin-top: 0.75rem;
97+
text-align: center;
98+
color: var(--muted);
99+
font-size: 0.9rem;
100+
}
101+
</style>
102+
</head>
103+
<body>
104+
<header>
105+
<h1>Iohannes Manus</h1>
106+
<p class="tagline">Mathematics major • Builder of clean, human-centered web experiences</p>
107+
</header>
108+
109+
<main>
110+
<h2>Personal Home Page</h2>
111+
112+
<p>
113+
Welcome—this is my professional landing page. You can use the links below to reach my
114+
course work, public profiles, and hosted sites. I keep this page simple and distinct from
115+
specific class assignments so it remains an at-a-glance hub.
116+
</p>
117+
118+
<p>
119+
I study mathematics at UNC Charlotte and enjoy applying structured thinking to real projects:
120+
from front-end web design and accessibility to game-development prototypes. I value readable
121+
code, thoughtful interfaces, and clear documentation.
122+
</p>
123+
</main>
124+
125+
<footer>
126+
<nav class="footer-nav" aria-label="Primary site links">
127+
<a href="https://github.com/TheQuantifier" target="_blank" rel="noopener">GitHub.com</a>
128+
<span class="sep">|</span>
129+
<a href="https://webpages.charlotte.edu/jhand12/" target="_blank" rel="noopener">CLT Web</a>
130+
<span class="sep">|</span>
131+
<a href="https://thequantifier.github.io/" target="_blank" rel="noopener">GitHub.io</a>
132+
<span class="sep">|</span>
133+
<a href="itis3135/">ITIS3135</a>
134+
<span class="sep">|</span>
135+
<a href="https://www.linkedin.com/in/johnahand" target="_blank" rel="noopener">LinkedIn</a>
136+
</nav>
137+
138+
<div class="validators">
139+
<a href="https://validator.w3.org/nu/" target="_blank" rel="noopener">HTML Validator (W3C)</a>
140+
<span class="sep"></span>
141+
<a href="https://jigsaw.w3.org/css-validator/" target="_blank" rel="noopener">CSS Validator (W3C Jigsaw)</a>
142+
</div>
143+
144+
<p class="smallprint">© <span id="year"></span> Iohannes Manus. All rights reserved.</p>
145+
</footer>
146+
147+
<script>
148+
document.getElementById('year').textContent = new Date().getFullYear();
149+
</script>
150+
</body>
151+
</html>

0 commit comments

Comments
 (0)