Compare commits

..

9 Commits

Author SHA1 Message Date
aaf2b3d75b Updated some links 2024-07-07 10:19:59 +01:00
52c9ab2a6d Updated all pages to new layout 2024-07-07 09:45:20 +01:00
5a1c4acbde Finished new layout 2024-07-06 18:46:44 +01:00
6f42499ece Formatting 2024-07-06 16:35:48 +01:00
f46f6f896e created a page to test out a new layout 2024-07-06 15:46:06 +01:00
b504ea6d96 blog 2024-05-16 17:54:09 +01:00
f2c1dfa919 img update 2024-05-16 17:24:11 +01:00
5a9b839192 fixed stuff 2024-05-16 17:21:43 +01:00
c37d7eaf6e details about debian 2024-05-16 17:18:31 +01:00
14 changed files with 280 additions and 192 deletions

28
about.html Normal file
View File

@@ -0,0 +1,28 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link href="index.css" rel="stylesheet">
<title>chptr</title>
</head>
<body>
<a href="index.html"><img src="https://chopster44.com/img/pfp.png" width="141" class="div logo"></a>
<h1 class="div title">Chopster44</h1>
<div class="div nav">
<p>Personal</p>
<a href="/about.html">[About]</a>
<a href="/blog.html">[Blog]</a>
<p>Interests</p>
<a href="/projects.html">[Projects]</a>
<a href="/rockets.html">[Rockets]</a>
<p>Other Web</p>
<a href="#">[Buttons]</a>
<a href="/contact.html">[Contact]</a>
</div>
<div class="div main construction">
</div>
<div class="div footer">
<p>&#169; chopster44 | Page last edited: 2024-07-07</p>
</div>
</body>
</html>

View File

@@ -1,34 +1,28 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<link href="index.css" rel="stylesheet"> <link href="index.css" rel="stylesheet">
<title>blog</title> <title>chptr</title>
</head> </head>
<body> <body>
<header> <a href="index.html"><img src="https://chopster44.com/img/pfp.png" width="141" class="div logo"></a>
<img src="https://chopster44.com/img/pfp.png" width="141"> <h1 class="div title">Chopster44</h1>
<div id="menu"> <div class="div nav">
<h1>Chopster44</h1> <p>Personal</p>
<a href="/#about">[About]</a> <a href="/about.html">[About]</a>
<a href="/blog">[Blog]</a> <a href="/blog.html">[Blog]</a>
<a href="/projects">[Projects]</a> <p>Interests</p>
<a href="/rockets">[Rockets]</a> <a href="/projects.html">[Projects]</a>
<a href="/linux">[Linux]</a> <a href="/rockets.html">[Rockets]</a>
<p>Other Web</p>
<a href="#">[Buttons]</a>
<a href="/contact.html">[Contact]</a>
</div> </div>
</header> <div class="div main">
<main>
<h2>Blog</h2> <h2>Blog</h2>
<div class="blogItem">
<h3>Tuesday 23rd April 2024</h3>
<p> ¬ Blog v2</p>
</div> </div>
</main> <div class="div footer">
<footer> <p>&#169; chopster44 | Page last edited: 2024-07-07</p>
<p>&#169; chopster44</p> </div>
</footer>
</body> </body>
</html> </html>

View File

@@ -2,33 +2,33 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<link href="index.css" rel="stylesheet"> <link href="index.css" rel="stylesheet">
<title>contact</title> <title>chptr</title>
</head> </head>
<body> <body>
<header> <a href="index.html"><img src="https://chopster44.com/img/pfp.png" width="141" class="div logo"></a>
<img src="https://chopster44.com/img/pfp.png" width="141"> <h1 class="div title">Chopster44</h1>
<div id="menu"> <div class="div nav">
<h1>Chopster44</h1> <p>Personal</p>
<a href="/#about">[About]</a> <a href="/about.html">[About]</a>
<a href="/blog">[Blog]</a> <a href="/blog.html">[Blog]</a>
<a href="/projects">[Projects]</a> <p>Interests</p>
<a href="/rockets">[Rockets]</a> <a href="/projects.html">[Projects]</a>
<a href="/linux">[Linux]</a> <a href="/rockets.html">[Rockets]</a>
<p>Other Web</p>
<a href="#">[Buttons]</a>
<a href="/contact.html">[Contact]</a>
</div> </div>
</header> <div class="div main">
<main>
<h2>Contact</h2> <h2>Contact</h2>
<p>Pretty much all the ways to get in touch with me:</p> <p>Pretty much all the ways to get in touch with me:</p>
<p id="email">Email: oscar@chopter44.com</p> <p id="email">Email: oscar@chopter44.com</p>
<p id="discord">Discord: Chopster44</p> <p id="discord">Discord: Chopster44</p>
<p id="matrix">Matrix: I haven't made one yet</p> <p id="matrix">Matrix: I haven't made one yet</p>
</main> </div>
<footer> <div class="div footer">
<p>&#169; chopster44</p> <p>&#169; chopster44 | Page last edited: 2024-07-07</p>
</footer> </div>
</body> </body>
</html> </html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 390 B

