Cleanup homepage

This commit is contained in:
2024-05-28 18:18:12 -03:00
parent a17e00b45a
commit 3316025edb
20 changed files with 36 additions and 255 deletions

View File

@ -3,82 +3,54 @@
<head>
<meta charset="UTF-8">
<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="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="apple-mobile-web-app-title" content="Isaac's Website">
<link rel="icon" type="image/png" sizes="512x512" href="/favicon.png">
<meta name="application-name" content="Isaac's Website">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="Keywords" content="blog, git, , isaac, shoebottom, jellyfin">
<meta name="Description" content="Isaac Shoebottom's website homepage!">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
<script>
function modeSwitch() {
const darkModeButton = document.getElementById("dark-mode-button")
const bodyElement = document.querySelector('body')
if (darkModeButton.checked) {
bodyElement.style.backgroundColor = "rgb(25, 25, 25)"
bodyElement.style.color = "rgb(240, 240, 240)"
localStorage.setItem("root.darkMode", true)
}
else {
bodyElement.style.backgroundColor = "rgb(240, 240, 240)"
bodyElement.style.color = "rgb(25, 25, 25)"
localStorage.setItem("root.darkMode", false)
}
// Detects the user's preferred color scheme and sets the theme accordingly
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
document.getElementsByTagName('html')[0].setAttribute('data-bs-theme', 'dark');
} else {
document.getElementsByTagName('html')[0].setAttribute('data-bs-theme', 'light');
}
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', event => {
let theme = event.matches ? "dark" : "light";
document.getElementsByTagName('html')[0].setAttribute('data-bs-theme', theme);
});
</script>
<title>Isaac's Website</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="text">
<body class="container-fluid">
<div class="d-flex align-items-center flex-column">
<h1>Isaac's Homepage</h1>
<div id="dark-mode">
<h3>Dark Mode</h3>
<div class="button r center" id="button-1">
<input type="checkbox" class="checkbox" id="dark-mode-button" onclick="modeSwitch()">
<div class="knobs"></div>
<div class="layer"></div>
<div>
<div>
<div>List of things on this domain!</div>
<ul>
<li><a href="https://blog.shoebottom.ca">Blog</a></li>
<li><a href="https://git.shoebottom.ca">Git Forge</a></li>
<li><a href="https://live.shoebottom.ca">Livestream</a></li>
<li><a href="https://jellyfin.shoebottom.ca">Jellyfin</a></li>
<li><a href="https://jellyfin-vue.shoebottom.ca">Jellyin Vue</a></li>
<li><a href="https://searx.shoebottom.ca">Searx</a></li>
<li><a href="https://cobalt.shoebottom.ca">Cobalt</a></li>
<li><a href="https://culturalconnections.shoebottom.ca">Cultural Connections</a></li>
</ul>
</div>
<div>
<div>Link tree</div>
<ul>
<li><a href="https://github.com/IsaacShoebottom">GitHub</a></li>
<li><a href="https://steamcommunity.com/id/IsaacShoebottom/">Steam</a></li>
<li><a href="https://www.youtube.com/@IsaacShoebottom">YouTube</a></li>
<li><a href="https://www.linkedin.com/in/isaac-shoebottom/">LinkedIn 🤮</a></li>
</ul>
</div>
</div>
<p>List of things on this domain!</p>
<ul>
<li><a href="https://blog.shoebottom.ca">My Blog</a></li>
<li><a href="https://git.shoebottom.ca">My Git repos</a></li>
<li><a href="https://live.shoebottom.ca">Livestream</a></li>
<li><a href="https://jellyfin.shoebottom.ca">Jellyfin</a></li>
<!-- <li><a href="https://dynmap.shoebottom.ca">Minecraft Dynmap</a></li> -->
<!-- <li><a href="/host/memes/">Memes</a></li> -->
<!-- <li><a href="/music/">Music</a></li> -->
<!-- <li><a href="/tv/">TV</a></li> -->
<!-- <li><a href="/movies/">Movies</a></li> -->
<!-- <li><a href="/anime/">Anime</a></li> -->
</ul>
</div>
<script>
let darkModeCheck = localStorage.getItem("root.darkMode")
if (darkModeCheck === "true") {
const darkModeCheckbox = document.getElementById("dark-mode-button")
darkModeCheckbox.checked = true
modeSwitch()
}
</script>
</body>
<div class="image">
<img src="image.jpg" alt="Biden's America" class="image">
<img src="image2.jpg" alt="It's ok little minion" class="image">
<img src="https://i.imgur.com/aEyOuaF.png" width="30%" height="30%" alt="It's the crazy frog!" class="image">
</div>
</html>