Added favicon, style.css, and basic about me page
23
about-me.html
Normal file
|
|
@ -0,0 +1,23 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
|
<title>About Me</title>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
<script src="header.js" defer></script>
|
||||||
|
<site-header></site-header>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="row" style="background-color: #454a77; border-radius: 128px; padding-top: 10px; padding-bottom: 10px;">
|
||||||
|
<div class="column" style="flex: auto;">
|
||||||
|
<img src="media/bonard.jpg" alt="Bonard" style="max-width: 256px; max-height: 256px; margin-left: 0%; border: 2px solid #ff2a2a66; border-radius: 50%;" width="100%" height="100%">
|
||||||
|
</div>
|
||||||
|
<div class="column">
|
||||||
|
<h1 style="text-align: left; margin-right: 15%;">About Me</h1>
|
||||||
|
<p style="margin-right: 10%;">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Nobis excepturi voluptatem quia? Ipsum sequi incidunt laudantium fuga, impedit exercitationem nobis consequuntur. Aut architecto ipsum explicabo voluptate est quas omnis maiores?</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
14
about.html
|
|
@ -1,14 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
||||||
<title>About Me</title>
|
|
||||||
<script src="header.js" defer></script>
|
|
||||||
<site-header></site-header>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
About
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
BIN
android-chrome-192x192.png
Normal file
|
After Width: | Height: | Size: 5.3 KiB |
BIN
android-chrome-512x512.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
apple-touch-icon.png
Normal file
|
After Width: | Height: | Size: 7 KiB |
BIN
favicon-16x16.png
Normal file
|
After Width: | Height: | Size: 622 B |
BIN
favicon-32x32.png
Normal file
|
After Width: | Height: | Size: 1,019 B |
BIN
favicon.ico
Normal file
|
After Width: | Height: | Size: 15 KiB |
35
index.html
|
|
@ -5,10 +5,43 @@
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
<title>Home</title>
|
<title>Home</title>
|
||||||
|
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
|
||||||
|
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
|
||||||
|
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
|
||||||
|
<link rel="manifest" href="site.webmanifest">
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
<script src="header.js" defer></script>
|
<script src="header.js" defer></script>
|
||||||
|
<style>
|
||||||
|
.row {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-left: 10%;
|
||||||
|
margin-right: 10%;
|
||||||
|
}
|
||||||
|
.column {
|
||||||
|
flex: 50%;
|
||||||
|
align-items: center;
|
||||||
|
padding-left: 10px;
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
img {
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
<site-header></site-header>
|
<site-header></site-header>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
Home
|
<div class="row">
|
||||||
|
<div class="column">
|
||||||
|
<h1>Welcome to Halfheart.net!</h1>
|
||||||
|
<p style="text-align: center;">Welcome to Halfheart.net! This website is home to the Halfheart minecraft servers, my personal projects, and really anything else I want. Have fun.</p>
|
||||||
|
<br>
|
||||||
|
<p style="text-align: center;">This page is actively being worked on! Most things are probobly broken or incomplete. Don't tell me that they are, I know.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<iframe width="560" height="315" style="margin-left: auto; margin-right: auto;" src="https://www.youtube.com/embed/BuKft9LpL_0?si=ZBioDC66lEvgbuIg" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
|
|
@ -9,7 +9,11 @@
|
||||||
<site-header></site-header>
|
<site-header></site-header>
|
||||||
<style>
|
<style>
|
||||||
body {
|
body {
|
||||||
|
height: 100vh;
|
||||||
|
width: 100vw;
|
||||||
|
margin: 0;
|
||||||
background: url(media/mc\ header.png) no-repeat top center;
|
background: url(media/mc\ header.png) no-repeat top center;
|
||||||
|
background-size: cover;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
BIN
media/2026-06-14_20.24.02.png
Normal file
|
After Width: | Height: | Size: 4.2 MiB |
BIN
media/2026-06-14_20.25.44.png
Normal file
|
After Width: | Height: | Size: 4.3 MiB |
BIN
media/bonard.jpg
Normal file
|
After Width: | Height: | Size: 58 KiB |
|
|
@ -1,5 +1,10 @@
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||||||
<style>
|
<style>
|
||||||
|
:host {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--primary-glow: #ff2a2a;
|
--primary-glow: #ff2a2a;
|
||||||
--active-bg: #aa0404;
|
--active-bg: #aa0404;
|
||||||
|
|
@ -15,7 +20,7 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 15px;
|
gap: 15px;
|
||||||
margin: 20px auto;
|
margin: 0 auto;
|
||||||
width: 92%;
|
width: 92%;
|
||||||
max-width: 1920px;
|
max-width: 1920px;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
@ -64,11 +69,10 @@
|
||||||
align-items: stretch;
|
align-items: stretch;
|
||||||
position: relative;
|
position: relative;
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
|
|
||||||
height: var(--header-height);
|
height: var(--header-height);
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
z-index: 5;
|
border: 2px solid #ff2a2a66
|
||||||
}
|
}
|
||||||
|
|
||||||
.topnav a {
|
.topnav a {
|
||||||
|
|
@ -82,6 +86,7 @@
|
||||||
position: relative;
|
position: relative;
|
||||||
transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
|
transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
|
flex-grow: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.topnav a::after {
|
.topnav a::after {
|
||||||
|
|
@ -191,7 +196,7 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
<br>
|
||||||
<div class="header-container" id="headerContainer">
|
<div class="header-container" id="headerContainer">
|
||||||
|
|
||||||
<div class="logo-capsule">
|
<div class="logo-capsule">
|
||||||
|
|
@ -202,12 +207,13 @@
|
||||||
|
|
||||||
<div class="topnav" id="myTopnav">
|
<div class="topnav" id="myTopnav">
|
||||||
<a href="index.html" id="home" class="inactive">Home</a>
|
<a href="index.html" id="home" class="inactive">Home</a>
|
||||||
<a href="about.html" id="about-me" class="inactive">About Me</a>
|
<a href="about-me.html" id="about-me" class="inactive">About Me</a>
|
||||||
<a href="projects.html" id="projects" class="inactive">Projects</a>
|
<a href="projects.html" id="projects" class="inactive">Projects</a>
|
||||||
<a href="mcservers.html" id="minecraft-servers" class="inactive">Minecraft Server</a>
|
<a href="mc-servers.html" id="minecraft-servers" class="inactive">Minecraft Server</a>
|
||||||
<a href="javascript:void(0);" class="icon" onclick="toggleMobileMenu()">
|
<a href="javascript:void(0);" class="icon" onclick="toggleMobileMenu()">
|
||||||
<i class="fa fa-bars"></i>
|
<i class="fa fa-bars"></i>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
<br>
|
||||||
1
site.webmanifest
Normal file
|
|
@ -0,0 +1 @@
|
||||||
|
{"name":"Halfheart.net","short_name":"Halfheart","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
|
||||||
34
style.css
Normal file
|
|
@ -0,0 +1,34 @@
|
||||||
|
@import url(https://fonts.googleapis.com/css?family=Audiowide);
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-family: "Audiowide", serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
color: red;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
font-family: Arial, Helvetica, sans-serif;
|
||||||
|
font-weight: normal;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
height: 100vh;
|
||||||
|
background-color: #1e1d20;
|
||||||
|
}
|
||||||
|
.row {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-left: 10%;
|
||||||
|
margin-right: 10%;
|
||||||
|
}
|
||||||
|
.column {
|
||||||
|
flex: 50%;
|
||||||
|
align-items: center;
|
||||||
|
padding-left: 10px;
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
img {
|
||||||
|
display: block;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||