From 607bb683f00089cb03582ec7b4602a7ed520c66b Mon Sep 17 00:00:00 2001 From: Reimar Date: Sun, 31 Dec 2023 12:05:29 +0100 Subject: [PATCH] Revamp content on website --- api/random_repo.php | 6 ++ assets/script/navigation.js | 79 +++++++++--------- assets/style/dark-mode.css | 8 ++ assets/style/light-mode.css | 4 + assets/style/main.css | 10 ++- background/index.php | 9 +++ inc/background.inc | 15 ++++ inc/nav.inc | 6 +- inc/sidebar.inc | 2 +- index.php | 155 +++++++++++++++++++++--------------- 10 files changed, 186 insertions(+), 108 deletions(-) create mode 100644 api/random_repo.php diff --git a/api/random_repo.php b/api/random_repo.php new file mode 100644 index 0000000..f45c85f --- /dev/null +++ b/api/random_repo.php @@ -0,0 +1,6 @@ +data; + $repo = $repos[array_rand($repos)]; + header("Location: $repo->html_url"); + diff --git a/assets/script/navigation.js b/assets/script/navigation.js index 14298c1..7e4cf8c 100644 --- a/assets/script/navigation.js +++ b/assets/script/navigation.js @@ -3,65 +3,66 @@ window.addEventListener("load", makeLinksDynamic, false); function makeLinksDynamic() { - var navLinks = document.getElementsByClassName("nav-button"); - for (var i = 0; i < navLinks.length; i++) { - navLinks[i].onclick = function(e) { + var navLinks = document.getElementsByClassName("js-link"); + for (var i = 0; i < navLinks.length; i++) { + navLinks[i].onclick = function(e) { - var event = e || window.event; - var target = event.target || event.srcElement; + var event = e || window.event; + var target = event.target || event.srcElement; - if (target.nodeName !== "A" || event.ctrlKey || document.body.className.indexOf("loading") !== -1) return; + if (target.nodeName !== "A" || event.ctrlKey || document.body.className.indexOf("loading") !== -1) return; - loadUrl(target.href, function() { - if (window.history && history.pushState) { - history.pushState(null, "", target.href); - } - }); + loadUrl(target.href, function() { + if (window.history && history.pushState) { + history.pushState(null, "", target.href); + } + }); - event.preventDefault(); - event.returnValue = false; + event.preventDefault(); + event.returnValue = false; - } - } + } + } } window.addEventListener("popstate", function() { - loadUrl(location.href); + loadUrl(location.href); }, false); function loadUrl(href, callback) { - document.body.className += " loading"; + document.body.className += " loading"; - var xhr = new XMLHttpRequest(); - xhr.onreadystatechange = function() { - if (this.readyState === 4) { + var xhr = new XMLHttpRequest(); + xhr.onreadystatechange = function() { + if (this.readyState === 4) { - if (this.status !== 200) location.href = href; + if (this.status !== 200) location.href = href; - try { - var tags = ["main", "nav"]; - for (var i = 0; i < tags.length; i++) { - document.querySelector(tags[i]).innerHTML = this.responseText.match(new RegExp("<" + tags[i] + ">([\\s\\S]+)<\\/" + tags[i] + ">"))[1]; - } - } catch(e) { - location.href = href; - } + try { + var tags = ["main", "nav", "aside", "footer"]; + for (var i = 0; i < tags.length; i++) { + document.querySelector(tags[i]).innerHTML = this.responseText.match(new RegExp("<" + tags[i] + ">([\\s\\S]*)<\\/" + tags[i] + ">"))[1]; + } + } catch(e) { + console.error(e); + location.href = href; + } - // Dispatch load event - var loadEvent = document.createEvent('Event'); - loadEvent.initEvent('load', false, false); - window.dispatchEvent(loadEvent); + // Dispatch load event + var loadEvent = document.createEvent('Event'); + loadEvent.initEvent('load', false, false); + window.dispatchEvent(loadEvent); - if (callback) callback(); + if (callback) callback(); - document.body.className = document.body.className.replace(/\s*loading/g, ""); + document.body.className = document.body.className.replace(/\s*loading/g, ""); - } - } - xhr.open("GET", href); - xhr.send(); + } + } + xhr.open("GET", href); + xhr.send(); } diff --git a/assets/style/dark-mode.css b/assets/style/dark-mode.css index 5b00465..a28090d 100644 --- a/assets/style/dark-mode.css +++ b/assets/style/dark-mode.css @@ -77,3 +77,11 @@ body { display: none !important; } +#typeracer-badge { + filter: grayscale() invert(); +} + +#view-background { + color: rgba(255, 255, 255, 0.3); +} + diff --git a/assets/style/light-mode.css b/assets/style/light-mode.css index ea772db..5eea574 100644 --- a/assets/style/light-mode.css +++ b/assets/style/light-mode.css @@ -77,3 +77,7 @@ body { display: none !important; } +#view-background { + color: rgba(0, 0, 0, 0.3); +} + diff --git a/assets/style/main.css b/assets/style/main.css index 56f757f..853d727 100644 --- a/assets/style/main.css +++ b/assets/style/main.css @@ -8,7 +8,7 @@ body { position: fixed; width: 100%; width: 100vw; - height: 100vh; + max-height: 100vh; font-family: Arial, sans-serif; /* Prevent user from selecting whitespace between containers */ user-select: none; @@ -242,6 +242,13 @@ h1, h2 { image-rendering: pixelated; } +#view-background { + display: inline-block; + font-size: 0.6em; + text-decoration: none; + margin-bottom: 15px; +} + /* Fixes */ /* IE 9-11 has a bug which makes the ch css unit unusable, this will make it use the inputs size attribute instead */ @@ -265,3 +272,4 @@ object { img { border: none; /* Fix ico images on internet explorer */ } + diff --git a/background/index.php b/background/index.php index df25c87..44fa5e3 100644 --- a/background/index.php +++ b/background/index.php @@ -4,6 +4,15 @@ + +
+
+ +
+ + diff --git a/inc/background.inc b/inc/background.inc index de7b343..8d0a53b 100644 --- a/inc/background.inc +++ b/inc/background.inc @@ -1 +1,16 @@
+ +
+ + diff --git a/inc/nav.inc b/inc/nav.inc index 846a63c..effc91c 100644 --- a/inc/nav.inc +++ b/inc/nav.inc @@ -13,10 +13,10 @@ $is_selected = $link[0] == $path || $link[0] == rtrim($path, '/'); echo $is_selected ? - "$link[1]" : - "$link[1]"; + "$link[1]" : + "$link[1]"; } - + ?> diff --git a/inc/sidebar.inc b/inc/sidebar.inc index 57f0558..8d46aaa 100644 --- a/inc/sidebar.inc +++ b/inc/sidebar.inc @@ -15,7 +15,7 @@ - + ✓ diff --git a/index.php b/index.php index 13a62fd..f7d0907 100644 --- a/index.php +++ b/index.php @@ -3,88 +3,115 @@ ?> - + - - + + - + -
+
-
-
-
+
+
+
-
-

Welcome

- I'm year old programmer from Denmark -
+
+ - - LinkedIn - - - - GitHub - - - - GitHub - - -
+

Welcome

+ I'm year old programmer from Denmark. +
+ I mainly code in JavaScript, PHP, C and Rust. +
+ I can also type between 100-130 words per minute. +
+ This website is being hosted on a Raspberry Pi at my home, along with some other services that can be found on this site. +

-
-

Projects

-
- - Popup Timer -
- Have a timer or stopwatch in the corner of your screen, directly from within your browser -
- Open in browser + LinkedIn + + LinkedIn + +
-
+ + + GitHub + + + + GitHub + + + GitHub + - - Game of life -
- Conway's Game of Life created with the win32 API -
- - Download for Windows - • - View on GitHub - +
+
-
+
+

Projects

+ These are some of the projects I've made: +
+ + Popup Timer +
+ Have a timer or stopwatch in the corner of your screen, directly from within your browser +
+ Open in browser - - Reimtris -
- A Tetris clone written in Rust with epic background music -
- - Download for Windows - • - Download for Linux - +
+ + Game of life +
+ Conway's Game of Life created with the win32 API +
+ + Download for Windows + • + View on GitHub + +
-
+ + Reimtris +
+ A Tetris clone written in Rust with epic background music +
+ + Download for Windows + • + Download for Linux + +
-
-
-
+ --> -
+
- +