BIN
img/debian202405.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 MiB

BIN
img/lined-paper-texture.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 50 KiB

BIN
img/paper.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

View File

@@ -2,35 +2,39 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<link href="index.css" rel="stylesheet"> <link href="index.css" rel="stylesheet">
<title>imgs</title> <title>chptr</title>
</head> </head>
<body> <body>
<header> <a href="index.html"><img src="https://chopster44.com/img/pfp.png" width="141" class="div logo"></a>
<img src="https://chopster44.com/img/pfp.png" width="141"> <h1 class="div title">Chopster44</h1>
<div id="menu"> <div class="div nav">
<h1>Chopster44</h1> <p>Personal</p>
<a href="/#about">[About]</a> <a href="/about.html">[About]</a>
<a href="/blog">[Blog]</a> <a href="/blog.html">[Blog]</a>
<a href="/projects">[Projects]</a> <p>Interests</p>
<a href="/rockets">[Rockets]</a> <a href="/projects.html">[Projects]</a>
<a href="/linux">[Linux]</a> <a href="/rockets.html">[Rockets]</a>
<p>Other Web</p>
<a href="#">[Buttons]</a>
<a href="/contact.html">[Contact]</a>
</div> </div>
</header> <div class="div main">
<main>
<h2>imgs</h2> <h2>imgs</h2>
<p>A list of all the images/media I use here and where it came from.</p> <p>The sources of any pictures i have <strike>stolen</strike> borrowed. Click on the image to view in full size</p>
<div id="pfp" class="srcItem"> <div class="imgInfo">
<img src="img/pfp-transparent.png" width="141" alt="profile picture"> <a href="img/pfp-transparent.png"><img src="img/pfp-transparent.png" width="141" alt="profile picture"></a>
<p>Modified version of some art I found which I've been using as my profile picture. <br> <p>Modified version of some art I found which I've been using as my profile picture. <br>
I have tried to find the original artist but the only place I have ever found it is I have tried to find the original artist but the only place I have ever found it is
<a href="https://www.reddit.com/r/girlsfrontline/comments/dgwqcd/intervenchan/">[this reddit post]</a></p> <a href="https://www.reddit.com/r/girlsfrontline/comments/dgwqcd/intervenchan/">[this reddit post]</a></p>
</div> </div>
</main> <div class="imgInfo">
<footer> <a href="img/TokyoBridge6605underconstruction.gif"><img src="img/TokyoBridge6605underconstruction.gif"></a>
<p>&#169; chopster44</p> <p>An under construction gif i found on <a href="http://textfiles.com/underconstruction/">[this geocities archive]</a></p>
</footer> </div>
</div>
<div class="div footer">
<p>&#169; chopster44 | Page last edited: 2024-07-07</p>
</div>
</body> </body>
</html> </html>

View File

