diff --git a/.gitignore b/.gitignore index c22d564..56934af 100644 --- a/.gitignore +++ b/.gitignore @@ -11,3 +11,4 @@ fonts/**/*.woff2 _build _tmp .directory +*~ diff --git a/ANGELF~1.HTM b/ANGELF~1.HTM deleted file mode 100644 index 86141f0..0000000 --- a/ANGELF~1.HTM +++ /dev/null @@ -1,106 +0,0 @@ - - - - - - - - - - -šŸ¦Ž the gec zone šŸ¦Ž - -
-
-

so basically? im gecs

-
-
-

ā€œmlemā€

-

ā€œmlem alsoā€

-
- - - - ā€” the gecs - - -
-

- a big one (niss (she/her)) - and a little one (nisse (he/him)) -

- -
- -
-

stats

- - -
how to say - - /nIs/, /nIs@/ - - - -
prons she or they -
quantity 2 -
consistency soft -
limbs many -
energy low -
-
-
- - - - - - - - diff --git a/Makefile b/Makefile index 5930f83..d23f1c3 100644 --- a/Makefile +++ b/Makefile @@ -1,15 +1,12 @@ -CSS = $(shell find style -type f) -PAGES = index.html where.html pubkey.txt id.html links.html -MEDIA = $(patsubst %,media/%, \ - bg.png bg_2x.png bg_dim.png bg_2x_dim.png kesi.png quoxtrans.png \ - mlem.gif mlem_static.png chitter.png butterfly.png lockpen.png \ - quobl.png quobl2.png \ - ) \ - $(wildcard media/*.svg) $(wildcard media/flags/*) \ - $(wildcard media/buttons/*) \ +CSS = $(wildcard *.css) $(shell find fonts -type f) +PAGES = index.html pubkey.txt +MEDIA = \ + $(wildcard media/*.png) $(wildcard media/*.svg) $(wildcard media/*.webp) \ + $(wildcard media/flags/*) $(wildcard media/buttons/*) \ 8831.png 8831-quox.png +SCRIPTS = $(patsubst %.ts,%.js,$(wildcard *.ts)) MISC = $(shell find .well-known -type f) -ALL = $(CSS) $(PAGES) $(MEDIA) $(MISC) +ALL = $(CSS) $(PAGES) $(MEDIA) $(SCRIPTS) $(MISC) BUILDDIR ?= _build TMPDIR ?= _tmp @@ -17,7 +14,7 @@ TMPDIR ?= _tmp HOST ?= yummy.cricket REMOTE_USER ?= www-data IDFILE ?= ~/.ssh/xyz -REMOTE_DIR ?= yummy +REMOTE_DIR ?= yummy/test all: build @@ -61,6 +58,12 @@ $(BUILDDIR)/%.GIF: %.ICO @mkdir -p $(dir $@) @convert '$<[0]' $@ +$(BUILDDIR)/%.js: %.ts + tsc --strict --noUncheckedIndexedAccess --noEmitOnError \ + --lib dom,es2021 --target es2015 \ + --outDir $(dir $@) $^ + + clean: $(RM) -r $(TMPDIR) $(BUILDDIR) diff --git a/NEWFOL~1/256.gpl b/NEWFOL~1/256.gpl deleted file mode 100644 index 3f1c704..0000000 --- a/NEWFOL~1/256.gpl +++ /dev/null @@ -1,259 +0,0 @@ -GIMP Palette -Name: 256 -Columns: 8 -0 0 0 color 0 -0 0 85 color 1 -0 0 170 color 2 -0 0 255 color 3 -0 36 0 color 4 -0 36 85 color 5 -0 36 170 color 6 -0 36 255 color 7 -0 72 0 color 8 -0 72 85 color 9 -0 72 170 color 10 -0 72 255 color 11 -0 109 0 color 12 -0 109 85 color 13 -0 109 170 color 14 -0 109 255 color 15 -0 145 0 color 16 -0 145 85 color 17 -0 145 170 color 18 -0 145 255 color 19 -0 182 0 color 20 -0 182 85 color 21 -0 182 170 color 22 -0 182 255 color 23 -0 218 0 color 24 -0 218 85 color 25 -0 218 170 color 26 -0 218 255 color 27 -0 255 0 color 28 -0 255 85 color 29 -0 255 170 color 30 -0 255 255 color 31 -36 0 0 color 32 -36 0 85 color 33 -36 0 170 color 34 -36 0 255 color 35 -36 36 0 color 36 -36 36 85 color 37 -36 36 170 color 38 -36 36 255 color 39 -36 72 0 color 40 -36 72 85 color 41 -36 72 170 color 42 -36 72 255 color 43 -36 109 0 color 44 -36 109 85 color 45 -36 109 170 color 46 -36 109 255 color 47 -36 145 0 color 48 -36 145 85 color 49 -36 145 170 color 50 -36 145 255 color 51 -36 182 0 color 52 -36 182 85 color 53 -36 182 170 color 54 -36 182 255 color 55 -36 218 0 color 56 -36 218 85 color 57 -36 218 170 color 58 -36 218 255 color 59 -36 255 0 color 60 -36 255 85 color 61 -36 255 170 color 62 -36 255 255 color 63 -72 0 0 color 64 -72 0 85 color 65 -72 0 170 color 66 -72 0 255 color 67 -72 36 0 color 68 -72 36 85 color 69 -72 36 170 color 70 -72 36 255 color 71 -72 72 0 color 72 -72 72 85 color 73 -72 72 170 color 74 -72 72 255 color 75 -72 109 0 color 76 -72 109 85 color 77 -72 109 170 color 78 -72 109 255 color 79 -72 145 0 color 80 -72 145 85 color 81 -72 145 170 color 82 -72 145 255 color 83 -72 182 0 color 84 -72 182 85 color 85 -72 182 170 color 86 -72 182 255 color 87 -72 218 0 color 88 -72 218 85 color 89 -72 218 170 color 90 -72 218 255 color 91 -72 255 0 color 92 -72 255 85 color 93 -72 255 170 color 94 -72 255 255 color 95 -109 0 0 color 96 -109 0 85 color 97 -109 0 170 color 98 -109 0 255 color 99 -109 36 0 color 100 -109 36 85 color 101 -109 36 170 color 102 -109 36 255 color 103 -109 72 0 color 104 -109 72 85 color 105 -109 72 170 color 106 -109 72 255 color 107 -109 109 0 color 108 -109 109 85 color 109 -109 109 170 color 110 -109 109 255 color 111 -109 145 0 color 112 -109 145 85 color 113 -109 145 170 color 114 -109 145 255 color 115 -109 182 0 color 116 -109 182 85 color 117 -109 182 170 color 118 -109 182 255 color 119 -109 218 0 color 120 -109 218 85 color 121 -109 218 170 color 122 -109 218 255 color 123 -109 255 0 color 124 -109 255 85 color 125 -109 255 170 color 126 -109 255 255 color 127 -145 0 0 color 128 -145 0 85 color 129 -145 0 170 color 130 -145 0 255 color 131 -145 36 0 color 132 -145 36 85 color 133 -145 36 170 color 134 -145 36 255 color 135 -145 72 0 color 136 -145 72 85 color 137 -145 72 170 color 138 -145 72 255 color 139 -145 109 0 color 140 -145 109 85 color 141 -145 109 170 color 142 -145 109 255 color 143 -145 145 0 color 144 -145 145 85 color 145 -145 145 170 color 146 -145 145 255 color 147 -145 182 0 color 148 -145 182 85 color 149 -145 182 170 color 150 -145 182 255 color 151 -145 218 0 color 152 -145 218 85 color 153 -145 218 170 color 154 -145 218 255 color 155 -145 255 0 color 156 -145 255 85 color 157 -145 255 170 color 158 -145 255 255 color 159 -182 0 0 color 160 -182 0 85 color 161 -182 0 170 color 162 -182 0 255 color 163 -182 36 0 color 164 -182 36 85 color 165 -182 36 170 color 166 -182 36 255 color 167 -182 72 0 color 168 -182 72 85 color 169 -182 72 170 color 170 -182 72 255 color 171 -182 109 0 color 172 -182 109 85 color 173 -182 109 170 color 174 -182 109 255 color 175 -182 145 0 color 176 -182 145 85 color 177 -182 145 170 color 178 -182 145 255 color 179 -182 182 0 color 180 -182 182 85 color 181 -182 182 170 color 182 -182 182 255 color 183 -182 218 0 color 184 -182 218 85 color 185 -182 218 170 color 186 -182 218 255 color 187 -182 255 0 color 188 -182 255 85 color 189 -182 255 170 color 190 -182 255 255 color 191 -218 0 0 color 192 -218 0 85 color 193 -218 0 170 color 194 -218 0 255 color 195 -218 36 0 color 196 -218 36 85 color 197 -218 36 170 color 198 -218 36 255 color 199 -218 72 0 color 200 -218 72 85 color 201 -218 72 170 color 202 -218 72 255 color 203 -218 109 0 color 204 -218 109 85 color 205 -218 109 170 color 206 -218 109 255 color 207 -218 145 0 color 208 -218 145 85 color 209 -218 145 170 color 210 -218 145 255 color 211 -218 182 0 color 212 -218 182 85 color 213 -218 182 170 color 214 -218 182 255 color 215 -218 218 0 color 216 -218 218 85 color 217 -218 218 170 color 218 -218 218 255 color 219 -218 255 0 color 220 -218 255 85 color 221 -218 255 170 color 222 -218 255 255 color 223 -255 0 0 color 224 -255 0 85 color 225 -255 0 170 color 226 -255 0 255 color 227 -255 36 0 color 228 -255 36 85 color 229 -255 36 170 color 230 -255 36 255 color 231 -255 72 0 color 232 -255 72 85 color 233 -255 72 170 color 234 -255 72 255 color 235 -255 109 0 color 236 -255 109 85 color 237 -255 109 170 color 238 -255 109 255 color 239 -255 145 0 color 240 -255 145 85 color 241 -255 145 170 color 242 -255 145 255 color 243 -255 182 0 color 244 -255 182 85 color 245 -255 182 170 color 246 -255 182 255 color 247 -255 218 0 color 248 -255 218 85 color 249 -255 218 170 color 250 -255 218 255 color 251 -255 255 0 color 252 -255 255 85 color 253 -255 255 170 color 254 -255 255 255 color 255 diff --git a/NEWFOL~1/GEC.JPG b/NEWFOL~1/GEC.JPG deleted file mode 100644 index 185a17f..0000000 Binary files a/NEWFOL~1/GEC.JPG and /dev/null differ diff --git a/NEWFOL~1/LOWBATT.ICO b/NEWFOL~1/LOWBATT.ICO deleted file mode 100644 index 58a32c2..0000000 Binary files a/NEWFOL~1/LOWBATT.ICO and /dev/null differ diff --git a/NEWFOL~1/MAIL.ICO b/NEWFOL~1/MAIL.ICO deleted file mode 100644 index fdc1839..0000000 Binary files a/NEWFOL~1/MAIL.ICO and /dev/null differ diff --git a/NEWFOL~1/PBRUSH.ICO b/NEWFOL~1/PBRUSH.ICO deleted file mode 100644 index 063b154..0000000 Binary files a/NEWFOL~1/PBRUSH.ICO and /dev/null differ diff --git a/NEWFOL~1/PROGRAM.ICO b/NEWFOL~1/PROGRAM.ICO deleted file mode 100644 index 6d1cd55..0000000 Binary files a/NEWFOL~1/PROGRAM.ICO and /dev/null differ diff --git a/NEWFOL~1/QUESTION.ICO b/NEWFOL~1/QUESTION.ICO deleted file mode 100644 index 5177ea4..0000000 Binary files a/NEWFOL~1/QUESTION.ICO and /dev/null differ diff --git a/NEWFOL~1/W95FA.otf b/NEWFOL~1/W95FA.otf deleted file mode 100644 index 153077a..0000000 Binary files a/NEWFOL~1/W95FA.otf and /dev/null differ diff --git a/NEWFOL~1/gec.kra b/NEWFOL~1/gec.kra deleted file mode 100644 index a48ec7b..0000000 Binary files a/NEWFOL~1/gec.kra and /dev/null differ diff --git a/NEWFOL~1/w95fa.woff b/NEWFOL~1/w95fa.woff deleted file mode 100644 index 433ece2..0000000 Binary files a/NEWFOL~1/w95fa.woff and /dev/null differ diff --git a/NEWFOL~1/w95fa.woff2 b/NEWFOL~1/w95fa.woff2 deleted file mode 100644 index 730ddc4..0000000 Binary files a/NEWFOL~1/w95fa.woff2 and /dev/null differ diff --git a/base.css b/base.css new file mode 100644 index 0000000..fa102ee --- /dev/null +++ b/base.css @@ -0,0 +1,504 @@ +@import url(fonts/muller/muller.css); + + +/* OUTER */ + +* { box-sizing: border-box; } + +html, body { + min-height: 100vh; + scrollbar-gutter: stable; +} + +html { + font-family: Muller, sans-serif; + font-size: large; + font-weight: 500; + + background: var(--gradient); + color: black; + + --gradient: + linear-gradient(120deg, #fae58f, #fab6ba, #d1aeff, #89d6ff, #43f3ae); +} + +body { margin: 0; } + +@media (prefers-color-scheme: dark) { + html { + --gradient: + linear-gradient(20deg, + hsl(300deg 30% 20%), + hsl(220deg 30% 20%), + hsl(150deg 30% 20%), + hsl(30deg 30% 20%), + hsl(350deg 30% 20%)); + + color: #ffd; + } +} + + +/* TOP MENU */ + +#face-menu { place-self: center; } + +.menu input, .menu label { + cursor: pointer; +} + +.menu { + display: flex; + place-content: center; + place-items: center; + margin: auto; + padding: 0; + + font-size: 125%; + font-weight: 500; + + background: hsl(var(--menu-bg-hsl) / 50%); + border: 2px solid hsl(var(--menu-bg-hsl)); + box-shadow: 0 0 10px 5px hsl(var(--menu-bg-hsl) / 30%); + + --menu-bg-hsl: 60deg 100% 96%; +} + +@media (prefers-color-scheme: dark) { + .menu { --menu-bg-hsl: 260deg 100% 8%; } +} + +.hide-boxes input { + appearance: none; + width: 0; + margin: 0; + padding: 0; +} +.menu li { + display: flex; + list-style: none; +} +.menu label { + padding: .25em 1.25em; +} +.menu :checked + label { + font-weight: 700; +} + +.menu label { position: relative; } +.menu label::after { + content: ' '; + z-index: -1; + position: absolute; + inset: 0 0 100% 0; + background: hsl(var(--menu-bg-hsl)); + transition: inset .15s linear; +} +.menu :checked + label::after { + bottom: 0; +} + + +/* BASE FACE STYLES */ + +#cube > section { + --base-background: + repeating-linear-gradient(var(--bg-angle), + transparent, transparent 0.8em, + #fff8 0.8em, #fff8 1em), + linear-gradient(150deg, + hsl(var(--hue) 86% 94%), + hsl(var(--hue) 66% 82%) + ); + background: var(--base-background); + + border: 10px solid white; + padding: 2em; + + color: hsl(var(--hue) 40% 10%); + --text-shadow-color: white; + text-shadow: + 1px 1px 1px var(--text-shadow-color), + -1px 1px 1px var(--text-shadow-color), + -1px -1px 1px var(--text-shadow-color), + 1px -1px 1px var(--text-shadow-color); + + scrollbar-color: + hsl(calc(var(--hue) + 180deg) 90% 60%) + hsl(var(--hue) 50% 95%); +} + +#cube a { + color: hsl(calc(var(--hue) + 180deg) 90% 20%); + font-weight: 600; + text-decoration: none; +} +#cube a:hover { + text-decoration: underline; + text-decoration-style: dotted; + text-decoration-color: currentcolor; + text-decoration-thickness: 2px; +} + +h2 { margin-top: 0; } + +h3 { + text-align: center; + margin-bottom: 0.25em; +} + +strong { font-weight: 700; } + +#cube section ::selection { + color: white; + background: hsl(calc(var(--hue) + 180deg), 50%, 30%); + text-shadow: none; +} + +@media (prefers-color-scheme: dark) { + #cube > section { + --base-background: + repeating-linear-gradient(var(--bg-angle), + transparent, transparent 0.8em, + #0014 0.8em, #0014 1em), + linear-gradient(150deg, + hsl(var(--hue) 40% 30%), + hsl(var(--hue) 40% 15%) + ); + + border-color: hsl(var(--hue) 40% 10%); + + color: hsl(var(--hue) 40% 90%); + --text-shadow-color: black; + } + + #cube a { + color: hsl(calc(var(--hue) + 180deg) 100% 85%); + } +} + + + +/* SPECIFIC FACE STYLES */ + +/* the separate "#whatever ::selection" selector is because in + * chrome, ::selection doesn't inherit variables */ +#hello, #hello ::selection { + --hue: 310deg; + --bg-angle: 135deg; +} + +/* extra #cube selector for specificity */ +#cube #hello { + --bg-image: url(media/wave.png); + background: + var(--bg-image) bottom right / auto 60% no-repeat, + var(--base-background); +} + +@media (prefers-color-scheme: dark) { + #cube #hello { --bg-image: url(media/wave-neon.png); } +} + +#id, #id ::selection, #flags img { + --hue: 10deg; + --bg-angle: 45deg; +} + +#id dl { + display: grid; + grid-template-columns: min-content auto; + gap: 1em 2em; +} +#id dt { font-weight: 600; } +#id dd { margin: 0; } +#id dd a { font-weight: 700; } + +#id dl ul { + padding-left: 1em; + list-style: 'ā§ā€‚'; +} + +#flags { + display: flex; + flex-flow: wrap; + justify-content: center; + gap: 1em; + margin-top: 3em; +} + +#flags img { + height: 2em; + border: 2px solid hsl(var(--hue) 30% 5% / 60%); +} + + +#activities, #activities ::selection { + --hue: 70deg; + --bg-angle: -60deg; +} + +#cube #activities { + /* height of quobl.png is 58% of width */ + --bg-image: url(media/quobl.png); + background: + var(--bg-image) bottom left 2ex / 50% auto no-repeat local, + var(--base-background); + padding-bottom: 29%; +} + +@media (prefers-color-scheme: dark) { + #cube #activities { + --bg-image: url(media/quobl-neon.png); + } +} + +#links, #links ::selection { + --hue: 130deg; + --bg-angle: 210deg; +} + +#links ul { + padding: 0; + width: 100%; + display: flex; + flex-wrap: wrap; + gap: 4px; +} +#links li { + flex: 1 0 10em; + list-style: none; + --icon-bg: var(--fg); +} + +#links a { + height: 3em; + padding-left: calc(3em + 1ex); + display: flex; + align-items: center; + + border: 2px solid black; + background: + linear-gradient(to right, transparent 3em, var(--bg) 3em), + var(--icon) calc(1.5em - 16px) center / 32px auto no-repeat, + var(--icon-bg); + + color: var(--fg); + text-shadow: none; +} + +#links a:hover { text-decoration: none; } + +#links #gallery { + --icon: url(media/niss-icon.png); + --fg: hsl(280deg 38% 43%); + --bg: hsl(100deg 99% 81%); + image-rendering: pixelated; +} + +#links #code { + --icon: url(media/forgejo.svg); + --fg: white; + --icon-bg: #171e26; + --bg: #c2410c; +} + +#links #blog { + --icon: url(media/blog.png); + --fg: #ffeebb; + --bg: #332255; + /* image-rendering: pixelated; */ +} +#links #blog a { + background-position: center, left calc(1.5em - 51px) center, center; + background-size: contain; +} + +#links #itaku { + --icon: url(media/itaku.svg); + --fg: #ffeb3b; + --bg: #303030; +} + +#links #weasyl { + --icon: url(media/weasyl.svg); + --fg: white; + --bg: #970000; +} + +#links #fa { + --icon: url(media/furaffinity.png); + --icon-bg: #20242a; + --bg: #353b45; + --fg: white; +} + +#links #da { + --icon: url(media/deviantart.png); + --icon-bg: #000608; + --bg: #314537; + --fg: #e7ede4; +} + +#links #kofi { + --icon: url(media/ko-fi.webp); + --icon-bg: #def3ff; + --bg: white; + --fg: #ff5966; +} + +#links #artfight { + --icon: url(media/artfight.png); + --icon-bg: #222222; + --bg: #a65178; + --fg: white; +} + +#links #chitter { + --icon: url(media/chitter.png); + --bg: #582c58; + --icon-bg: #2c162c; + --fg: white; +} + +#links #cohost { + --icon: url(media/cohost.svg); + --bg: #ffab5c; + --icon-bg: #83254f; + --fg: black; +} + +#links #bluesky { + --icon: url(media/bluesky.svg); + --bg: #161e27; + --fg: white; +} + +@media (prefers-color-scheme: dark) { + /* most link colours are fine in both modes. except: */ + + #links #gallery { + --icon-bg: hsl(280deg 42% 30%); + --bg: hsl(280deg 38% 43%); + --fg: hsl(100deg 99% 81%); + } + + #links #weasyl { + --icon-bg: #252d32; + } + + #links #kofi { + --icon-bg: #2b3a44; + --bg: #192025; + --fg: #dce7eb; + } + + #links #bluesky { + --bg: #161e27; + --icon-bg: #1e2936; + --fg: white; + } +} + + +#friends, #friends ::selection { + --hue: 190deg; + --bg-angle: 300deg; +} + +#cube #friends { + display: grid; + grid: "hdr" min-content + "links1" auto + "links2" auto + "buttons" auto; +} + +#friends img { image-rendering: pixelated; } + +#friendlinks, #otherlinks { align-self: start; } + +#friendlinks ul, #otherlinks ul { + list-style: none; + padding: 0; + + display: flex; + width: 80%; + margin: 0 auto; + + align-items: start; + gap: 4px; + justify-content: center; + flex-wrap: wrap; +} + +#friendlinks img, #otherlinks img { + width: 88px; + height: 31px; + object-fit: none; +} + +#friends .txt { + display: inline-block; + width: 88px; + height: 31px; + border: 3px outset currentcolor; + text-align: center; + line-height: 28px; + + font-size: 18px; + font-weight: 600; + text-shadow: none; +} + +#friends a:hover { text-decoration: none; } + +#friends #khr a { background: #ffab71; color: #71153e; } +#friends #dusty a { background: #fbd265; color: #805c2d; } +#friends #ionchy a { background: #feca2f; color: #1b1505; } +#friends #tenna a { background: #6095da; color: #243224; } +#friends #river a { background: #98d8e7; color: #d67d28; } +#friends #spiral a { background: #ef4d5a; color: #1f1f1f; } +#friends #codl a { background: #87261f; color: #edb970; } +#friends #violet a { background: #8c2bd8; color: #dddddd; } +#friends #abyss a { background: #1e2e5f; color: #f8e1c2; } + +#nissbuttons { + align-self: end; + display: flex; + align-items: center; + justify-content: center; + gap: 1em; +} + +#nissbuttons * { margin: 0; } + +#six, #six ::selection { + --hue: 250deg; + --bg-angle: 130deg; +} + +#cube #six { + --bg-image: url(media/kesi.png); + background: + var(--bg-image) bottom right / 100% auto no-repeat, + var(--base-background); +} + +@media (prefers-color-scheme: dark) { + #cube #six { + --bg-image: url(media/kesi-neon.png); + } +} + +.zoom * { transition: all 0.25s ease-in; } +.zoom > :hover { + scale: 125%; + filter: drop-shadow(4px 4px 5px rgb(0 0 0 / 60%)); +} +.zoom > :hover:nth-child(5n) { rotate: 17deg; } +.zoom > :hover:nth-child(5n+1) { rotate: -12deg; } +.zoom > :hover:nth-child(5n+2) { rotate: 8deg; } +.zoom > :hover:nth-child(5n+3) { rotate: -23deg; } +.zoom > :hover:nth-child(10n+4) { rotate: 26deg; } +.zoom > :hover:nth-child(10n+9) { rotate: -6deg; } diff --git a/cube.css b/cube.css new file mode 100644 index 0000000..cbcfbad --- /dev/null +++ b/cube.css @@ -0,0 +1,60 @@ +body { + display: grid; + grid-template-rows: 5em 1fr 5em; + + perspective: 440vw; + perspective-origin: 50% 120%; +} + +/* CUBE ASSEMBLY */ +/* the rest is in cube.ts */ + +html { + --side: min(65vh, 70vw); + --half: calc(var(--side) * .5); + --nhalf: calc(0em - var(--half)); + --breathe: calc(var(--side) * .1); +} + +/* cube shadow */ +html { + background: + radial-gradient(circle, hsl(330deg 40% 40% / 70%), transparent 58%), + var(--gradient); + background-blend-mode: multiply; +} + +#outer { + --transform-origin: 50% 50% calc(var(--nhalf) - min(6vh, 6vw)); +} + +#outer, #cube { + transform-style: preserve-3d; + transform-origin: var(--transform-origin); + width: calc(var(--side) + 10vw); + height: calc(var(--side) + 10vh); + margin: auto; +} + +#cube { + position: relative; +} + +#cube > section { + position: absolute; + inset: 5vh 5vw; + overflow: auto; + transform-origin: var(--transform-origin); + transform: var(--base-transform); + overscroll-behavior: contain; +} + +@supports (scrollbar-color: pink orange) { /* safari detector */ + #cube:not([data-moving]) > section { + animation: breathe 9s infinite ease-in-out; + } +} + +@keyframes breathe { + 35% { transform: translateZ(var(--breathe)) var(--base-transform); } +} diff --git a/cube.ts b/cube.ts new file mode 100644 index 0000000..5a2e411 --- /dev/null +++ b/cube.ts @@ -0,0 +1,257 @@ +type Face = 'front' | 'top' | 'back' | 'bottom' | 'left' | 'right'; + +type Pane = 'hello' | 'id' | 'activities' | 'links' | 'friends' | 'six'; +const panes: Pane[] = ['hello', 'id', 'activities', 'links', 'friends', 'six']; + +/** + * - for front, left, right: up is up + * - for back: up is down (lol) + * - for top: up is away from you + * - for bottom: up is towards you + */ +type Orientation = 'up' | 'left' | 'down' | 'right'; + +type Place = [Face, Orientation]; + + +function table(m: Record): (x: A) => B { + return x => m[x]; +} + + +const doCwO = + table({up: 'right', right: 'down', down: 'left', left: 'up'}); + +const doCcwO = + table({up: 'left', left: 'down', down: 'right', right: 'up'}); + + +type Direction = 'up' | 'left' | 'down' | 'right'; +type Rotation = 'cw' | 'ccw'; +type Movement = Direction | Rotation; + +// if you rotate the cube "up" (along the x axis), face f becomes up(f) +// et cetera +const faceMoves: Record Face> = { + up: table({ + front: 'top', top: 'back', back: 'bottom', + bottom: 'front', left: 'left', right: 'right' + }), + down: table({ + front: 'bottom', top: 'front', back: 'top', + bottom: 'back', left: 'left', right: 'right' + }), + left: table({ + front: 'left', top: 'top', back: 'right', + bottom: 'bottom', left: 'back', right: 'front' + }), + right: table({ + front: 'right', top: 'top', back: 'left', + bottom: 'bottom', left: 'front', right: 'back' + }), + cw: table({ + front: 'front', back: 'back', left: 'top', + right: 'bottom', top: 'right', bottom: 'left' + }), + ccw: table({ + front: 'front', back: 'back', left: 'bottom', + right: 'top', top: 'left', bottom: 'right' + }) +}; + +const orientationMoves: + Record Orientation> = +{ + up(f, o) { + switch (f) { + case 'left': return doCcwO(o); + case 'right': return doCwO(o); + default: return o; + } + }, + down(f, o) { + switch (f) { + case 'left': return doCwO(o); + case 'right': return doCcwO(o); + default: return o; + } + }, + left(f, o) { + switch (f) { + case 'top': return doCwO(o); + case 'bottom': return doCcwO(o); + case 'left': + case 'back': return doCwO(doCwO(o)); + default: return o; + } + }, + right(f, o) { + switch (f) { + case 'top': return doCcwO(o); + case 'bottom': return doCwO(o); + case 'right': + case 'back': return doCcwO(doCcwO(o)); + default: return o; + } + }, + cw(f, o) { return f == 'back' ? doCcwO(o) : doCwO(o); }, + ccw(f, o) { return f == 'back' ? doCwO(o) : doCcwO(o); } +}; + +function applyMoves([f, o]: Place, ms: Movement[]): Place { + for (const m of ms) { + o = orientationMoves[m](f, o); + f = faceMoves[m](f); + } + return [f, o]; +} + +const toFront = table({ + front: [], top: ['down'], back: ['left', 'left'], + bottom: ['up'], left: ['right'], right: ['left'] +}); + +const toUpright = table({ + up: [], left: ['cw'], down: ['cw', 'cw'], right: ['ccw'] +}); + +function toFrontUpright([f, o]: Place): [Direction[], Rotation[]] { + const directions = toFront(f); + const rotations = toUpright(applyMoves([f, o], directions)[1]); + return [directions, rotations]; +} + + +const movementToTransform = table({ + up: 'rotateX(.25turn)', down: 'rotateX(-.25turn)', + left: 'rotateY(-.25turn)', right: 'rotateY(.25turn)', + cw: 'rotateZ(.25turn)', ccw: 'rotateZ(-.25turn)' +}); + +function movementsToTransform(ms: Movement[]) { + return ms.map(movementToTransform).join(' '); +} + +const faceToTransform = table({ + front: '', top: 'rotateX(.25turn)', + back: 'rotateX(.5turn)', bottom: 'rotateX(-.25turn)', + left: 'rotateY(-.25turn)', right: 'rotateY(.25turn)' +}); + +const orientationToTransform = table({ + up: '', left: 'rotateZ(-.25turn)', + down: 'rotateZ(-.5turn)', right: 'rotateZ(.25turn)' +}); + +function toTransform(f: Face, o: Orientation): string { + const ft = faceToTransform(f); + const ot = orientationToTransform(o); + return ft || ot ? `${ft} ${ot}` : 'none'; +} + + +type Conf = Record; + +// the back face is 'down' so it has the same visual orientation as other side faces +let current: Conf = { + hello: ['front', 'up'], id: ['left', 'up'], + activities: ['back', 'down'], links: ['right', 'up'], + friends: ['bottom', 'up'], six: ['top', 'up'], +}; + +function applyConfiguration(): void { + for (const pane of panes) { + const element = document.getElementById(pane)!; + const [face, ori] = current[pane]; + + element.style.setProperty('--base-transform', toTransform(face, ori)); + element.style.pointerEvents = face == 'front' ? 'auto' : 'none'; + } +} + +function move(c: Conf, ...ms: Movement[]): Conf { + let res: Partial = {}; + for (const p of panes) { res[p] = applyMoves(c[p], ms) } + return res as Conf; +} + + +function animateMoveWith(ds: Direction[], rs: Rotation[]): void { + const outer = document.getElementById('outer')!; + const cube = document.getElementById('cube')!; + + cube.dataset.moving = 'true'; + + cube.style.transition = '0.4s cubic-bezier(.4, -0.29, .43, 1.26)'; + outer.style.transition = `0.4s 0.25s cubic-bezier(.48, 0, .44, 1.07)`; + + function transitionListener(elem: HTMLElement): () => void { + function handler(e: Event) { + if (e.target == elem) { finish(); } + } + + elem.addEventListener('transitionend', handler); + return () => elem.removeEventListener('transitionend', handler); + } + + let removeOuter = () => {}; + let removeCube = () => {}; + if (rs.length > 0) { + removeOuter = transitionListener(outer); + cube.style.transform = movementsToTransform(ds); + outer.style.transform = movementsToTransform(rs); + } else if (ds.length > 0) { + removeCube = transitionListener(cube); + cube.style.transform = movementsToTransform(ds); + } else { + finish(); + } + + function finish() { + removeOuter(); removeCube(); + + outer.style.transition = cube.style.transition = + outer.style.transform = cube.style.transform = 'none'; + delete cube.dataset.moving; + + current = move(current, ...ds, ...rs); + applyConfiguration(); + } +} + +function animateMoveTo(pane: Pane): void { + const [ds, rs] = toFrontUpright(current[pane]); + + animateMoveWith(ds, rs); + history.replaceState(null, '', `#${pane}`); +} + + +function setup(): void { + for (const pane of panes) { + const box = document.getElementById(`b-${pane}`) as HTMLInputElement; + box.addEventListener('change', () => { + if (box.checked) { animateMoveTo(pane); } + }); + + if (location.hash == `#${pane}`) { + current = move(current, ...toFrontUpright(current[pane]).flat()); + box.checked = true; + } + } + + applyConfiguration(); +} + +document.addEventListener('DOMContentLoaded', setup); + +/* +function LEFT() { animateMoveWith(['left'], []); } +function RIGHT() { animateMoveWith(['right'], []); } +function UP() { animateMoveWith(['up'], []); } +function DOWN() { animateMoveWith(['down'], []); } +function CW() { animateMoveWith([], ['cw']); } +function CCW() { animateMoveWith([], ['ccw']); } +*/ + +export {}; diff --git a/style/fonts/muller/muller.css b/fonts/muller/muller.css similarity index 100% rename from style/fonts/muller/muller.css rename to fonts/muller/muller.css diff --git a/id.html b/id.html deleted file mode 100644 index d4fd2e1..0000000 --- a/id.html +++ /dev/null @@ -1,55 +0,0 @@ - - - - - - - -identity matrix - -
-

identity matrix

- -
- -
-
name -
-
    -
  • niss or q.t. -
  • rhiannon/rhi when necessary -
  • always lowercase -
- -
pronouns -
-
    -
  • she, they, or it in english. pick whichever -
  • sie auf deutsch -
- -
shapes -
- -
- - - - -
diff --git a/index.html b/index.html index ddf3ad7..f007d77 100644 --- a/index.html +++ b/index.html @@ -1,41 +1,326 @@ + - - - +the gec zone - - - -šŸ¦Ž the gec zone šŸ¦Ž - -
-
-

ā€œmlemā€

-

ā€œmlem alsoā€

- - - ā€” the gecs - -
- -
- - -
  • identity -
  • contact -
  • art -
  • comms -
  • code -
  • conlangs -
  • links -
    • -
    + + + + + + + + + + + + + + + + + +
    +
    +
    +

    hey

    + +

    iā€™m niss. whatā€™s up +

    + +
    +

    so whatā€™s your deal

    + +
    +
    name +
    +
      +
    • niss or q.t. +
    • always lowercase +
    + +
    pronouns +
    +
      +
    • she, they, or it in english. pick whichever +
    • sie auf deutsch +
    + +
    shapes +
    + +
    + +
    + non-binary + genderfluid + pansexual + quoiromantic + polyamorous +
    +
    + +
    +

    what do you do

    + +

    i draw furry art! you can see that + here. i enjoy creatures with + weird body plans. if you want me to draw you something then + please step this way + +

    i like type systems! iā€™m slowly working on a language + called quox, which lives + here. + i havenā€™t got around to making a website for it yet + +

    i like conlangs! i have a couple + here. they are extremely + ā€œconlangerā€™s notesā€ quality, which means incomplete and incomprehensible + to anyone other than their author + +

    iā€™m sure thereā€™s other stuff but talking about yourself is hard +

    + + + +
    +

    more websites please

    + + + + + +
    +

    niss buttons for you ā†’

    + niss button + q.t. button +
    + +
    + +
    +

    a sixth thing

    + +

    wow +

    +
    +
    + + diff --git a/links.html b/links.html deleted file mode 100644 index e69bebc..0000000 --- a/links.html +++ /dev/null @@ -1,113 +0,0 @@ - - - - - - - -links for lizards - -
    -
    -

    links for lizards

    -
    - - -

    more animals

    - -
    - - dino - - - - goaty - - - tenna - - violet - - - gulfie - - - river - - khr - - codl - - - myno - - - - candiedreptile - - - - spiral - - - dex - - - - pebble - - - - beeps - - - - cobalt - - - - grace - - - - dusty - - - - tsunderdog - - - ionchy - - - cial - -
    - -
    - -
    -

    - also here are mine, for you to use! - -

    - niss button -
    by me
    -
    - -
    - q.t. button -
    by candiedreptile
    -
    -
    - -
    - - maybe iā€™ll link to other stuff here later! but for now check out my cool - friendsā€™ websites - - -
    diff --git a/media/18_plus.svg b/media/18_plus.svg deleted file mode 100644 index d8a31c0..0000000 --- a/media/18_plus.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/media/art.svg b/media/art.svg deleted file mode 100644 index 61a98f1..0000000 --- a/media/art.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/media/artfight.png b/media/artfight.png new file mode 100644 index 0000000..ca83461 --- /dev/null +++ b/media/artfight.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:1dd4a471106eac27cb8cb85e4d8670bd9a8bf2c2628e6ca9e388fa55c74d2747 +size 6254 diff --git a/media/battery_low.svg b/media/battery_low.svg deleted file mode 100644 index cf87822..0000000 --- a/media/battery_low.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/media/bg.kra b/media/bg.kra deleted file mode 100644 index 447459a..0000000 Binary files a/media/bg.kra and /dev/null differ diff --git a/media/bg.png b/media/bg.png deleted file mode 100644 index e5dcfc4..0000000 --- a/media/bg.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:fe2fc260bacaaed167d1bf1ac23461ae26b7578bd81cc261c04d36362ec0c21b -size 14942 diff --git a/media/bg_2x.png b/media/bg_2x.png deleted file mode 100644 index a3e2c78..0000000 --- a/media/bg_2x.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:5e696cfb1f583c96dd14810696dba4e099830b1ef512b3d92481c414dab434eb -size 33823 diff --git a/media/blog.png b/media/blog.png new file mode 100644 index 0000000..87f7d51 --- /dev/null +++ b/media/blog.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:dc0463c2e08a0f06a7351a4f26ab11fc7f548c50d7a6170e39ef429ead36b83d +size 23120 diff --git a/media/bluesky.svg b/media/bluesky.svg new file mode 100644 index 0000000..8cd5e0b --- /dev/null +++ b/media/bluesky.svg @@ -0,0 +1,55 @@ + + + + + + image/svg+xml + + + + + + + + diff --git a/media/butterfly.png b/media/butterfly.png deleted file mode 100644 index 2a011eb..0000000 --- a/media/butterfly.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:9887a6bf925d8a0aa350f681ee3f2b51000be46d438c1d0f9306f2bc0e5d282f -size 35288 diff --git a/media/buttons/cdromca.png b/media/buttons/cdromca.png new file mode 100644 index 0000000..033600f --- /dev/null +++ b/media/buttons/cdromca.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:4f13b8b029138e2d4fc1c8a231a94b7888ae37a074000a7cc937d495a16ae26f +size 1718 diff --git a/media/buttons/cohost.gif b/media/buttons/cohost.gif new file mode 100644 index 0000000..66d9462 --- /dev/null +++ b/media/buttons/cohost.gif @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:345dfcbc53a5b7917bcfbc0a308e062f28e1ee29bdc59baec89740229cbb74bb +size 794 diff --git a/media/buttons/corru.gif b/media/buttons/corru.gif new file mode 100644 index 0000000..6cdd66d --- /dev/null +++ b/media/buttons/corru.gif @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:7e1d2afa0288b37af6ed4b715eb74b3c74d1dbf149fd4e50d92d9b18ba7507ed +size 123640 diff --git a/media/buttons/creature0354.gif b/media/buttons/creature0354.gif new file mode 100644 index 0000000..67d50c8 --- /dev/null +++ b/media/buttons/creature0354.gif @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:7651f313ff6ec293d3646dddf225c5132a33409507d4c8cf65e8fefe53ffb3c0 +size 165785 diff --git a/media/buttons/hthrflwrs.png b/media/buttons/hthrflwrs.png new file mode 100644 index 0000000..004ef29 --- /dev/null +++ b/media/buttons/hthrflwrs.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:b8d86b54fa406671d4d29e2952269533458b2a62524a360548f6495298afd621 +size 265 diff --git a/media/buttons/krita.kra b/media/buttons/krita.kra new file mode 100644 index 0000000..bc9f69c Binary files /dev/null and b/media/buttons/krita.kra differ diff --git a/media/buttons/krita.png b/media/buttons/krita.png new file mode 100644 index 0000000..ded46ff --- /dev/null +++ b/media/buttons/krita.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:e96355c94a1aa24894139c616593ccaac5ecc3be84dd167a46ba4ddc9771e759 +size 11871 diff --git a/media/buttons/transy.gif b/media/buttons/transy.gif new file mode 100644 index 0000000..0fa7440 --- /dev/null +++ b/media/buttons/transy.gif @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:74fd54417da8c416cc1935f84be5da774fd6ce8dc543663c958c1b447069f6e4 +size 773 diff --git a/media/buttons/tuxedodragon.gif b/media/buttons/tuxedodragon.gif new file mode 100644 index 0000000..246cd38 --- /dev/null +++ b/media/buttons/tuxedodragon.gif @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:f5eb63540d0ec85237c85286f429372d7b41475bbfbab5b4fd701b64e387decd +size 20244 diff --git a/media/club_suit.svg b/media/club_suit.svg deleted file mode 100644 index a6382d4..0000000 --- a/media/club_suit.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/media/comm-examples.kra b/media/comm-examples.kra deleted file mode 100644 index 943b3fa..0000000 Binary files a/media/comm-examples.kra and /dev/null differ diff --git a/media/comm-examples.png b/media/comm-examples.png deleted file mode 100644 index f43c848..0000000 --- a/media/comm-examples.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:5e50e1972519fdb5d5aa0d7a133a9a2a40bdfc67182a900aa5cd7f1c47e92e7a -size 442433 diff --git a/media/contact.svg b/media/contact.svg deleted file mode 100644 index 8890f11..0000000 --- a/media/contact.svg +++ /dev/null @@ -1,44 +0,0 @@ - - - - - - - - Mutant Standard emoji 2023.12 - - - - - Caius Nocturne - http://mutant.tech/ - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/media/cybre.png b/media/cybre.png deleted file mode 100644 index 31d3394..0000000 --- a/media/cybre.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:db7f6763c85ac58ada0c5697d5320f2571662f4c13526bfe7919ad61314e5dc2 -size 187946 diff --git a/media/deviantart.png b/media/deviantart.png new file mode 100644 index 0000000..7f3df4b --- /dev/null +++ b/media/deviantart.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:57fcaee15f62d1f5b26e6a549d3b17cdb4d92d56af7c99ff5063a31160bda8e0 +size 10295 diff --git a/media/flags/agen.png b/media/flags/agen.png deleted file mode 100644 index 8339163..0000000 --- a/media/flags/agen.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:3f3989e35269ab617cacd5961993d6c460b3c5cf2db881191e4071b3ae1676f3 -size 626 diff --git a/media/flags/greyace.png b/media/flags/greyace.png deleted file mode 100644 index 8c091cb..0000000 --- a/media/flags/greyace.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:fdbe76d9e3f0bca3f5e383a0d6f353f49ee89460e2b620a98a8097f287ad128e -size 590 diff --git a/media/forgejo.svg b/media/forgejo.svg new file mode 100644 index 0000000..8eb1747 --- /dev/null +++ b/media/forgejo.svg @@ -0,0 +1,27 @@ + + + + + + + + + + \ No newline at end of file diff --git a/media/furaffinity.png b/media/furaffinity.png new file mode 100644 index 0000000..a4238f5 --- /dev/null +++ b/media/furaffinity.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:0c8641ca6b828133dfdd94ec7e12381fa70846d9595415c8fea6f295ea55acb3 +size 34015 diff --git a/media/globe.svg b/media/globe.svg deleted file mode 100644 index cb83657..0000000 --- a/media/globe.svg +++ /dev/null @@ -1,35 +0,0 @@ - - - - - - - - Mutant Standard emoji 2024.06 - - - - - Caius Nocturne - http://mutant.tech/ - - - - - - - - - - - - - - - - - - diff --git a/media/green_tick.svg b/media/green_tick.svg deleted file mode 100644 index 18b09c1..0000000 --- a/media/green_tick.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/media/info.svg b/media/info.svg deleted file mode 100644 index c96440d..0000000 --- a/media/info.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/media/itaku.svg b/media/itaku.svg new file mode 100644 index 0000000..2825bb6 --- /dev/null +++ b/media/itaku.svg @@ -0,0 +1,69 @@ + + + + + + image/svg+xml + + itaku-logo + + + + + + + + itaku-logo + + diff --git a/media/kesi-neon.kra b/media/kesi-neon.kra new file mode 100644 index 0000000..d4fda14 Binary files /dev/null and b/media/kesi-neon.kra differ diff --git a/media/kesi-neon.png b/media/kesi-neon.png new file mode 100644 index 0000000..ebd4c30 --- /dev/null +++ b/media/kesi-neon.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:036163fb782d2ccdcf2ba3b0037d363dd702ffd813249f2add1f64ce3e9e91a3 +size 209932 diff --git a/media/kesi.png b/media/kesi.png index dadb59b..aa38a60 100644 --- a/media/kesi.png +++ b/media/kesi.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:9dbdeca555a102593d431af50fbf80bb9db43e36e77f13896afa9d2a71e61d8a -size 113987 +oid sha256:13d4fde531776d1f7c07a7cf6691bfd57cc799b8f4c9e2f51a56fa956d9334fe +size 46717 diff --git a/media/ko-fi.webp b/media/ko-fi.webp new file mode 100644 index 0000000..a5a99ce Binary files /dev/null and b/media/ko-fi.webp differ diff --git a/media/light_bulb.svg b/media/light_bulb.svg deleted file mode 100644 index f8ffe2c..0000000 --- a/media/light_bulb.svg +++ /dev/null @@ -1,151 +0,0 @@ - - - - - - - - - - - - - - - - - - - - image/svg+xml - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/media/lockpen.png b/media/lockpen.png deleted file mode 100644 index 5079b58..0000000 --- a/media/lockpen.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:538ed0370a0b6116181dcaf30cbbb9d130ca3780d9807356bebf9a0384b9c7e6 -size 5331 diff --git a/media/love_letter.svg b/media/love_letter.svg deleted file mode 100644 index 6360856..0000000 --- a/media/love_letter.svg +++ /dev/null @@ -1,39 +0,0 @@ - - - - - - - - Mutant Standard emoji 2023.12 - - - - - Caius Nocturne - http://mutant.tech/ - - - - - - - - - - - - - - - - - - - - - - diff --git a/media/mlem_bg.gif b/media/mlem_bg.gif deleted file mode 100644 index 5f9c827..0000000 --- a/media/mlem_bg.gif +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:eb42a9952e3c9918fb9e0c9ffcdabd89e404b8a33b64b9c6fac230aae7e27a82 -size 59738 diff --git a/media/money.svg b/media/money.svg deleted file mode 100644 index 158816c..0000000 --- a/media/money.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/media/niss-icon.kra b/media/niss-icon.kra new file mode 100644 index 0000000..d8ac077 Binary files /dev/null and b/media/niss-icon.kra differ diff --git a/media/niss-icon.png b/media/niss-icon.png new file mode 100644 index 0000000..2a1af8e --- /dev/null +++ b/media/niss-icon.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:a23eb36f8671fcf15ffd84c9ecbb16533cce24ce86689ac28ccac379b08b6b30 +size 9666 diff --git a/media/niss-nisse.mp3 b/media/niss-nisse.mp3 deleted file mode 100644 index 192d588..0000000 --- a/media/niss-nisse.mp3 +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:b68c2b121dbea39dcf4a80946f338241d9d306ee77574a8fad61f47d1493f43f -size 27890 diff --git a/media/niss-nisse.ogg b/media/niss-nisse.ogg deleted file mode 100644 index 203496c..0000000 --- a/media/niss-nisse.ogg +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:96b80fce404bfbdb2e2143ea5041c600a853f15dcd60d64cec2fc1553890ef12 -size 29252 diff --git a/media/question.svg b/media/question.svg deleted file mode 100644 index bc1be0e..0000000 --- a/media/question.svg +++ /dev/null @@ -1,38 +0,0 @@ - - - - - - - - Mutant Standard emoji 2020.04 - - - - - Dzuk - http://mutant.tech/ - - - - - - - - - - - - - - - - - - - - - diff --git a/media/quobl-neon.kra b/media/quobl-neon.kra new file mode 100644 index 0000000..c4bee63 Binary files /dev/null and b/media/quobl-neon.kra differ diff --git a/media/quobl-neon.png b/media/quobl-neon.png new file mode 100644 index 0000000..4abb6ad --- /dev/null +++ b/media/quobl-neon.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:8c9a39a90f822b40f947bb605a55e71e5fe6c1c0bc68619028900d295d2f6306 +size 128391 diff --git a/media/quobl.kra b/media/quobl.kra index 789cd35..edb11ab 100644 Binary files a/media/quobl.kra and b/media/quobl.kra differ diff --git a/media/quobl.png b/media/quobl.png index fc43be1..43cc6bb 100644 --- a/media/quobl.png +++ b/media/quobl.png @@ -1,3 +1,3 @@ version https://git-lfs.github.com/spec/v1 -oid sha256:3eb3714b181d9e5c07b055ca4b682bcacae415bf8d9399e1c325455291db0909 -size 142155 +oid sha256:d28e95c0b387047437d98cd9ead84e40a7ccc3d65ba3550ff6df91a174d203ef +size 151758 diff --git a/media/quobl2.png b/media/quobl2.png deleted file mode 100644 index ff1a7e7..0000000 --- a/media/quobl2.png +++ /dev/null @@ -1,3 +0,0 @@ -version https://git-lfs.github.com/spec/v1 -oid sha256:087af900beaa0034ef3fe65a2d33a97d2f33012896e51b181c4d9e91c5ffb18b -size 143027 diff --git a/media/speech.svg b/media/speech.svg deleted file mode 100644 index 255e1ad..0000000 --- a/media/speech.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/media/wave-neon.kra b/media/wave-neon.kra new file mode 100644 index 0000000..5d4df80 Binary files /dev/null and b/media/wave-neon.kra differ diff --git a/media/wave-neon.png b/media/wave-neon.png new file mode 100644 index 0000000..21d1b92 --- /dev/null +++ b/media/wave-neon.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:7a6a63dea4b1b2cd5b89d61dd476c4554c56e8ea8019d5212fd91374fe8efc54 +size 203225 diff --git a/media/wave.kra b/media/wave.kra new file mode 100644 index 0000000..21b16a1 Binary files /dev/null and b/media/wave.kra differ diff --git a/media/wave.png b/media/wave.png new file mode 100644 index 0000000..0a17be0 --- /dev/null +++ b/media/wave.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:a4b518dfb2c1ec18dff6520241afcaa87c2c3f0e0e806b97d4c69756621fe4c0 +size 330368 diff --git a/media/weasyl.svg b/media/weasyl.svg new file mode 100644 index 0000000..3ffd80a --- /dev/null +++ b/media/weasyl.svg @@ -0,0 +1,2 @@ + + \ No newline at end of file diff --git a/shuffle.ts b/shuffle.ts new file mode 100644 index 0000000..0d4d489 --- /dev/null +++ b/shuffle.ts @@ -0,0 +1,66 @@ +function group(subject: A[], keepTogether: A[][]): A[][] { + type Value = {array: A[], added: boolean}; + + let groups: Map = new Map; + for (const xs of keepTogether) { + let value = {array: xs, added: false}; + for (const x of xs) { groups.set(x, value); } + } + + let res = []; + + for (const x of subject) { + let group = groups.get(x); + if (group?.added) { continue; } + else if (group) { + group.added = true; + res.push(group.array); + } else { + res.push([x]); + } + } + + return res; +} + +function shuffle(subject: A[]): A[] { + let res = Array.from(subject); + + for (let i = 0; i < res.length - 2; ++i) { + const j = i + Math.floor(Math.random() * (res.length - i)); + if (i != j) { + const k = res[i]!; + res[i] = res[j]!; + res[j] = k; + } + } + + return res; +} + +function groupedShuffle(subject: A[], keepTogether: A[][]): A[] { + let groups = group(subject, keepTogether); + return shuffle(groups).flat(); +} + +function shuffleAll() { + let groups = [group('myno', 'abyss')]; + + for (const elem of Array.from(document.getElementsByClassName('shuffle'))) { + let shuffled = groupedShuffle(Array.from(elem.children), groups); + + elem.innerHTML = ''; + for (const child of shuffled) { + elem.appendChild(child); + } + } + + function group(...xs: string[]) { + let elements = xs.map(x => document.getElementById(x)); + return elements.every(x => x) ? elements as HTMLElement[] : []; + } +} + +document.addEventListener('DOMContentLoaded', shuffleAll); + +export {}; diff --git a/style/ANGELF~1.CSS b/style/ANGELF~1.CSS deleted file mode 100644 index ec3101c..0000000 --- a/style/ANGELF~1.CSS +++ /dev/null @@ -1,112 +0,0 @@ -:root { - font: 18pt serif; - color: white; - background: url(NEWFOL~1/GEC.JPG); -} - -main { - width: 30em; - padding: 1rem; - margin: 1rem auto; - border: 8px outset white; - background: #639; -} - - -header, h1, h2, h3 { text-align: center; } -h1 { margin-top: 0; } -header { overflow: hidden; } - -@media not (prefers-reduced-motion) { - @keyframes marquee { - from { transform: translateX(100%); } - to { transform: translateX(-100%); } - } - - h1 { - animation-name: marquee; - animation-timing-function: linear; - animation-duration: 7.5s; - animation-iteration-count: infinite; - } -} - - -#mlemtext { - position: relative; - width: 80%; - margin: 0 auto; - height: 3em; -} -.niss, .nisse { position: absolute } -.niss { left: 0 } -.nisse { right: 0 } - -header picture, header img { - display: block; - margin: 0 auto; - bacground: black; -} - -#mlem + p { margin-top: 0; } - - -img[src$='.svg'] { height: 1em; } - -a { - color: #9cf; - font-weight: bold; - text-decoration: none; -} - -table { - width: 80%; - border-spacing: 0.75em 0.15em ; -} - -th { - text-align: right; - font-weight: normal; -} -td { - font-weight: bold; -} - - -@font-face { - font-family: 'W95FA'; - src: url(NEWFOL~1/W95FA.otf) format('opentype'), - url(NEWFOL~1/w95fa.woff) format('woff'), - url(NEWFOL~1/w95fa.woff2) format('woff2'); -} - -#links { - position: absolute; - top: 0; left: 0; - font-family: 'W95FA', sans-serif; - font-size: 13pt; - padding: 1rem; -} - -#links li { - display: block; - width: 5em; - text-align: center; - margin-bottom: 1em; -} - -#links img { - display: block; - margin: auto; -} - -#links a { - font-weight: normal; - color: white; - text-decoration: none; -} - -#links span { - background: black; - padding: 0 0.25ch; -} diff --git a/style/base.css b/style/base.css deleted file mode 100644 index cf18c6b..0000000 --- a/style/base.css +++ /dev/null @@ -1,225 +0,0 @@ -@import url(fonts/muller/muller.css); -@import url(fonts/noto/noto.css); - -:root { - /* - --gradient: - linear-gradient(135deg, - hsl(42deg, 92%, 70%), - hsl(348deg, 92%, 70%), - hsl(334deg, 100%, 80%), - hsl(234deg, 100%, 76%), - hsl(195deg, 100%, 67%), - hsl(155deg, 70%, 62%) - ); - */ - - --gradient: - linear-gradient(135deg, - oklch(92% 0.108 96), - oklch(84% 0.08 15), - oklch(81% 0.117 304), - oklch(84% 0.095 233), - oklch(86% 0.171 162) - ); - --size: 15pt; - --weight: 600; - --link-color: hsl(196deg, 100%, 85%); - --hover-color: hsl(50deg, 100%, 82%); - - background: - image-set(url(../media/bg.png) 1x, - url(../media/bg_2x.png) 2x) - top center fixed, - var(--gradient) fixed; - background-blend-mode: overlay; - - font-family: 'Muller'; - font-size: var(--size); - font-weight: var(--weight); - color: white; - text-shadow: - 1px 1px 0 black, - -1px 1px 0 black, - 1px -1px 0 black, - -1px -1px 0 black, - 4px 4px 4px hsla(0, 0%, 0%, 70%); - text-align: center; - margin: 2em 1em 0.5em; -} - -main { - --default-bg: hsla(316deg, 100%, 95%, 45%); - background: var(--default-bg); - border-radius: 2em; - --glow-col: hsla(318deg, 100%, 98%, 100%); - border: 1px solid var(--glow-col); - box-shadow: 0 0 25px var(--glow-col) inset; - - padding: 1em; - margin: 0 auto 1em; -} - -header :is(p, h1, h2, h3, h4, h5, h6) { - font-weight: 700; - margin-top: 0; -} - -h1 { - font-size: 200%; -} - -h2, header p { - font-size: 150%; -} - -b { - font-weight: 800; -} - -hr { - height: 4px; - width: 75%; - background-color: hsla(0, 0%, 100%, 85%); - box-shadow: 0 0 3px hsl(0, 0%, 100%, 50%); - border: none; - text-shadow: none; - margin: 20px auto; -} - -.ipa { - font-family: NotoSans; - font-weight: 900; - font-size: 90%; -} - -a[href] { - color: var(--link-color); - font-weight: 800; - text-decoration: none; - transition: color 0.2s ease-in-out; -} -a[href]:where(:hover,:focus) { - color: var(--hover-color); -} - - -dl { - display: grid; - grid-template-columns: repeat(4, auto); - grid-row-gap: 6px; - grid-column-gap: 1em; - justify-content: center; -} - -dt { - text-align: right; - margin: 0; -} -dd { - font-weight: 700; - text-align: left; - margin: 0; -} - - -:is(rt, h1, h2)::before, :is(rt, h1, h2)::after { - padding: 0 0.25em; - vertical-align: middle; - display: inline-block; - height: 1em; width: 1em; - mix-blend-mode: overlay; - content: var(--around-image); -} - -rt::before { margin-left: -1.25em; } -rt::after { margin-right: -1.25em; } - -/* hacky fix for firefox mobile 68 freaking out at blend modes ā˜¹ */ -@media (-moz-touch-enabled) { - :root { - background: var(--gradient) fixed; - background-blend-mode: initial; - } -} - -.emojo { - vertical-align: middle; - height: 1.2em; width: 1.2em; -} - -.pixel { - /* firefox doesn't support "pixelated" but does treat "crisp-edges" - * to mean that */ - image-rendering: crisp-edges; - image-rendering: pixelated; -} - - -/******************************/ -/* actual accessibility stuff */ -/******************************/ - -@media (prefers-reduced-motion: reduce) { - /* see also the alternate source in #mlem > picture */ - .mlem-text { - display: none; - } -} - - -@media (prefers-contrast: more), (prefers-color-scheme: dark) { - :root { - /* - --gradient: - linear-gradient(135deg, - hsl(42deg, 56%, 55%), - hsl(348deg, 56%, 55%), - hsl(334deg, 60%, 43%), - hsl(234deg, 60%, 40%), - hsl(195deg, 60%, 44%), - hsl(155deg, 60%, 55%) - ); - */ - - --gradient: - linear-gradient(135deg, - /* oklch(33% 0.16 86), */ - oklch(30% 0.17 15), - oklch(30% 0.18 304), - oklch(30% 0.18 233), - oklch(30% 0.18 162) - ); - - background: - image-set(url(../media/bg_dim.png) 1x, - url(../media/bg_2x_dim.png) 2x) - top center fixed, - var(--gradient) fixed; - background-blend-mode: multiply; - } - - main { - --default-bg: hsla(0, 0%, 0%, 60%); - --glow-col: hsla(0, 0%, 0%, 60%); - } - - :is(#links ul, rt, h1, h2)::before, :is(#links ul, rt, h1, h2)::after { - mix-blend-mode: screen; - } - - hr { - background: white; - } -} - -@media (prefers-reduced-transparency) { - :root { - background: var(--gradient) fixed; - background-blend-mode: initial; - } - - :is(#links ul, rt, h1, h2)::before, :is(#links ul, rt, h1, h2)::after { - mix-blend-mode: initial; - } -} diff --git a/style/fonts/noto/noto.css b/style/fonts/noto/noto.css deleted file mode 100644 index c00338c..0000000 --- a/style/fonts/noto/noto.css +++ /dev/null @@ -1,8 +0,0 @@ -@font-face { - font-family: NotoSans; - font-weight: 900; - src: - local('Noto Sans Black'), - url(NotoSans-Black.ttf) format('ttf'); -} - diff --git a/style/id.css b/style/id.css deleted file mode 100644 index 10dad79..0000000 --- a/style/id.css +++ /dev/null @@ -1,49 +0,0 @@ -@import url(base.css); - -main { - max-width: 950px; - padding: 2em; - - background: - url(../media/quobl2.png) bottom left 5% / 30% no-repeat, - var(--default-bg); - background-blend-mode: multiply; -} - -footer { - margin-top: 6em; -} - - -.flags { - list-style: none; - padding: 0; -} - -.flags li { - display: inline-block; - padding: 0 .25em; -} - -.flags img { - height: 1.25em; - border: 2px solid oklch(37.28% 0.1488 17.16 / 80%); - transform: rotate(-3deg); -} - -dl { - grid-template-columns: repeat(2, auto); - row-gap: 1em; -} - -p { - margin: 0 0 .5em 0; -} - -.note { - font-size: 80%; -} - -ul { - margin: 0; -} diff --git a/style/index.css b/style/index.css deleted file mode 100644 index 7faba6f..0000000 --- a/style/index.css +++ /dev/null @@ -1,55 +0,0 @@ -@import url(base.css); - -:root { - width: 100vw; height: 100vh; - margin: 0; padding: 0; - display: grid; - align-items: center; - justify-content: center; -} - -main { - width: 35em; - padding: 2em; -} - - -#mlem { - margin: 36px auto -50px; - position: relative; - height: 219px; - width: 420px; - cursor-events: none; -} -.mlem-text { - font-size: 110%; - position: absolute; - font-weight: 700; - margin: 0; -} -.niss { bottom: 100%; left: 20px; } -.nisse { bottom: 85%; right: 0; } -#mlem img { image-rendering: pixelated; } - - -#links img { - margin-right: 0.75em; - height: 1.5em; - width: 1.5em; - filter: drop-shadow(0 0 10px var(--glow-col)); - vertical-align: middle; -} - -menu { - display: grid; - grid-template-columns: 1fr 1fr; - place-items: center; - place-content: center; - gap: 1em; - - max-width: 85%; - margin: auto; - font-size: 125%; -} - -menu li { list-style: none; } diff --git a/style/links.css b/style/links.css deleted file mode 100644 index a83759c..0000000 --- a/style/links.css +++ /dev/null @@ -1,76 +0,0 @@ -@import url(base.css); - -main { max-width: 900px; } - -footer { margin-top: 6em; } - -.buttons { - display: flex; - flex-flow: wrap row; - place-items: start; - place-content: center; - gap: 8px 10px; - - img { image-rendering: pixelated; } - - a { - width: 88px; height: 31px; - display: flex; - place-items: center; - place-content: center; - box-sizing: border-box; - } - - .txt { - font-size: 15px; - color: black; - text-shadow: none; - border: 4px outset currentcolor; - border-radius: 5px; - - &:active { - border-style: inset; - } - } - - + .buttons { - margin-top: 1.5em; - } -} - -#violet { background: #8c2bd8; color: #dddddd; } -#khr { background: #ffab71; color: #71153e; } -#dusty { background: #fbd265; color: #805c2d; } -#ionchy { background: #feca2f; color: #1b1505; } -#tenna { background: #6095da; color: #243224; } -#river { background: #98d8e7; color: #d67d28; } -#spiral { background: #ef4d5a; color: #1f1f1f; } -#codl { background: #87261f; color: #edb970; } - -/* -#peb { background: #ead6c3; color: #494040; } -#goaty { background: #564b8c; color: #ddffee; } -#gulfie { background: #3b4884; color: #f2cd0e; } -*/ - -.buttons { - figure { margin: 0; } - - figcaption { - margin: 0; - font-size: 70%; - } -} - - -.button-note { - margin: 0; - text-align: right; - align-self: center; - padding: 0 0.75em 0 0; -} -.btw { - display: block; - font-size: 70%; - font-style: italic; -} diff --git a/style/where.css b/style/where.css deleted file mode 100644 index b99354f..0000000 --- a/style/where.css +++ /dev/null @@ -1,50 +0,0 @@ -@import url(base.css); - -main { max-width: 1100px; } - -#headerpic { - position: relative; - width: min-content; - margin: auto; - - figcaption { - position: absolute; - bottom: 1.5em; - right: 2.5em; - font-style: italic; - } - - img { filter: drop-shadow(0 0 30px var(--glow-col)); } -} - -#contact { - grid-template-columns: repeat(2, auto auto); - row-gap: 0.5em; - width: 85%; - margin: auto; - - img { - vertical-align: middle; - height: 1.2em; width: 1.2em; - } -} - -.o { - filter: - drop-shadow(0.5px 0.5px black) - drop-shadow(-0.5px 0.5px black) - drop-shadow(-0.5px -0.5px black) - drop-shadow(0.5px -0.5px black); -} - -/* .other { padding-top: 0.5em; } */ -dt.other { - display: flex; - justify-content: end; - align-items: center; - gap: 5px; - grid-area: auto / 1 / auto / 2; -} -dd.other { - grid-area: auto / 2 / auto / 5; -} diff --git a/tsconfig.json b/tsconfig.json new file mode 100644 index 0000000..309f42d --- /dev/null +++ b/tsconfig.json @@ -0,0 +1,9 @@ +{ + "compilerOptions": { + "strict": true, + "noUncheckedIndexedAccess": true, + "noEmitOnError": true, + "lib": ["ES2021", "dom"], + "target": "ES2015" + } +} diff --git a/where.html b/where.html deleted file mode 100644 index 2c53e75..0000000 --- a/where.html +++ /dev/null @@ -1,68 +0,0 @@ - - - - - - - - - -where to find me - -
    -
    -

    where to find me

    - -
    - - kesi - -
    - art by - gray -
    -
    -
    - -
    - -
    -
    fedi -
    niss@chitter.xyz - -
    cohost -
    @niss - -
    bluesky -
    @niss.yummy.cricket - -
    matrix -
    g:cybre.space - -
    email -
    nissĀ atĀ niss.website - -
    pgp key -
    here - -
    xmpp -
    nissĀ atĀ yummy.cricket - -
    other -
    if weā€™re friends, then ask -
    - -
    - -
    -
    personal gallery
    here -
    itaku
    niss -
    weasyl
    niss - -
    deviantart
    2gecs -
    ko-fi
    nissss - -
    - - -