diff --git a/index.html b/index.html index ecd4785..29a0c3f 100644 --- a/index.html +++ b/index.html @@ -3,51 +3,72 @@ - Alfieking.dev + Alfie's basement - - - + + + - - + - + - -
+
+ +
-
+

Alfie King

server backend survivor

-
-

About

+
+

A lil bit abt me

Im not good with writing so dont expect much here. I am a student who is learning c++ and python. I've Done a few projects that i think are decent enough to show off, so I have put them on this website. I like to mess around with linux and have a few servers that I run. I've @@ -55,9 +76,6 @@ slightly annoying at times (mainly because one of my most played games' anticheat doesn't support on linux atm. Also, the lack of photoshop is a pain).

- I am also a fan of some 2000s internet culture, so I intend to "Eventualy" make a alternitive website that is a bit more like that. I have seen a - few sites that I like, such as ne0nbandit street. Neocities is a great place to find sites like that. -

I would like to make some more projects in the future, but I am not sure what I want to make yet. I tend to make thing on impulse a lot, and motivation is "lacking" at times. So the few ideas I do have may never come to fruition. I hope to get better at art so i could hopefully make a game that is somewhat interesting. But im at a lack of ideas at the moment. @@ -65,128 +83,46 @@ I would also like to have a functional blog on this site, but I bearly talk about much so I dont know what I would write about. I like to ramble on about random things, but I dont think that would be very interesting to read, and I think that I would forget to update it. I have a tumblr that I have had for a few years now, but I dont post on it (the social anxiety is too much for me :<). However I hope to get better at that in the future. -

- I will probably put this site on my git server at some point, but I dont know when that will be. I have a few other projects that I want to put on there, but - I have been lazy and havent done it yet (or maybe I have and just forgot to update this). -

- At this point i'm just trying to fill up space so that this site looks more interesting. I hope that I can make this site more interesting in the future, but - for now have this cat. :3 -

- 