@@ -1,21 +1,71 @@
body { body {
background-image: url(/img/paper.gif);
margin: 40px auto; margin: 40px auto;
max-width: 650px; max-width: 800px;
line-height: 1.8; line-height: 1.8;
font-size: 18px; font-size: 18px;
color: #454545; color: #454545;
padding: 0 10px; padding: 0 10px;
background: #fbf9f7; /*background: #fbf9f7;*/
display: grid;
grid-template-columns: 150px auto;
grid-template-rows: auto auto 2em;
grid-template-areas: "logo title"
"nav content"
"nav foot";
gap: 10px;
height: 100%;
}
.div {
background-color: #fbf9f7;
padding: 0 5px;
border: medium outset black;
}
.logo {
grid-area: logo;
padding: 0 1.5px;
} }
header { .title {
grid-area: title;
width: auto;
height: auto;
margin: auto;
}
.nav {
grid-area: nav;
display: flex; display: flex;
align-items: center; flex-direction: column;
}
.main {
grid-area: content;
}
.footer {
grid-area: foot;
}
.footer >p {
margin: 0;
}
.changelog {
overflow-y: scroll;
}
.construction {
background-image: url("img/TokyoBridge6605underconstruction.gif");
background-position: center;
} }
a { a {
color: #07a; color: #07a;
text-decoration:none; text-decoration:none;
width: fit-content;
} }
a:visited { a:visited {
@@ -30,6 +80,15 @@ sub {
padding-left: 5%; padding-left: 5%;
} }
.srcItem { .imgInfo {
display: flex; display: flex;
} }
.imgInfo > a {
margin: auto;
}
.distro {
display: flex;
}

View File

@@ -2,42 +2,43 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<link href="index.css" rel="stylesheet"> <link href="index.css" rel="stylesheet">
<title>chopster44.com</title> <title>chptr</title>
</head> </head>
<body> <body>
<header> <a href="index.html"><img src="https://chopster44.com/img/pfp.png" width="141" class="div logo"></a>
<img src="https://chopster44.com/img/pfp.png" width="141"> <h1 class="div title">Chopster44</h1>
<div id="menu"> <div class="div nav">
<h1>Chopster44</h1> <p>Personal</p>
<a href="/#about">[About]</a> <a href="/about.html">[About]</a>
<a href="/blog">[Blog]</a> <a href="/blog.html">[Blog]</a>
<a href="/projects">[Projects]</a> <p>Interests</p>
<a href="/rockets">[Rockets]</a> <a href="/projects.html">[Projects]</a>
<a href="/linux">[Linux]</a> <a href="/rockets.html">[Rockets]</a>
<p>Other Web</p>
<a href="#">[Buttons]</a>
<a href="/contact.html">[Contact]</a>
</div> </div>
</header> <div class="div main">
<main>
<div id="about"> <div id="about">
<h2>About me</h2> <h2>About me</h2>
<p> <p>
I'm chopster44. <br> Hi, I'm chopster44 and this is my website. Here I put anything I have worked on/used/made which I think
I know a bit about programming, designing circuit boards, building rockets, breaking computers and playing bass. is cool. This isn't a professional site so things might get a bit messy/all over the place and hard to
navigate. I hope you enjoy looking around!
<br> <br>
This is my personal site where I put a bit of everything. Like most of my projects this is a work in progress. If you want to ask me something about anything here, take a look at <a href="contact">[Contact]</a>.
</p> </p>
</div> </div>
<div id="links"> <div class="changelog">
<h2>Contact</h2> <h2>Changes</h2>
<p>Messaging: <a href="mailto:oscar@chopster44.com">[email]</a> <a href="/contact.html#discord">[discord]</a> <a href="/contact.html#matrix">[matrix]</a></p> <div>
<p>Other links: <a href="https://www.instagram.com/chopster44/">[instagram]</a> <a href="https://github.com/chopster44">[github]</a></p> <p>2024-07-06 - new page layouts, updated some text</p>
<p>Other pages: <a>[imgs]</a></p> </div>
</div>
</div>
<div class="div footer">
<p>&#169; chopster44 | Page last edited: 2024-07-07</p>
</div> </div>
</main>
<footer>
<p>&#169; chopster44</p>
</footer>
</body> </body>
</html> </html>

View File

@@ -1,37 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<link href="index.css" rel="stylesheet">
<title>linux</title>
</head>
<body>
<header>
<img src="https://chopster44.com/img/pfp.png" width="141">
<div id="menu">
<h1>Chopster44</h1>
<a href="/#about">[About]</a>
<a href="/blog">[Blog]</a>
<a href="/projects">[Projects]</a>
<a href="/rockets">[Rockets]</a>
<a href="/linux">[Linux]</a>
</div>
</header>
<main>
<h2>Linux</h2>
<p>I like linux a lot, and I distro hop quite often, so I thought I'd make a mini review type thing for it</p>
<div>
<h2>Debian</h2>
<sub>Feb '24 - </sub>
<p> Current daily drive. </p>
</div>
</main>
<footer>
<p>&#169; chopster44</p>
</footer>
</body>
</html>

View File

@@ -2,30 +2,29 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<link href="index.css" rel="stylesheet"> <link href="index.css" rel="stylesheet">
<title>projects</title> <title>chptr</title>
</head> </head>
<body> <body>
<header> <a href="index.html"><img src="https://chopster44.com/img/pfp.png" width="141" class="div logo"></a>
<img src="https://chopster44.com/img/pfp.png" width="141"> <h1 class="div title">Chopster44</h1>
<div id="menu"> <div class="div nav">
<h1>Chopster44</h1> <p>Personal</p>
<a href="/#about">[About]</a> <a href="/about.html">[About]</a>
<a href="/blog">[Blog]</a> <a href="/blog.html">[Blog]</a>
<a href="/projects">[Projects]</a> <p>Interests</p>
<a href="/rockets">[Rockets]</a> <a href="/projects.html">[Projects]</a>
<a href="/linux">[Linux]</a> <a href="/rockets.html">[Rockets]</a>
</div> <p>Other Web</p>
</header> <a href="#">[Buttons]</a>
<main> <a href="/contact.html">[Contact]</a>
<h2>Projects</h2> </div>
<p> ¬ I'll put some stuff here, but I haven't made anything yet.</p> <div class="div main">
</main> <h2>I haven't added anything yet</h2>
<footer> <div class="construction" style="width: auto; height: 250px;"></div>
<p>&#169; chopster44</p> </div>
</footer> <div class="div footer">
<p>&#169; chopster44 | Page last edited: 2024-07-07</p>
</div>
</body> </body>
</html> </html>

View File

@@ -1,32 +1,28 @@
<!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">
<link href="index.css" rel="stylesheet"> <link href="index.css" rel="stylesheet">
<title>rockets</title> <title>chptr</title>
</head> </head>
<body> <body>
<header> <a href="index.html"><img src="https://chopster44.com/img/pfp.png" width="141" class="div logo"></a>
<img src="https://chopster44.com/img/pfp.png" width="141"> <h1 class="div title">Chopster44</h1>
<div id="menu"> <div class="div nav">
<h1>Chopster44</h1> <p>Personal</p>
<a href="/#about">[About]</a> <a href="/about.html">[About]</a>
<a href="/blog">[Blog]</a> <a href="/blog.html">[Blog]</a>
<a href="/projects">[Projects]</a> <p>Interests</p>
<a href="/rockets">[Rockets]</a> <a href="/projects.html">[Projects]</a>
<a href="/linux">[Linux]</a> <a href="/rockets.html">[Rockets]</a>
<p>Other Web</p>
<a href="#">[Buttons]</a>
<a href="/contact.html">[Contact]</a>
</div>
<div class="div main construction">
</div>
<div class="div footer">
<p>&#169; chopster44 | Page last edited: 2024-07-07</p>
</div> </div>
</header>
<main>
<h2>Rockets</h2>
<p> ¬ I'm going to put some details about the rockets I've built on here. <br>
¬ I haven't gotten around to adding any yet</p>
</main>
<footer>
<p>&#169; chopster44</p>
</footer>
</body> </body>
</html> </html>

44
template.html Normal file
View File

@@ -0,0 +1,44 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link href="index.css" rel="stylesheet">
<title>chptr</title>
</head>
<body>
<a href="index.html"><img src="https://chopster44.com/img/pfp.png" width="141" class="div logo"></a>
<h1 class="div title">Chopster44</h1>
<div class="div nav">
<p>Personal</p>
<a href="/about.html">[About]</a>
<a href="/blog.html">[Blog]</a>
<p>Interests</p>
<a href="/projects.html">[Projects]</a>
<a href="/rockets.html">[Rockets]</a>
<p>Other Web</p>
<a href="#">[Buttons]</a>
<a href="/contact.html">[Contact]</a>
</div>
<div class="div main">
<div id="about">
<h2>About me</h2>
<p>
Hi, I'm chopster44 and this is my website. Here I put anything I have worked on/used/made which I think
is cool. This isn't a professional site so things might get a bit messy/all over the place and hard to
navigate. I hope you enjoy looking around!
<br>
If you want to ask me something about anything here, take a look at <a href="contact">[Contact]</a>.
</p>
</div>
<div class="changelog">
<h2>Changes</h2>
<div>
<p>2024-07-06 - new page layouts, updated some text</p>
</div>
</div>
</div>
<div class="div footer">
<p>&#169; chopster44 | Page last edited: 2024-07-07</p>
</div>
</body>
</html>