petruspistor/petruspistor.com
2
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

deleted h1, and pops-title shows up in the sectionunder nav

Browse Source
This commit is contained in:
petruspistor
2025-08-21 18:54:29 +00:00
parent f41fdf6606
commit 5200e5f421
2 changed files with 22 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
index.html
View File

@@ -1,38 +1,34 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8" /> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Peter the Baker</title> <title>Peter Baker</title>
<!-- Optional: system fonts for speed; swap later if you like --> <!-- Google Font -->
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Iceland&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Iceland&display=swap" rel="stylesheet">
<link rel="stylesheet" href="/resources/css/index.css" /> <link rel="stylesheet" href="/resources/css/index.css" />
</head> </head>
<body> <body>
<header class="site-header"> <header class="site-header">
<img src="/resources/img/pb.png" alt="Portrait of Peter Baker" width="1280" height="372"/> <img src="/resources/img/pb.png" alt="Portrait of Peter Baker" width="1280" height="372"/>
<h1 class="site-title">Peter Baker</h1> </header>
</header>
<nav class="site-nav" aria-label="Primary"> <nav class="site-nav" aria-label="Primary">
<ul> <ul>
<li><a href="#social">Social</a></li> <li><a href="#social">Social</a></li>
<li><a href="#projects">Projects</a></li> <li><a href="#projects">Projects</a></li>
<li><a href="#contact">Contact</a></li> <li><a href="#contact">Contact</a></li>
</ul> </ul>
</nav> </nav>
<main id="main" class="content"> <!-- Hero title that pops up from the top of nav -->
<section class="hero">
<h1 class="pop-title">Peter&nbsp;Baker</h1>
</section>
<main class="content" id="main">
<!-- your sections -->
</main> </main>
<footer class="site-footer">
<small>© <span id="year"></span> Peter Baker</small>
</footer>
<script>
document.getElementById('year').textContent = new Date().getFullYear();
</script>
</body> </body>
</html> </html>

30
resources/css/index.css
View File

@@ -51,18 +51,6 @@ body {
background: rgba(255,255,255,.08); background: rgba(255,255,255,.08);
} }
/* ========== Header + Banner ========== */
.site-header {
position: relative;
margin: 0;
padding: 0;
}
.site-header img {
display: block;
width: 100%;
height: auto;
}
/* ========== Title (pops from nav) ========== */ /* ========== Title (pops from nav) ========== */
.site-title { .site-title {
font-family: 'Iceland', sans-serif; font-family: 'Iceland', sans-serif;
@@ -82,24 +70,6 @@ body {
underlineIn 700ms ease-out 650ms forwards; underlineIn 700ms ease-out 650ms forwards;
} }
.site-title::after {
content: "";
display: block;
height: 3px;
width: 0%;
margin: .55rem auto 0;
background: var(--gold);
border-radius: 999px;
}
/* ========== Keyframes ========== */
@keyframes popFromNav {
0% { opacity: 0; transform: translate(-50%, calc(var(--nav-h) * .6)); }
60% { opacity: 1; transform: translate(-50%, -8px); }
100% { opacity: 1; transform: translate(-50%, 0); }
}
@keyframes underlineIn { to { width: 56%; } }
/* ========== Content + Footer ========== */ /* ========== Content + Footer ========== */
.content { .content {
max-width: 1000px; max-width: 1000px;