-      |\      _,,,---,,_
-ZZZzz /,`.-'`'    -.  ;-;;,_
-     |,4-  ) )-,_. ,\ (  `'-'
-    '---''(_/--'  `-'\_)
-

-
-

Projects

-
-
- -
-

Game without a name

-

- This is a game that I made in c++ using sdl. It is a simple platformer at the moment and will probably - change in the future. It is supposed to be a school project, but I am mainly working on it to learn c++. - I hope to create a more interesting game in the future, but for now, this is what I have. -

- It is fully open source, but at the moment I havent got around to uploading it on my git server. However, - it does require sdl to run, so you will need to install that if you want to run it. -

- I plan on making a better "engine" for it in the future, with more quality of life features and a functioning - collision system. Currently, there i a very basic level editor that I made from recyling the code from the game. -

-
-
-
- -
-

Term owo

-

- I made this project as a joke, I can't remember exactly what I baised it off other than the fact that it was somthing - similar to this but in a different language. I originally made it in python, but I have since rewritten it in c++ so that - it would be faster and so that I could learn c++. -

- It is mostly just a bunch of regex replacements, but I plan on adding more features in the future that add more ":3" and such to the - output. It currently has a few features, such as reading and writing to files, and automatically putting the output to the clipboard. -

-
-
-
+
+ + + + + + + +
-
+ - - - \ No newline at end of file diff --git a/static/content/12ft-ladder.webp b/static/content/12ft-ladder.webp deleted file mode 100644 index 9bd6ad3..0000000 Binary files a/static/content/12ft-ladder.webp and /dev/null differ diff --git a/static/content/Arch-linux-logo.webp b/static/content/Arch-linux-logo.webp deleted file mode 100644 index 06498c4..0000000 Binary files a/static/content/Arch-linux-logo.webp and /dev/null differ diff --git a/static/content/Gitea_Logo.webp b/static/content/Gitea_Logo.webp deleted file mode 100644 index 3d8ac9a..0000000 Binary files a/static/content/Gitea_Logo.webp and /dev/null differ diff --git a/static/content/background.png b/static/content/background.png new file mode 100644 index 0000000..35fd18b Binary files /dev/null and b/static/content/background.png differ diff --git a/static/content/bad_internet_bills.webp b/static/content/bad_internet_bills.webp deleted file mode 100644 index 472533d..0000000 Binary files a/static/content/bad_internet_bills.webp and /dev/null differ diff --git a/static/content/bleeps.gif b/static/content/bleeps.gif deleted file mode 100644 index a4414f2..0000000 Binary files a/static/content/bleeps.gif and /dev/null differ diff --git a/static/content/blinikes-cafe.webp b/static/content/blinikes-cafe.webp deleted file mode 100644 index 9374db3..0000000 Binary files a/static/content/blinikes-cafe.webp and /dev/null differ diff --git a/static/content/btns/anything_but_chrome.gif b/static/content/btns/anything_but_chrome.gif deleted file mode 100644 index eabb7d8..0000000 Binary files a/static/content/btns/anything_but_chrome.gif and /dev/null differ diff --git a/static/content/btns/archlinux.gif b/static/content/btns/archlinux.gif deleted file mode 100644 index 6fcc440..0000000 Binary files a/static/content/btns/archlinux.gif and /dev/null differ diff --git a/static/content/btns/deltarune.png b/static/content/btns/deltarune.png deleted file mode 100644 index a7b0943..0000000 Binary files a/static/content/btns/deltarune.png and /dev/null differ diff --git a/static/content/btns/discord.gif b/static/content/btns/discord.gif deleted file mode 100644 index 250c6b9..0000000 Binary files a/static/content/btns/discord.gif and /dev/null differ diff --git a/static/content/btns/firefoxget.gif b/static/content/btns/firefoxget.gif deleted file mode 100644 index 3cd754f..0000000 Binary files a/static/content/btns/firefoxget.gif and /dev/null differ diff --git a/static/content/btns/handcoded.gif b/static/content/btns/handcoded.gif deleted file mode 100644 index 73c1a23..0000000 Binary files a/static/content/btns/handcoded.gif and /dev/null differ diff --git a/static/content/btns/learn_html.gif b/static/content/btns/learn_html.gif deleted file mode 100644 index dd832a0..0000000 Binary files a/static/content/btns/learn_html.gif and /dev/null differ diff --git a/static/content/btns/love_blahaj.gif b/static/content/btns/love_blahaj.gif deleted file mode 100644 index 0ceea38..0000000 Binary files a/static/content/btns/love_blahaj.gif and /dev/null differ diff --git a/static/content/btns/made_with_paws.png b/static/content/btns/made_with_paws.png deleted file mode 100644 index ea87982..0000000 Binary files a/static/content/btns/made_with_paws.png and /dev/null differ diff --git a/static/content/btns/no_web3.gif b/static/content/btns/no_web3.gif deleted file mode 100644 index 4f5a2f1..0000000 Binary files a/static/content/btns/no_web3.gif and /dev/null differ diff --git a/static/content/btns/ublock_origin_now.png b/static/content/btns/ublock_origin_now.png deleted file mode 100644 index 5ce5191..0000000 Binary files a/static/content/btns/ublock_origin_now.png and /dev/null differ diff --git a/static/content/btns/use-discord.gif b/static/content/btns/use-discord.gif deleted file mode 100644 index 8b8b457..0000000 Binary files a/static/content/btns/use-discord.gif and /dev/null differ diff --git a/static/content/btns/vscbutton.gif b/static/content/btns/vscbutton.gif deleted file mode 100644 index 8a4cad2..0000000 Binary files a/static/content/btns/vscbutton.gif and /dev/null differ diff --git a/static/content/haj.gif b/static/content/haj.gif new file mode 100644 index 0000000..f052abc Binary files /dev/null and b/static/content/haj.gif differ diff --git a/static/content/neocities-Logo.webp b/static/content/neocities-Logo.webp deleted file mode 100644 index d8f3e34..0000000 Binary files a/static/content/neocities-Logo.webp and /dev/null differ diff --git a/static/content/tumblr.gif b/static/content/tumblr.gif deleted file mode 100644 index 77ced89..0000000 Binary files a/static/content/tumblr.gif and /dev/null differ diff --git a/static/content/twitch.gif b/static/content/twitch.gif deleted file mode 100644 index d2a21dd..0000000 Binary files a/static/content/twitch.gif and /dev/null differ diff --git a/static/css/index.css b/static/css/index.css new file mode 100644 index 0000000..fc6a0ea --- /dev/null +++ b/static/css/index.css @@ -0,0 +1,312 @@ +:root { + --primary-color: #5cdd8b; + --text-color: #b1b8c0; + --background-color: #020205; + --secondary-background-color: #090914; + --font-size: 0.5cm; + --font-family: 'Roboto Mono', sans-serif; +} + +body { + background-color: var(--background-color); + background-image: url("https://blinkies.cafe/purple-stars-bg.gif"); + color: var(--text-color); + font-size: var(--font-size); + font-family: var(--font-family); + margin: 0; + display: grid; + grid-template-columns: 7fr 1.3fr; + grid-template-rows: 1fr; + grid-template-areas: "main sidebar"; + padding: 7% 25% 7% 25%; + gap: 1rem; +} + +#sidebar { + grid-area: sidebar; + display: flex; + flex-direction: column; + gap: 1rem; +} + +#sidebar section { + backdrop-filter: blur(2px) brightness(0.6); + border: var(--secondary-background-color) 2px solid; + border-radius: 10px; + padding: 10px; +} + +#sidebar ul { + list-style-type: none; + margin: 0; + padding: 0; + display: flex; + flex-direction: column; +} + +#sidebar ul li { + width: fit-content; +} + +#sidebar ul li a { + color: var(--text-color); + text-decoration: none; + font-weight: 100; + font-family: 'Impact', sans-serif; + transition: all 0.2s ease-in-out +} + +#sidebar ul li a:hover { + color: var(--primary-color); + font-weight: 900; +} + +#sidebar ul li img { + transition: all 0.2s ease-in-out; +} + +#sidebar ul li img:hover { + transform: scale(1.1); +} + +#sidebar h1 { + font-size: 1.5rem; + font-weight: 900; + margin: 0; + padding: 0; +} + +#sidebar h6 { + font-weight: 100; + margin: 0; + padding: 0; +} + +#buttons { + text-align: center; +} + +#buttons h1 { + font-size: 1.3rem; + font-weight: 900; + margin: 0; + padding: 0; + text-shadow: var(--text-color) 1px 0 10px; +} + +#buttons ul { + list-style-type: none; + margin: 0; + padding: 0; + display: flex; + flex-direction: column; + margin-top: 5px; + align-items: center; +} + +.vsmoltext { + font-size: 0.5rem; +} + +main { + grid-area: main; + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + gap: 1rem; +} + +header { + backdrop-filter: blur(2px) brightness(0.6); + border: var(--secondary-background-color) 2px solid; + border-radius: 10px; + padding: 15px; +} + +header div.row { + display: flex; + flex-direction: row; + margin: 0; + gap: 1.5rem; +} + +header div.column { + display: flex; + flex-direction: column; + justify-content: center; + margin: 0; +} + +header img { + width: 9rem; + height: 9rem; +} + +header h1 { + font-size: 5rem; + font-weight: 900; + padding: 0; + margin: 0; +} + +header h2 { + font-size: 1.75rem; + font-weight: 100; + padding: 0; + margin: 0; + position: relative; + top: -1rem; +} + +main section { + backdrop-filter: blur(2px) brightness(0.6); + width: 100%; + display: flex; + flex-direction: column; + border: var(--secondary-background-color) 2px solid; + border-radius: 10px; + padding: 15px; + box-sizing: border-box; +} + +main section h1 { + font-size: 3rem; + font-weight: 900; + margin: 0; + padding: 0; +} + +main section h2 { + font-size: 1.5rem; + font-weight: 900; + margin: 0; + padding: 0; +} + +main section p { + font-size: 1rem; + margin: 0; + padding: 0; + font-weight: 300; +} + +main section a { + color: var(--primary-color); + text-decoration: none; +} + +#furry { + position: fixed; + left: 0; + top: 0; + right: 0; + bottom: 0; + opacity: 0.1; + background-image: url('/static/content/background.png'); + background-repeat: no-repeat; + background-position: 50% 0; + background-size: cover; + z-index: -1; + display: none; +} + +.blinkies { + justify-content: center; + display: flex; + flex-direction: row; + flex-wrap: wrap; +} + +.blinkies img { + width: 150px; + height: 20px; + transition: all 0.2s ease-in-out; +} + +.blinkies img:hover { + transform: scale(1.1) rotate(5deg); +} + +.blinkies img:nth-child(odd):hover { + transform: scale(1.1) rotate(-5deg); +} + +section.rowsect { + width: 100%; + display: grid; + grid-template-columns: auto auto; + gap: 1rem; + backdrop-filter: none; + border: none; + padding: 0; +} + +section.rowsect>div { + backdrop-filter: blur(2px) brightness(0.6); + border: var(--secondary-background-color) 2px solid; + border-radius: 10px; +} + +.stamps { + display: flex; + flex-direction: row; + flex-wrap: wrap; + padding: 10px; + gap: 5px; + justify-content: center; + align-content: center; +} + +.stamps img { + width: 99px; + height: 56px; + transition: all 0.2s ease-in-out; +} + +.stamps img:hover { + transform: scale(1.1) rotate(5deg); +} + +.stamps img:nth-child(odd):hover { + transform: scale(1.1) rotate(-5deg); +} + +#spotify { + background-image: none; + background-color: var(--secondary-background-color); + backdrop-filter: blur(2px) brightness(0.6); + border: var(--secondary-background-color) 2px solid; + border-radius: 10px; + padding: 15px; + box-sizing: border-box; + background-repeat: no-repeat; + background-size: contain; + height: 300px; + width: 300px; + display: flex; + flex-direction: column; +} + +#spotify-title { + font-size: 1.5rem; + font-weight: 900; + margin: 0; + padding: 0; + mix-blend-mode: difference; + color: white; +} + +#spotify-artist { + color: white; + font-size: 1rem; + font-weight: 900; + margin: 0; + padding: 0; + mix-blend-mode: difference; +} + +.haj { + width: 100%; + filter: drop-shadow(0 0 0.5rem rgb(88, 214, 245)); +} \ No newline at end of file diff --git a/static/css/main.css b/static/css/main.css deleted file mode 100644 index 734002f..0000000 --- a/static/css/main.css +++ /dev/null @@ -1,318 +0,0 @@ -:root { - --primary-color: #5cdd8b; - --text-color: #b1b8c0; - --background-color: #090c10; - --secondary-background-color: #0d1117; - --font-size: 0.5cm; - --font-family: 'Roboto Mono', sans-serif; -} - -body { - background-color: var(--background-color); - color: var(--text-color); - font-size: var(--font-size); - font-family: var(--font-family); - padding: 0; - margin: 0; - display: flex; - overflow-y: hidden; -} - -nav { - height: 100vh; - width: 4rem; -} - -nav ul { - list-style-type: none; - margin: 0; - padding: 0; - display: flex; - flex-direction: column; - height: 100%; -} - -nav ul li { - writing-mode: vertical-lr; - text-orientation: upright; - padding: 2rem 0rem 0rem 1.4rem; - width: fit-content; -} - -nav ul li a { - color: var(--text-color); - text-decoration: none; - font-weight: 100; - font-family: 'Impact', sans-serif; - transition: all 0.3s ease-in-out -} - -nav ul li a img { - width: 1.5rem; - height: 1.5rem; - transition: all 0.3s ease-in-out; - border-radius: 50%; -} - -nav ul li a:hover { - color: var(--primary-color); - font-weight: 900; -} - -nav ul li a:hover img { - border-radius: 35%; -} - -nav ul li#music { - z-index: 100; - margin-top: auto; - padding-bottom: 2rem; - display: none; - transition: all 0.3s ease-in-out; - align-items: center; - flex-direction: column; -} - -nav ul li#music img { - width: 1.5rem; - height: 1.5rem; - transition: all 0.3s ease-in-out; - border-radius: 50%; -} - -nav ul li#music div#music-expand { - display: none; - width: 0rem; - height: 0rem; - border-radius: 0 500px 500px 0; - background-color: var(--secondary-background-color); - display: flex; - flex-direction: row; - box-sizing: border-box; - transition: all 0.3s ease-in-out; - overflow: hidden; -} - -nav ul li#music h1 { - display: none; - font-size: 100%; - max-width: 90%; - writing-mode: horizontal-tb; - margin: 0.5rem 0 0 0.5rem; - transition: all 0.3s ease-in-out; -} - -nav ul li#music h2 { - display: none; - font-size: 1rem; - max-width: 90%; - writing-mode: horizontal-tb; - margin: 0; - font-weight: 100; - margin: 0.5rem 0 0 0.5rem; - transition: all 0.3s ease-in-out; -} - -nav ul li#music div#music-progress { - display: none; - width: 100%; - margin-top: auto; - height: 1rem; - background-color: var(--primary-color); - transition: all 3s ease; -} - -main { - width: 100%; - height: 100vh; - overflow: scroll; - scrollbar-width: none; - scroll-behavior: smooth; -} - -header { - width: 100%; - height: 100vh; - display: flex; - flex-direction: column; - justify-content: center; - align-items: center; -} - -header div.row { - position: relative; - left: -3rem; - display: flex; - flex-direction: row; - justify-content: center; - align-items: center; - margin: 0; - gap: 1.5rem; -} - -header div.column { - display: flex; - flex-direction: column; - justify-content: center; - margin: 0; -} - -header img { - width: 13rem; - height: 13rem; -} - -header h1 { - font-size: 5rem; - font-weight: 900; - padding: 0; - margin: 0; -} - -header h2 { - font-size: 1.75rem; - font-weight: 100; - padding: 0; - margin: 0; - position: relative; - top: -1rem; -} - -main section { - width: 100%; - min-height: 100vh; - display: flex; - flex-direction: column; - box-sizing: border-box; - padding: 4rem; -} - -main section h1 { - font-size: 4.5rem; - font-weight: 900; - margin: 0; - padding: 0; -} - -main section h2 { - font-size: 1.75rem; - margin: 0; - padding: 0; -} - -main section p { - font-size: 1.25rem; - margin: 0; - padding: 0; - font-weight: 300; -} - -main section a { - color: var(--primary-color); - text-decoration: none; - transition: all 0.3s ease-in-out; -} - -main section a:hover { - text-decoration: underline; -} - -.projects { - display: flex; - flex-direction: row; - gap: 2rem; - margin-top: 2rem; - flex-wrap: wrap; -} - -.project { - width: 30%; - display: flex; - flex-direction: column; -} - -.project img { - width: 100%; - aspect-ratio: 5/2; - border-radius: 1rem 1rem 0 0; -} - -.project .project-info { - padding: 0 1rem 1rem 1rem; - background-color: var(--secondary-background-color); - border-radius: 0 0 1rem 1rem; -} - -.links { - display: flex; - flex-direction: row; - gap: 2rem; - margin-top: 2rem; - flex-wrap: wrap; -} - -.links a img { - height: 120px; - transition: all 0.2s ease-in-out; -} - -.links a:nth-child(even) img:hover { - transform: scale(1.1) rotate(5deg); -} - -.links a:nth-child(odd) img:hover { - transform: scale(1.1) rotate(-5deg); -} - -.links iframe { - height: 120px; - transition: all 0.2s ease-in-out; -} - -.links iframe:hover { - transform: scale(1.1); -} - -.blinkies { - display: flex; - flex-direction: column; -} - -.blinkies a img { - height: 60px; - transition: all 0.2s ease-in-out; -} - -.blinkies a { - height: 60px; -} - -img.btn { - height: 60px !important; - transition: all 0.2s ease-in-out; -} - -#links h2 { - margin-top: 2rem; -} - -.btns { - display: flex; - flex-direction: row; - flex-wrap: wrap; - gap: 0.5rem; - margin-top: 2rem; -} - -.btns img { - height: 40px; - transition: all 0.2s ease-in-out; -} - -.btns img:hover:nth-child(even) { - transform: scale(1.3) rotate(5deg); -} - -.btns img:hover:nth-child(odd) { - transform: scale(1.3) rotate(-5deg); -} \ No newline at end of file diff --git a/static/js/typing.js b/static/js/index.js similarity index 61% rename from static/js/typing.js rename to static/js/index.js index 26cc601..f7ea8b3 100644 --- a/static/js/typing.js +++ b/static/js/index.js @@ -1,3 +1,5 @@ +// TYPERWRITER + const values = [ "Web developer", "Pc games enjoyer", @@ -68,4 +70,35 @@ function typing() { } } -typing(); \ No newline at end of file +typing(); + +// HIDDEN STUFF (shh don't tell anyone >:3) + +var last5Chars = ""; + +document.addEventListener('keydown', function(event) { + last5Chars += event.key; + if (last5Chars == "furry") { + console.log("owo, whats this?"); + document.getElementById('furry').style.display = 'block'; + } + while (last5Chars.length >= 5) { + last5Chars = last5Chars.slice(1); + } +}); + +// Spotify API + +function getSpotify() { + fetch('https://api.alfieking.dev/spotify/nowplaying/xz02oolstlvwxqu1pfcua9exz').then(response => { + return response.json(); + }).then(data => { + document.getElementById('spotify').style.backgroundImage = "url(" + data.item.album.images[0].url + ")"; + document.getElementById('spotify-title').innerHTML = data.item.name; + document.getElementById('spotify-artist').innerHTML = data.item.artists[0].name; + document.getElementById('spotify-link').href = data.item.external_urls.spotify; + }); +} + +getSpotify(); +setInterval(getSpotify, 15000); \ No newline at end of file diff --git a/static/js/links.js b/static/js/links.js deleted file mode 100644 index e69de29..0000000 diff --git a/static/js/music.js b/static/js/music.js deleted file mode 100644 index 4b00d77..0000000 --- a/static/js/music.js +++ /dev/null @@ -1,78 +0,0 @@ -var enableMusic = true; - -document.getElementById('music').addEventListener('mouseover', function() { musicHover(); }); - -function musicHover() { - if (!enableMusic) { - return; - } - let icon = document.getElementById('music-icon'); - icon.style.width = '8rem'; - icon.style.height = '8rem'; - icon.style.borderRadius = '500px 0 0 500px'; - let div = document.getElementById('music-expand'); - div.style.display = 'flex'; - div.style.width = '20rem'; - div.style.height = '8rem'; - let title = document.getElementById('music-title'); - title.style.display = 'block'; - let info = document.getElementById('music-info'); - info.style.display = 'block'; - let progress = document.getElementById('music-progress'); - progress.style.display = 'block'; -} - -document.getElementById('music').addEventListener('mouseout', function() { musicOut(); }); - -function musicOut() { - let icon = document.getElementById('music-icon'); - icon.style.width = '1.5rem'; - icon.style.height = '1.5rem'; - icon.style.borderRadius = '50%'; - let div = document.getElementById('music-expand'); - div.style = ''; - let title = document.getElementById('music-title'); - title.style.display = 'none'; - let info = document.getElementById('music-info'); - info.style.display = 'none'; - let progress = document.getElementById('music-progress'); - progress.style.display = 'none'; -} - -function fetchData() { - // allow cors - let data = fetch('https://alfieking.dev/api/nowplaying') - .then(response => response.json()).then(data => { return data; }) - .catch(error => { return null;}); - return data; -} - -function updateUi(data) { - enableMusic = true; - document.getElementById('music').style.display = 'flex'; - document.getElementById('music-icon').src = data.item.album.images[0].url; - document.getElementById('music-title').innerText = data.item.name; - document.getElementById('music-info').innerText = data.item.artists[0].name + ' - ' + data.item.album.name; - let progress = data.progress_ms / data.item.duration_ms * 100; - document.getElementById('music-progress').style.width = progress + '%'; -} - -function hideUi() { - enableMusic = false; - document.getElementById('music').style.display = 'none'; -} - -function update() { - fetchData().then(data => { - console.log(data); - if (data.item != null) { - updateUi(data); - } - else { - hideUi(); - } - }); -} - -update(); -setInterval(update, 3000); \ No newline at end of file