Quinten
731f7549d4
* added porter robinson concert * changed gallery layout to multipage * fixed ox element width not stretching on chromium * removed (some) instances of unnecessary relative path linking (./ instead of /)
156 lines
5.7 KiB
HTML
156 lines
5.7 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<script type="module" src="./assets/scripts/md-block.js"></script>
|
||
<style>
|
||
@font-face {
|
||
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
|
||
font-family: 'IBM Plex Mono';
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
src: url('/assets/fonts/ibm-plex-mono-v19-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
|
||
}
|
||
|
||
/* ibm-plex-mono-italic - latin */
|
||
@font-face {
|
||
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
|
||
font-family: 'IBM Plex Mono';
|
||
font-style: italic;
|
||
font-weight: 400;
|
||
src: url('/assets/fonts/ibm-plex-mono-v19-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
|
||
}
|
||
|
||
/* ibm-plex-mono-500 - latin */
|
||
@font-face {
|
||
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
|
||
font-family: 'IBM Plex Mono';
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
src: url('/assets/fonts/ibm-plex-mono-v19-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
|
||
}
|
||
|
||
/* ibm-plex-mono-500italic - latin */
|
||
@font-face {
|
||
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
|
||
font-family: 'IBM Plex Mono';
|
||
font-style: italic;
|
||
font-weight: 500;
|
||
src: url('/assets/fonts/ibm-plex-mono-v19-latin-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
|
||
}
|
||
html {
|
||
background-color: #181818;
|
||
color: #E9E9E9;
|
||
font-family: "IBM Plex Mono", monospace;
|
||
font-weight: 400;
|
||
margin: 20vw;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<md-block>
|
||
|
||
|
||
|
||
# TODOs and IDEAS Scrapbook
|
||
|
||
---
|
||
---
|
||
## Automate some tools
|
||
* https://www.html-tidy.org/
|
||
|
||
---
|
||
## ☑️Make a "template" webpage
|
||
### What do we want on here from the main page?
|
||
* ✔ list of local links
|
||
* ? socials
|
||
* ✘ status (lastfm, time, music)
|
||
|
||
### How do we dynamically update all pages when any "shared" blocks change? (prevent desync when I change a re-used block basically)
|
||
* Is this even possible without a framework (thinking of astro, but "compiled" or "processed" web sounds like a chore)
|
||
* How badly do we need this? - maybe 5 or 6 main pages, blocks etc won't be visible (probably), but still requires re-use. Do we even want blogs? Also, this seems better left alone, to be implemented later(tm) when needed
|
||
|
||
---
|
||
## ❓File browser-esque horizontal directory indicator
|
||
* /home/links with each being clickable etc as navigation back "up"
|
||
* If tux is clicked, change to win7 icon / change filepaths too to windows-esque "C:\etc" - probably too much effort
|
||
* Maybe multiple clicks, tux "falling off"
|
||
|
||
---
|
||
## ☑️Make a "links" page
|
||
Like a collection of bookmarks, possibly organized, realistically not really. Just add a short description to the href or as subscript ig
|
||
|
||
---
|
||
## ☑️ Make onsite links prioritized over offsite links
|
||
* Make offsite links dimmer in color?
|
||
|
||
---
|
||
## ☑️ Make a blog page
|
||
ANY stories, text, ramblings, whatever. Probably very infrequent. (updates && gallery i guess)
|
||
|
||
---
|
||
## ❗Make a short bio (scary!)
|
||
nop
|
||
|
||
|
||
---
|
||
## ☑️Space weather!
|
||
* https://services.swpc.noaa.gov/images/animations/ovation/north/latest.jpg
|
||
* fetch new image every 10min to new API :3
|
||
* some one sentence forecast from https://services.swpc.noaa.gov as well
|
||
*
|
||
|
||
|
||
---
|
||
## ❗Add fun animations to the background
|
||
Comets, twinkling stars, other animated pixel dithering waves or something idk!
|
||
[maybe like this?](https://github.com/tsparticles/presets/tree/main/presets/stars#readme)
|
||
|
||
---
|
||
## ❗Change background
|
||
To allow the idea above here, and because it fucks your eyesight and doesnt render suuuper well
|
||
|
||
---
|
||
## ❗Make website more 'alive'
|
||
* Add animations, transitions (dont make em obnoxious, maybe only add them on optional / for fun interactions)
|
||
* More "always moving" things, incl add fun animations to bg 2 ideas above
|
||
|
||
---
|
||
## ❗Add fancy borders, see bookmark
|
||
- does this even fit the website? might get too busy esp. with animations.
|
||
|
||
|
||
---
|
||
## Layout changes to the base website
|
||
|
||
### ☑️Seperate on-website links (onlinks) from offlinks
|
||
* Make onlinks prioritized
|
||
* Put offlinks in a seperate, smaller, visually deprioritized box
|
||
* Move this box to the side, as sidebar? -> say goodbye to mobile 4ever :sob:
|
||
|
||
### Make socials into a vertical element, billboard style, hanging off to the side of a box element
|
||
* Very annoying, will have to re-think main element flexbox layout
|
||
* What do we even do on mobile? A billboard like this is straight up impossible and i DONT want two different layouts depending on device size.
|
||
|
||
| What do other people do? | |
|
||
| ------------------------ | -- |
|
||
| https://melankorin.net/about/ | set min page width in px -> mobile has to scroll across |
|
||
| https://niatsuki.neocities.org/ | broken |
|
||
| https://status.cafe/users/ctrl64 | broken |
|
||
| https://hacktivis.me/bookmarks | broken |
|
||
| https://tweakers.net/ | completely different layout |
|
||
| https://mathieutuli.com/ | fun inspo |
|
||
|
||
-> Is this problem REALLY unsolved? *sigh*
|
||
|
||
|
||
</md-block>
|
||
</body>
|
||
</html>
|
||
|
||
|
||
|
||
|
||
|