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

Compare commits

base: petruspistor:1e33071913780e2bb9bdd7810d1b986f18b67ad4
Branches Tags
petruspistor:main
...
compare: petruspistor:main
Branches Tags
petruspistor:main

2 Commits
1e33071913 ... main

Author SHA1 Message Date
petruspistor
8edfd49eca update under construction 2025-08-25 09:37:45 +00:00
petruspistor
d273005d1c Modified HTML and CSS to display UC 2025-08-23 11:22:48 +00:00
3 changed files with 99 additions and 30 deletions
Expand all files Collapse all files

80
index.html
View File

@@ -1,24 +1,68 @@
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<link href="https://fonts.googleapis.com/css2?family=Iceland&display=swap" rel="stylesheet"> <meta charset="UTF-8">
<link rel="icon" href="/resources/img/pp.jpg" type="image/jpeg"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="en"> <title>Website Under Construction</title>
<title>Peter Baker</title> <style>
/* Global styles */
* {
box-sizing: border-box;
}
body {
margin: 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
/* Create a subtle diagonal caution stripe background */
background: repeating-linear-gradient(
-45deg,
#ffeb3b 0,
#ffeb3b 20px,
#f5c542 20px,
#f5c542 40px
);
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
}
.overlay {
background: rgba(255, 255, 255, 0.9);
padding: 40px;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
max-width: 500px;
text-align: center;
}
h1 {
margin-bottom: 20px;
font-size: 2.4rem;
color: #333;
}
p {
margin-bottom: 20px;
font-size: 1.2rem;
color: #555;
}
.contact {
font-size: 1rem;
color: #555;
}
a {
color: #007bff;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
</style>
</head> </head>
<body> <body>
<header class="site-header" role="banner"> <div class="overlay">
<picture> <h1>Under Construction</h1>
<source srcset="/resources/img/pb_16_9_under512kb.webp" type="image/webp"> <p>I'm currently working on bringing you an amazing website. Please check back soon!</p>
<img src="/resources/img/pb.png" alt="Portrait of Peter" width="1280" height="372" loading="eager" decoding="async"> <p class="contact">If you have any questions, feel free to <a href="mailto:connect+pp@petruspistor.com">contact me</a>.</p>
<picture> </div>
</header>
<p>Whether it be IMDB’s top 250 movies or the FBI’s most wanted, lists are everywhere on the web and you are going to need one eventually in your webpages.
Luckily, with HTML there are a couple of different types of lists at your disposal.</p>
</body> </body>
</html> </html>

35
resources/css/index.css
View File

@@ -1,11 +1,36 @@
body { * {
margin: 0; margin: 0;
padding: 0; padding: 0;
background-color: #F5F5F5 box-sizing: border-box;
font-family: Iceland;
line-height: 1.0
} }
html, body {
height: 100%;
}
body {
display: flex;
justify-content: center;
aligin-times: center;
background: linear-gradient(180deg, #f7d34b, #e0a82e);
/* fallback solid background */
background-color: #f7d34b;
font-family: Arial, san-serif;
}
/* Center the Image */
.container img {
max-width: 90%;
height: auto;
border: 6px solid #e0a82e;
border-radius: 12px;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}

BIN
resources/img/underconstruction.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.3 MiB