From a0d07fc09976dd7b24f3b8ffe9fa50522077a843 Mon Sep 17 00:00:00 2001 From: 0xmac Date: Mon, 23 Sep 2024 20:36:29 +0200 Subject: [PATCH] Reworked shitty theme handeling --- contact/index.html | 5 +- global/global.js | 249 ++++++++-------- index.html | 6 +- info/index.html | 5 +- posts/content/ai-criticism.html | 9 +- posts/content/recommendations.html | 5 +- posts/index.html | 14 +- projects/index.html | 5 +- src/style.css | 452 ----------------------------- 9 files changed, 159 insertions(+), 591 deletions(-) delete mode 100644 src/style.css diff --git a/contact/index.html b/contact/index.html index 7752028..cd1151a 100644 --- a/contact/index.html +++ b/contact/index.html @@ -4,7 +4,9 @@ - + + + Get in contact with me @@ -63,6 +65,5 @@ - diff --git a/global/global.js b/global/global.js index d6a7ad0..b57d643 100644 --- a/global/global.js +++ b/global/global.js @@ -47,24 +47,25 @@ navContent = [ /* Global buttons located in the footer of the page */ /* Alt Text, Target Link, Image Source */ funButtons = [ - ["CC BY-SA 4.0", "https://creativecommons.org/licenses/by-sa/4.0/", "global/cc-by-sa.png"], - ["Right to repair", "", "global/right2repair.gif"], - ["Made with VSCodium", "https://vscodium.com/", "global/vscodium.png"], - ["Made on Gnu/Linux", "https://www.gnu.org/home.en.html", "global/gnu-linux.gif"], - ["Windows 10, NO", "", "global/win10no.gif"], -// ["No NFT's", "", "global/nftbutton.gif"], - ["Anything but Chrome", "https://librewolf.net/", "global/nochrome.png"], - ["UBlock Origin Now!", "https://ublockorigin.com/", "global/ublock.png"], - ["Get a Website - Landchad", "https://landchad.net/", "global/landchad.gif"], - ["Internet Privacy Now!", "https://anonymousplanet.org/", "global/internetprivacy.gif"], - ["Encrypt Your Shit", "https://gitlab.com/cryptsetup/cryptsetup", "global/encryptyourshit.gif"], - ["No Web 3!", "", "global/noweb3.gif"], + ["CC BY-SA 4.0", "https://creativecommons.org/licenses/by-sa/4.0/", "global/buttons/cc-by-sa.png"], + ["Right to repair", "", "global/buttons/right2repair.gif"], + ["Made with VSCodium", "https://vscodium.com/", "global/buttons/vscodium.png"], + ["Made on Gnu/Linux", "https://www.gnu.org/home.en.html", "global/buttons/gnu-linux.gif"], + ["Windows 10, NO", "", "global/buttons/win10no.gif"], +// ["No NFT's", "", "global/buttons/nftbutton.gif"], + ["Anything but Chrome", "https://librewolf.net/", "global/buttons/nochrome.png"], + ["UBlock Origin Now!", "https://ublockorigin.com/", "global/buttons/ublock.png"], + ["Get a Website - Landchad", "https://landchad.net/", "global/buttons/landchad.gif"], + ["Internet Privacy Now!", "https://anonymousplanet.org/", "global/buttons/internetprivacy.gif"], + ["Encrypt Your Shit", "https://gitlab.com/cryptsetup/cryptsetup", "global/buttons/encryptyourshit.gif"], + ["No Web 3!", "", "global/buttons/noweb3.gif"], ]; /* Available Themes located in the footer */ var styles = ["Tomorrow", "Forgotten", "Yotsuba"]; + /* Update CSS Colorscheme function for themes */ function updateStyle(type){ var doc = document.documentElement; @@ -107,159 +108,165 @@ function updateStyle(type){ } } +function LoadWebsite(){ -let dirDepth = document.getElementById("toplevel").getAttribute("data-"); -document.getElementById("toplevel").textContent = ""; + let dirDepth = document.getElementById("toplevel").getAttribute("data-"); + document.getElementById("toplevel").textContent = ""; -const WEBSIDENAME = document.URL; + const WEBSIDENAME = document.URL; -var footing = document.getElementById("footnote"); + var footing = document.getElementById("footnote"); -/* Footer Section */ + /* Footer Section */ -/* Image Buttons */ + /* Image Buttons */ -var title = document.createElement("h2"); -title.setAttribute("class", "titlebar"); -title.textContent = "Page Info"; + var title = document.createElement("h2"); + title.setAttribute("class", "titlebar"); + title.textContent = "Page Info"; -footing.appendChild(title); + footing.appendChild(title); -if (document.getElementById("please-no-buttons") == null){ - var button_container = document.createElement("div"); - button_container.setAttribute("class", "button-container"); + if (document.getElementById("please-no-buttons") == null){ + var button_container = document.createElement("div"); + button_container.setAttribute("class", "button-container"); - for (let i = 0; i < funButtons.length; i++) { - link = document.createElement("a"); - if (funButtons[Number(i)][1] != ""){ - link.setAttribute("href", funButtons[Number(i)][1]); + for (let i = 0; i < funButtons.length; i++) { + link = document.createElement("a"); + if (funButtons[Number(i)][1] != ""){ + link.setAttribute("href", funButtons[Number(i)][1]); + } + link.setAttribute("target", "_blank"); + + img = document.createElement("img"); + img.setAttribute("src", dirDepth + funButtons[Number(i)][2]); + img.setAttribute("alt", funButtons[Number(i)][0]); + img.setAttribute("class", "license-img"); + link.appendChild(img); + + button_container.appendChild(link); } - link.setAttribute("target", "_blank"); - - img = document.createElement("img"); - img.setAttribute("src", dirDepth + funButtons[Number(i)][2]); - img.setAttribute("alt", funButtons[Number(i)][0]); - img.setAttribute("class", "license-img"); - link.appendChild(img); - - button_container.appendChild(link); + footing.appendChild(button_container); } - footing.appendChild(button_container); -} -/* Global "Page last updated" text, reading the modified date of the page */ + /* Global "Page last updated" text, reading the modified date of the page */ -/* Have to flip Months w. Days for European style Date MM.DD.YYYY to DD.MM.YYYY */ -var docDate = ((("" + document.lastModified).replaceAll(",", " at ")).replaceAll("/", ".")).split("."); -docSave = docDate[0]; -docDate[0] = docDate[1]; -docDate[1] = docSave; -docDate = "Page last updated: " + ((docDate.toString().replaceAll(",", ".")).replaceAll(" ", " at ")); + /* Have to flip Months w. Days for European style Date MM.DD.YYYY to DD.MM.YYYY */ + var docDate = ((("" + document.lastModified).replaceAll(",", " at ")).replaceAll("/", ".")).split("."); + docSave = docDate[0]; + docDate[0] = docDate[1]; + docDate[1] = docSave; + docDate = "Page last updated: " + ((docDate.toString().replaceAll(",", ".")).replaceAll(" ", " at ")); -var last_updated = document.createElement("p"); -last_updated.setAttribute("class", "text-center"); -last_updated.textContent = docDate; + var last_updated = document.createElement("p"); + last_updated.setAttribute("class", "text-center"); + last_updated.textContent = docDate; -footing.appendChild(last_updated); + footing.appendChild(last_updated); -// Footer + // Footer -const LICENCE_LINK = "https://creativecommons.org/licenses/by-sa/4.0/"; -const LICENCE_NAME = "CC BY-SA 4.0"; + const LICENCE_LINK = "https://creativecommons.org/licenses/by-sa/4.0/"; + const LICENCE_NAME = "CC BY-SA 4.0"; -var footer = document.getElementById("footer"); + var footer = document.getElementById("footer"); -var span = document.createElement("p"); -span.setAttribute("class", "nobr"); -span.setAttribute("class", "text-center"); -span.textContent = "Website licensed under\u00A0"; + var span = document.createElement("p"); + span.setAttribute("class", "nobr"); + span.setAttribute("class", "text-center"); + span.textContent = "Website licensed under\u00A0"; -var span_license = document.createElement("a"); -span_license.setAttribute("href", LICENCE_LINK); -span_license.setAttribute("class", "nobr"); -span.setAttribute("class", "text-center"); -span_license.textContent = LICENCE_NAME; -span.appendChild(span_license); + var span_license = document.createElement("a"); + span_license.setAttribute("href", LICENCE_LINK); + span_license.setAttribute("class", "nobr"); + span.setAttribute("class", "text-center"); + span_license.textContent = LICENCE_NAME; + span.appendChild(span_license); -footing.appendChild(span); + footing.appendChild(span); -// Webside name + // Webside name -var webside_name = document.createElement("a"); -webside_name.setAttribute("class", "text-center"); -webside_name.setAttribute("href", WEBSIDENAME); -webside_name.textContent = WEBSIDENAME; + var webside_name = document.createElement("a"); + webside_name.setAttribute("class", "text-center"); + webside_name.setAttribute("href", WEBSIDENAME); + webside_name.textContent = WEBSIDENAME; -footing.appendChild(webside_name); + footing.appendChild(webside_name); -var button_span = document.createElement("span"); -button_span.setAttribute("class", "prefSpan") -button_span.textContent = "Style: " + var button_span = document.createElement("span"); + button_span.setAttribute("class", "prefSpan") + button_span.textContent = "Style: " -var button_select = document.createElement("select"); -button_select.id = "styleselector"; + var button_select = document.createElement("select"); + button_select.id = "styleselector"; -for (let i = 0; i < styles.length; i++) { - var button_item = document.createElement("option"); - button_item.textContent = styles[Number(i)]; - button_item.value = styles[Number(i)]; - if (styles[Number(i)] === localStorage.getItem("style")) { button_item.selected = "selected"; } + for (let i = 0; i < styles.length; i++) { + var button_item = document.createElement("option"); + button_item.textContent = styles[Number(i)]; + button_item.value = styles[Number(i)]; + if (styles[Number(i)] === localStorage.getItem("style")) { button_item.selected = "selected"; } - button_select.appendChild(button_item); -} + button_select.appendChild(button_item); + } -button_span.appendChild(button_select); -footing.appendChild(button_span); + button_span.appendChild(button_select); + footing.appendChild(button_span); -if(dirDepth === ""){ - document.getElementById("agestamp").textContent = new Date(new Date().getTime() - new Date("March, 30, 2006").getTime()).getFullYear() - 1970; -} + if(dirDepth === ""){ + document.getElementById("agestamp").textContent = new Date(new Date().getTime() - new Date("March, 30, 2006").getTime()).getFullYear() - 1970; + } -/* Navbar Section */ + /* Navbar Section */ -if (document.getElementById("navbar") != null){ + if (document.getElementById("navbar") != null){ - var selectedNav = document.getElementById("selected-nav").getAttribute("data-"); + var selectedNav = document.getElementById("selected-nav").getAttribute("data-"); - var nav = document.getElementById("navbar"); + var nav = document.getElementById("navbar"); - for (let i = 0; i < navContent.length; i++) { - if (navContent[Number(i)][0] === "SEP"){ - tmpAdd = document.createElement("hr"); - tmpAdd.classList.add("navSep"); - document.getElementById("navbar").appendChild(tmpAdd); + for (let i = 0; i < navContent.length; i++) { + if (navContent[Number(i)][0] === "SEP"){ + tmpAdd = document.createElement("hr"); + tmpAdd.classList.add("navSep"); + document.getElementById("navbar").appendChild(tmpAdd); - } else { - href = navContent[Number(i)][2]; - sel = navContent[Number(i)][1].toLowerCase().includes(selectedNav.toLowerCase()); + } else { + href = navContent[Number(i)][2]; + sel = navContent[Number(i)][1].toLowerCase().includes(selectedNav.toLowerCase()); - if (navContent[Number(i)][0] === "P"){ - href = dirDepth + href; + if (navContent[Number(i)][0] === "P"){ + href = dirDepth + href; + } + + tmpAdd = document.createElement("a"); + tmpAdd.textContent = navContent[Number(i)][1]; + tmpAdd.setAttribute("href", href); + tmpAdd.classList.add("nav"); + + if (sel) { + tmpAdd.classList.add("selected-nav"); + } + + + document.getElementById("navbar").appendChild(tmpAdd); } + } + } - tmpAdd = document.createElement("a"); - tmpAdd.textContent = navContent[Number(i)][1]; - tmpAdd.setAttribute("href", href); - tmpAdd.classList.add("nav"); - - if (sel) { - tmpAdd.classList.add("selected-nav"); - } - - - document.getElementById("navbar").appendChild(tmpAdd); - } - } + var stylebutton = document.getElementById("styleselector"); + stylebutton.addEventListener("change", (event) => { + localStorage.setItem("style", event.target.value); + updateStyle(event.target.value); + }); } -var stylebutton = document.getElementById("styleselector"); -stylebutton.addEventListener("change", (event) => { - updateStyle(event.target.value); - localStorage.setItem("style", event.target.value); -}); +document.addEventListener("DOMContentLoaded", LoadWebsite); + updateStyle(localStorage.getItem("style")); + diff --git a/index.html b/index.html index 8267c70..9c5f3a4 100644 --- a/index.html +++ b/index.html @@ -4,7 +4,10 @@ - + + + + Homepage @@ -43,6 +46,5 @@ - diff --git a/info/index.html b/info/index.html index 07326f2..40ca6db 100644 --- a/info/index.html +++ b/info/index.html @@ -4,7 +4,9 @@ - + + + Website Info @@ -44,6 +46,5 @@ - diff --git a/posts/content/ai-criticism.html b/posts/content/ai-criticism.html index 47a78c7..6406efb 100644 --- a/posts/content/ai-criticism.html +++ b/posts/content/ai-criticism.html @@ -4,16 +4,18 @@ - + + + - Why future AI will devolve the human race + Future AI will devolve the human race

Go back

-

Why future AI will devolve the human race

+

Future AI will devolve the human race

It's no secret that AI already has made a substantial impact on our modern lives.
For some of us, "AI" has become just another tool that helps us trough the day. If one donsn't know something, if one can't formulate a letter or if they want a creepy picture of a cat wearing a suit, AI is there to help!

@@ -58,6 +60,5 @@ - diff --git a/posts/content/recommendations.html b/posts/content/recommendations.html index ff83fb7..85fb52c 100644 --- a/posts/content/recommendations.html +++ b/posts/content/recommendations.html @@ -4,7 +4,9 @@ - + + + Digital Recommendations @@ -116,6 +118,5 @@ - diff --git a/posts/index.html b/posts/index.html index 84ec3b7..1436a39 100644 --- a/posts/index.html +++ b/posts/index.html @@ -4,7 +4,9 @@ - + + + Public Posts @@ -20,11 +22,16 @@

Pinned Posts:

- 📌 11.09.2024 Digital Recommendations +
- 📅 21.09.2024 Why future AI will devolve the human race +
@@ -34,6 +41,5 @@ - diff --git a/projects/index.html b/projects/index.html index c7e3a9e..d0a96b5 100644 --- a/projects/index.html +++ b/projects/index.html @@ -4,7 +4,9 @@ - + + + My Projects @@ -25,6 +27,5 @@ - diff --git a/src/style.css b/src/style.css deleted file mode 100644 index b5c5134..0000000 --- a/src/style.css +++ /dev/null @@ -1,452 +0,0 @@ -:root { - -} - - - -* { - box-sizing:border-box -} - -body { - /*font-family: "FreePixel"; - font-size:16px;*/ - - font-family: var(--font-family); - - font-style: 13px/1.231; - font-size: var(--font-size); - - color:var(--main-fg-color); - - background: var(--main-bg-end-color) url(../src/fade.png) top repeat-x; - - margin:0; - padding-bottom:26px -} - -nav{ - width:100%; - height:40px; - position:inherit; - top:0; - - padding:0 20x; - z-index:1; - - text-align: center; - display: block; - margin-left: 20px; - -} - -.nav{ - display:flex; - justify-content:center; - align-items:center; - min-height:32px; - background:none; - text-decoration:none; - cursor:pointer; - - float:left; - clear:left; - text-align:center; - - margin-right: 20px; - margin-top: 10px; - - color: var(--main-fg-color); - - font-size: var(--font-size); - -} - -.navSep { - width: 80%; - float:left; - margin-bottom: 20px; -} - -main{ - width:100%; - min-height:calc(100vh - 60px - 26px); - - overflow-x:hidden; - padding:20px 20px; - - -} - -main>.content,#footnote{ - min-height: calc(80vh - 200px); - border-style: solid; - border-width: 1px; - background: var(--main-color); - margin-bottom: 10px; - - padding: 10px 10px 10px 10px; - - .titlebar { - margin: -10px -10px 0 -10px; - background: var(--main-bg-color); - color: var(--main-title-fg-color); - padding: 5px 5px 5px 10px; - margin-bottom: 10px; - } -} - -main>.fit,#footnote{ - min-height: fit-content; -} - -footer{ - height:fit-content; - background-color: var(--main-color); - color: var(--main-fg-color); - display:flex; - padding:0 10px; - align-items:center; - overflow-x:hidden; - position:fixed; - - font-family: "FreePixel"; - - bottom:0; - width:100% -} - -#footnote{ - margin-bottom: 20px; - height: max-content; - border-style: solid; - border-width: 1px; - - padding: 10px 10px 10px 10px; - - margin-right: auto; - margin-left: auto; - - background-color: var(--main-color); -} - -#gif{ - margin-left: auto; - margin-right: auto; - align-items: center; - scale: 100%; - - display:flex; - flex-wrap:wrap; - justify-content:center; - gap:10px; - - margin-bottom: 40px; - -} - -@font-face { - font-family: FreePixel; - font-style: normal; - font-weight: 400; - src: url("../src/FreePixel.ttf"); - } - - -@media (max-width: 576px) { - .nav::before,.nav::after{ - content: "/"; - } - - .navSep { - scale: 0%; - } - - .selected-nav{ - text-decoration-color: var(--main-fg-color); - text-decoration-line: underline; - } - - nav{ - position: inherit; - width: fit-content; - margin-left: auto; - margin-right: auto; - display: flex; - } - - .nav{ - white-space: nowrap; - font-size: 12px; - margin-right: 10px; - } -} - -@media (min-width: 576px){ - nav{ - width:140px; - padding:20px 0px 0 0; - position:absolute; - height:auto; - flex-direction:column; - } - - .nav{ - width:80%; - margin:0 0 20px 0; - - background-color: var(--main-color); - - color:var(--main-fg-color); - text-decoration-color:#d4d4d4; - - border-style: solid; - border-width: 1px; - - border-color: #000000; - } - - main{ - width:calc(576px - 80px); - max-width:100vw; - min-height:calc(100vh - 26px); - margin-left:130px - } - - .selected-nav { - border-style: ridge; - background-color: var(--main-bg-color); - color: var(--main-title-fg-color); - } -} - -@media (min-width: 768px){ - body{ - padding-left:calc((100vw - 768px - 200px)*.5) - } - - main{ - width:calc(768px - 80px * 2) - } - - footer{ - margin-left:calc((100vw - 768px - 200px)*-.5) - } -} - -@media (min-width: 992px){ - body{ - padding-left:calc((100vw - 992px - 50px)*.5) - } - main{ - width:calc(992px - 80px * 2) - } - footer{ - margin-left:calc((100vw - 992px - 200px)*-.5) - } -} - -div.button-container{ - display:flex; - flex-wrap:wrap; - justify-content:center; - gap:20px; - - margin-bottom: 10px; -} - -div.contact-text{ - margin-left:calc(130px + 20px) -} - -.license-img{ - height:31px; - width:88px; -} - -.smaltext{ - font-size: xx-small; - text-align:center -} - -.image-rounded{ - border-radius:50%; -} - -.text-center{ - text-align:center; - display: block; -} - -dl dt{ - float:left; - clear:left; - text-align:right; - width:130px; - font-weight:700 -} - -dl dd{ - margin-left:calc(130px + 20px) -} - -.inline-icon{ - display:flex; - flex-wrap:wrap; - justify-content:left; - gap:10px; - -} - -.section-header{ - display:flex; - justify-content:space-between; - align-items:center -} - -.post-footer{ - display:flex; - justify-content:right; - align-items:center -} - -.post-footer>p{ - margin:0 5% -} - -p.info{ - font-size:.8rem; - margin-top:5px -} - -span { - display: block ruby; - font-size: small; -} - -.info { - background-color: red; - color: var(--main-bg-color); -} - -p.info span{ - display:block; - margin-right:20px; -} - -p.info span i{ - margin-right:.5em -} - -@media (min-width: 768px){ - p.info span{ - display:inline - } -} -h1,h2,h3,h4,h5,h6{ - margin:20px 0 -} - -h1+p.info,h2+p.info,h3+p.info,h4+p.info,h5+p.info,h6+p.info{ - margin-top:-15px; - margin-bottom:20px -} -code,pre{ - font-size:.875em; - font-family: "FreePixel"; - font-feature-settings:"calt" 1; - font-variant-ligatures:normal; - border-color:var(--main-fg-color); - border-style:solid; - border-radius:3px; - background-color: var(--main-bg-end-color-color); - color: var(--main-fg-color); -} - -code{ - border-width:1px 0 -} - -pre{ - border-width:1px; - overflow-x:auto; - padding:4px 2px -} - -.nobr { - white-space: nowrap; - white-space-collapse: nowrap; -} - -pre>code{ - border-width:0 -} - -h1 code,h2 code,h3 code,h4 code,h5 code,h6 code{ - border-width:0 -} - -form{ - margin:10px -} - -.form-group{ - padding:5px 0 -} - -.form-group>label{ - display:block; - font-size:14px -} - -.form-group>.error{ - color:red; - font-size:14px -} - -input{ - width:100%; - padding-top:2px -} - -.right-div{ - width: fit-content; - text-align: left; - margin-left: auto; - margin-right: 0; - - h2{ - text-align: right; - } - a.right-div{ - text-align: right; - display: block; - } -} - -.postlist { - margin-top: 20px; - - a { - font-size: 15px; - - } - - span { - margin-bottom: 20px; - } - - -} - - -.prefSpan{ - width: fit-content; - margin-left: auto; - /* margin-top: -16px; */ - display: block; -} - -a { - color: #0066cc; -} \ No newline at end of file