commit f83ea8997efe58f15198308ae765f102a66c269c
parent 4f08cc45e5d940c256cc277ca96de6cc54953a6d
Author: Shipwreckt <Shipwreckt@mailfence.com>
Date: Mon, 10 Jun 2024 16:59:23 +0100
updated website and added some css also a new article
Diffstat:
3 files changed, 85 insertions(+), 30 deletions(-)
diff --git a/public/articles/1Learning_C.html b/public/articles/1Learning_C.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Shipwreckt</title>
+ <link rel="icon" href="../Images/logo.jpg" type="image/x-icon">
+ <link rel="stylesheet" href="../styles.css">
+</head>
+<body>
+ <div class="sidebar">
+ <h2>Table of Contents</h2>
+ <ul>
+ <li><a href="#article">Article</a></li>
+ </ul>
+ </div>
+ <div class="content">
+ <header>
+ <h1><a href ="https://shipwreckt.co.uk">Shipwreckt</a></h1>
+ <hr style="width:50%;text-align:center;">
+ <nav>
+ <ul>
+ <li><a href="../index.html">Home</a></li>
+ <li><a href="../index.html#projects">Projects</a></li>
+ <li><a href="../index.html#Articles">Articles</a></li>
+ <li><a href="../index.html#contact">Contact</a></li>
+ </ul>
+ </nav>
+ </header>
+ <main id="main-content">
+ <h2>Learning the C programming language</h2>
+ <h3>Date: 10:6:2024</h3>
+ <hr>
+ <p>Hello there, I have not updated this website in the last few days or posted much to GitLab, so I thought I might as well publish something to keep some people updated.</p>
+
+ <p>So as the title implies, I have been learning the C programming language recently, and it has been fun. I am still at the basics, and I have tests coming up, but I am doing my best with the time I have! i While I have been learning, I have been making a kind of tutorial file from the tutorial videos I have watched, so when I believe it is fully ready, I will publish it to GitLab.</p>
+
+ <font color="#800000">This page is still being updated as I learn more C so keep checking in! </font>
+ </main>
+ </div>
+ <script src="../script.js"></script>
+</body>
+</html>
+
diff --git a/public/index.html b/public/index.html
@@ -43,24 +43,23 @@
</section>
<section id="about">
- <div class="about-content">
- <div class="about-image">
- <img src="Images/logo.jpg" alt="About Me Image">
- </div>
- <div class="about-text">
- <h2>About Me</h2>
- <p>Hello there! I am Shipwreckt, a 15-year-old dude who lives in the UK, if you cannot tell I like to program!</p>
-
- <p>I have enjoyed programming for a number of years now, ever since early 2022, but I only really delved into programming fully in late 2023, when I fully switched from Windows to Linux. The reason why I made the switch was because even though I can see Windows is not all that great, I wanted to challenge myself and also give myself a reason to program again, so I switched over to Linux, and it has been amazing. It has given me the freedom to be creative with my desktop and config files. But I am currently learning the C programming language, and I am planning on making some more programs, so keep your eyes peeled for when I do!</p>
- <hr>
- <ul>
- <li><a href="about/hardware">Hardware I am using</a></li>
- <li><a href="about/software">Software I use</a></li>
- </ul>
- </div>
- </div>
-</section>
+ <div class="about-content">
+ <div class="about-image">
+ <img src="Images/logo.jpg" alt="About Me Image">
+ </div>
+ <div class="about-text">
+ <h2>About Me</h2>
+ <p>Hello there! I am Shipwreckt, a 15-year-old dude who lives in the UK, if you cannot tell I like to program!</p>
+ <p>I have enjoyed programming for a number of years now, ever since early 2022, but I only really delved into programming fully in late 2023, when I fully switched from Windows to Linux. The reason why I made the switch was because even though I can see Windows is not all that great, I wanted to challenge myself and also give myself a reason to program again, so I switched over to Linux, and it has been amazing. It has given me the freedom to be creative with my desktop and config files. But I am currently learning the C programming language, and I am planning on making some more programs, so keep your eyes peeled for when I do!</p>
+ <hr>
+ <ul>
+ <li><a href="about/hardware">Hardware I am using</a></li>
+ <li><a href="about/software">Software I use</a></li>
+ </ul>
+ </div>
+ </div>
+ </section>
<section id="contact" style="display: none;">
<h2>Contact</h2>
@@ -95,8 +94,16 @@
<section id="Articles" style="display: none;">
<div class="article">
+ <h2><a href="articles/1Learning_C.html">Learning the C programming language</a></h2>
+ <p>Date: June 10th, 2024</p>
+ <p>My journy of learning C with notes and updates.</p>
+ <font color="#800000">This artical is still being wrote.</font>
+ </div>
+
+ <div class="article">
<h2><a href="articles/0How_To_Stay_Safe_Online.html#article">How to stay safe online</a></h2>
<p>Date: May 30, 2024</p>
+ <p>This article is about how I stay safe online and what programs I use to do so.</p>
</div>
</section>
</main>
diff --git a/public/styles.css b/public/styles.css
@@ -1,3 +1,4 @@
+/* Reset CSS */
body {
font-family: Arial, sans-serif;
margin: 0;
@@ -7,6 +8,7 @@ body {
display: flex;
}
+/* Sidebar Styles */
.sidebar {
position: fixed;
top: 0;
@@ -20,7 +22,7 @@ body {
}
.sidebar:hover {
- width: 300px;
+ width: 300px;
}
.sidebar h2 {
@@ -52,8 +54,9 @@ body {
color: #f9f9f9;
}
+/* Content Styles */
.content {
- margin-left: 240px;
+ margin-left: 240px;
padding: 20px;
flex: 1;
}
@@ -69,7 +72,7 @@ header {
header a {
color: #ffffff;
text-align: center;
- text-decoration: none;
+ text-decoration: none;
}
header hr {
@@ -112,11 +115,9 @@ nav ul li a:hover {
border-radius: 5px;
}
+/* Main Content Styles */
main {
- background-color: #1f1f1f;
padding: 20px;
- border-radius: 10px;
- box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
margin-top: 20px;
}
@@ -137,13 +138,7 @@ main a:hover {
text-decoration: underline;
}
-.center {
- display: block;
- margin-left: auto;
- margin-right: auto;
- width: 70%;
-}
-
+/* About Section Styles */
.about-content {
display: flex;
align-items: center;
@@ -162,6 +157,15 @@ main a:hover {
border: 5px solid #7a4d7c;
}
+/* Article Styles */
+.article {
+ background-color: #171717;
+ padding: 20px;
+ margin-bottom: 20px; /* Margin between articles */
+ border-radius: 10px;
+ box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); /* Box shadow */
+}
+
#Articles a {
color: #7a4d7c;
}
