From c5a6b90d7e58daae698b9f41b6ed23a9ac317230 Mon Sep 17 00:00:00 2001 From: dangrubbb Date: Sun, 21 Sep 2025 08:32:48 -0400 Subject: [PATCH] Changed Blog Location --- blog/Index.html | 255 ++++++++++++++++++++++++++++++++++++++++++++++++ blog/style.css | 211 +++++++++++++++++++++++++++++++++++++++ index.html | 4 +- 3 files changed, 468 insertions(+), 2 deletions(-) create mode 100644 blog/Index.html create mode 100644 blog/style.css diff --git a/blog/Index.html b/blog/Index.html new file mode 100644 index 0000000..b2b4a5f --- /dev/null +++ b/blog/Index.html @@ -0,0 +1,255 @@ + + + + + + dangrubb.net + + + + + + + + +
+
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+ +
+
+ +

+ dangrubb.net +

+

+ ai + blog + media + storage + cv + git

+
+
+
+ + + + + diff --git a/blog/style.css b/blog/style.css new file mode 100644 index 0000000..4568147 --- /dev/null +++ b/blog/style.css @@ -0,0 +1,211 @@ +body { + background: #0d0a14; + padding: 40px 20px; + font-family: ui-monospace, "Cascadia Code", "Source Code Pro", Menlo, Consolas, "DejaVu Sans Mono", monospace; + color: #9d9aa4; +} + +.bard { + margin: 0 auto 40px; + /* Remove fixed width in pixels */ + width: 100%; + max-width: 65em; /* Keep the same max size for desktop */ + height: auto; + aspect-ratio: 1 / 0.95; /* Maintains the proportion of the artwork */ + font-size: 2px; +} + +/* Adjust media queries for better scaling */ +@media (max-width: 768px) { + body { + padding: 20px 10px; /* Smaller padding on mobile */ + } + + .bard { + font-size: 3px; /* Slightly larger base size for small screens */ + } + + p { + font-size: 0.8rem; + max-width: 320px; + } +} + +/* For very small screens */ +@media (max-width: 400px) { + .bard { + aspect-ratio: 1 / 1; /* Slightly different ratio for tiny screens */ + } + + p { + font-size: 0.75rem; + } +} + +.bard img { + width: 100%; + height: auto; + position: absolute; + left: 0; + top: 0; +} + +.strip { + overflow: hidden; + position: relative; + animation-iteration-count: infinite; + animation-direction: alternate; + animation-timing-function: linear; + image-rendering: pixelated; + image-rendering: -moz-crisp-edges; + image-rendering: crisp-edges; + background-size: 100% auto; + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAbwAAAG8CAYAAAClsBDfAAABMmVYSWZJSSoACAAAAAwACwACAA4AAACeAAAAAAEEAAEAAAC8AQAAAQEEAAEAAAC8AQAAAgEDAAMAAACsAAAAEgEDAAEAAAABAAAAGgEFAAEAAACyAAAAGwEFAAEAAAC6AAAAKAEDAAEAAAACAAAAMQECAA0AAADCAAAAMgECABQAAADQAAAAEwIDAAEAAAABAAAAaYcEAAEAAADkAAAAAAAAAGdUaHVtYiAzLjEyLjQACAAIAAgALAEAAAEAAAAsAQAAAQAAAEdJTVAgMi4xMC4zOAAAMjAyNDoxMToyNSAxOToyOTo1OQAGAACQBwAEAAAAMDIyMQGRBwAEAAAAAQIDAACgBwAEAAAAMDEwMAGgAwABAAAAAQAAAAKgBAABAAAAvAEAAAOgBAABAAAAvAEAAAAAAADMGVjUAAABg2lDQ1BJQ0MgcHJvZmlsZQAAeJx9kT1Iw0AcxV9TpaIVBztIUchQO9lFRRxrFYpQIdQKrTqYXPoFTRqSFBdHwbXg4Mdi1cHFWVcHV0EQ/ABxdnBSdJES/5cWWsR4cNyPd/ced+8AoVFhmtUTBzTdNtPJhJjNrYqBVwwgDGAMUZlZxpwkpeA5vu7h4+tdjGd5n/tzDKp5iwE+kTjODNMm3iCe2bQNzvvEIVaSVeJz4gmTLkj8yHWlxW+ciy4LPDNkZtLzxCFisdjFShezkqkRTxNHVE2nfCHbYpXzFmetUmPte/IXBvP6yjLXaY4iiUUsQYIIBTWUUYGNGK06KRbStJ/w8Iddv0QuhVxlMHIsoAoNsusH/4Pf3VqFqclWUjAB9L44zsc4ENgFmnXH+T52nOYJ4H8GrvSOv9oAZj9Jr3e0yBEwtA1cXHc0ZQ+43AFGngzZlF3JT1MoFID3M/qmHDB8C/SvtXpr7+P0AchQV6kb4OAQiBYpe93j3X3dvf17pt3fD6GhcrmeKfbWAAAOW2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4KPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNC40LjAtRXhpdjIiPgogPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4KICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iCiAgICB4bWxuczpzdEV2dD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlRXZlbnQjIgogICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICAgeG1sbnM6R0lNUD0iaHR0cDovL3d3dy5naW1wLm9yZy94bXAvIgogICAgeG1sbnM6dGlmZj0iaHR0cDovL25zLmFkb2JlLmNvbS90aWZmLzEuMC8iCiAgICB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iCiAgIHhtcE1NOkRvY3VtZW50SUQ9ImdpbXA6ZG9jaWQ6Z2ltcDplMTdhZmQ4Ni1iYzkzLTQzMzYtOGY0NS1iNGQ4MjY0YzIzZWUiCiAgIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6YjVhYzNjYWYtZjAwNS00OGFmLWIxODMtYmNhOWJkZDE4YzFkIgogICB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6YmE1Yzk1NzUtYjRjOC00OGRjLTg5NzctZDMxMzZmODFjMmJlIgogICBkYzpGb3JtYXQ9ImltYWdlL3BuZyIKICAgR0lNUDpBUEk9IjIuMCIKICAgR0lNUDpQbGF0Zm9ybT0iTGludXgiCiAgIEdJTVA6VGltZVN0YW1wPSIxNzMyNTgxMDAwNzYyOTU0IgogICBHSU1QOlZlcnNpb249IjIuMTAuMzgiCiAgIHRpZmY6T3JpZW50YXRpb249IjEiCiAgIHhtcDpDcmVhdG9yVG9vbD0iR0lNUCAyLjEwIgogICB4bXA6TWV0YWRhdGFEYXRlPSIyMDI0OjExOjI1VDE5OjI5OjU5LTA1OjAwIgogICB4bXA6TW9kaWZ5RGF0ZT0iMjAyNDoxMToyNVQxOToyOTo1OS0wNTowMCI+CiAgIDx4bXBNTTpIaXN0b3J5PgogICAgPHJkZjpTZXE+CiAgICAgPHJkZjpsaQogICAgICBzdEV2dDphY3Rpb249InNhdmVkIgogICAgICBzdEV2dDpjaGFuZ2VkPSIvIgogICAgICBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOmFjNmM3MmFkLTFlMGMtNDY1MC1iMTE5LTE0YWRmNmFhMzZiOSIKICAgICAgc3RFdnQ6c29mdHdhcmVBZ2VudD0iR2ltcCAyLjEwIChMaW51eCkiCiAgICAgIHN0RXZ0OndoZW49IjIwMjMtMTItMTZUMTQ6Mjk6MzYtMDU6MDAiLz4KICAgICA8cmRmOmxpCiAgICAgIHN0RXZ0OmFjdGlvbj0ic2F2ZWQiCiAgICAgIHN0RXZ0OmNoYW5nZWQ9Ii8iCiAgICAgIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6Zjc2ZmJmODMtZjQ2OS00MWU2LWJlN2MtODg5ZDk0OGQzMjI3IgogICAgICBzdEV2dDpzb2Z0d2FyZUFnZW50PSJHaW1wIDIuMTAgKExpbnV4KSIKICAgICAgc3RFdnQ6d2hlbj0iMjAyNC0xMS0yNVQxOTozMDowMC0wNTowMCIvPgogICAgPC9yZGY6U2VxPgogICA8L3htcE1NOkhpc3Rvcnk+CiAgPC9yZGY6RGVzY3JpcHRpb24+CiA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIAogICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgCiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAKICAgICAgICAgICAgICAgICAgICAgICAgICAgCjw/eHBhY2tldCBlbmQ9InciPz7dK7T4AAAABmJLR0QAGgChAFhuGdrNAAAACXBIWXMAAC4jAAAuIwF4pT92AAAAB3RJTUUH6AsaAB4AqvaKegAAColJ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); +} + +@keyframes glitch-5 { + 0.00%, 33.33%, 43.33%, 66.67%, 76.67%, 100.00% { + transform: none; + filter: hue-rotate(0) drop-shadow(0 0 0 transparent); + } + 33.43%, 43.23% { + transform: translateX(var(--glitch-x-1)); + filter: hue-rotate(var(--glitch-hue-1)) drop-shadow(0px -4px 0 rgba(0, 0, 255, 0.1)); + } + 66.77%, 76.57% { + transform: translateX(var(--glitch-x-2)); + filter: hue-rotate(var(--glitch-hue-2)) drop-shadow(-1px 0px 0 rgba(255, 0, 0, 0.1)); + } +} +@keyframes glitch-6 { + 0.00%, 33.33%, 41.67%, 66.67%, 75.00%, 100.00% { + transform: none; + filter: hue-rotate(0) drop-shadow(0 0 0 transparent); + } + 33.43%, 41.57% { + transform: translateX(var(--glitch-x-1)); + filter: hue-rotate(var(--glitch-hue-1)) drop-shadow(-2px 3px 0 rgba(255, 0, 0, 0.1)); + } + 66.77%, 74.90% { + transform: translateX(var(--glitch-x-2)); + filter: hue-rotate(var(--glitch-hue-2)) drop-shadow(-3px -2px 0 rgba(0, 0, 255, 0.1)); + } +} +@keyframes glitch-7 { + 0.00%, 33.33%, 40.48%, 66.67%, 73.81%, 100.00% { + transform: none; + filter: hue-rotate(0) drop-shadow(0 0 0 transparent); + } + 33.43%, 40.38% { + transform: translateX(var(--glitch-x-1)); + filter: hue-rotate(var(--glitch-hue-1)) drop-shadow(0px -3px 0 rgba(0, 0, 255, 0.1)); + } + 66.77%, 73.71% { + transform: translateX(var(--glitch-x-2)); + filter: hue-rotate(var(--glitch-hue-2)) drop-shadow(4px 1px 0 rgba(255, 0, 0, 0.1)); + } +} +@keyframes glitch-8 { + 0.00%, 33.33%, 39.58%, 66.67%, 72.92%, 100.00% { + transform: none; + filter: hue-rotate(0) drop-shadow(0 0 0 transparent); + } + 33.43%, 39.48% { + transform: translateX(var(--glitch-x-1)); + filter: hue-rotate(var(--glitch-hue-1)) drop-shadow(-1px -1px 0 rgba(0, 0, 255, 0.1)); + } + 66.77%, 72.82% { + transform: translateX(var(--glitch-x-2)); + filter: hue-rotate(var(--glitch-hue-2)) drop-shadow(3px -1px 0 rgba(0, 0, 255, 0.1)); + } +} +@keyframes glitch-9 { + 0.00%, 33.33%, 38.89%, 66.67%, 72.22%, 100.00% { + transform: none; + filter: hue-rotate(0) drop-shadow(0 0 0 transparent); + } + 33.43%, 38.79% { + transform: translateX(var(--glitch-x-1)); + filter: hue-rotate(var(--glitch-hue-1)) drop-shadow(1px -3px 0 rgba(255, 0, 0, 0.1)); + } + 66.77%, 72.12% { + transform: translateX(var(--glitch-x-2)); + filter: hue-rotate(var(--glitch-hue-2)) drop-shadow(1px 1px 0 rgba(255, 0, 0, 0.1)); + } +} +@keyframes glitch-10 { + 0.00%, 33.33%, 38.33%, 66.67%, 71.67%, 100.00% { + transform: none; + filter: hue-rotate(0) drop-shadow(0 0 0 transparent); + } + 33.43%, 38.23% { + transform: translateX(var(--glitch-x-1)); + filter: hue-rotate(var(--glitch-hue-1)) drop-shadow(3px -1px 0 rgba(255, 0, 0, 0.1)); + } + 66.77%, 71.57% { + transform: translateX(var(--glitch-x-2)); + filter: hue-rotate(var(--glitch-hue-2)) drop-shadow(-3px 2px 0 rgba(255, 0, 0, 0.1)); + } +} +p { + margin: 20px auto 0; + position: relative; + max-width: 400px; + text-align: center; + line-height: 1.3; + font-size: 0.875rem; +} + +a { + color: #6be1e9; +} + +a:focus, +a:hover, +a:visited { + opacity: 0.8; +} + +a:focus-visible { + outline: 2px solid currentColor; + outline-offset: 2px; +} + +.debug { + margin: 40px auto 0; + position: relative; + max-width: 800px; + display: flex; + flex-direction: column; + align-items: center; + max-width: 100%; +} + +.code { + margin: 10px auto 0; +} +@media (min-width: 600px) { + .code { + display: flex; + gap: 32px; + justify-content: center; + align-items: flex-start; + } +} + +.heading { + margin: 0 0 10px; + font-size: 1.5rem; + font-weight: bold; +} + +.column { + border: 1px solid rgba(255, 255, 255, 0.1); + padding: 10px; + border-radius: 4px; + color: #e8c57d; +} + +.column + .column { + color: #aa95bd; +} \ No newline at end of file diff --git a/index.html b/index.html index e6e0eef..4a20e2e 100644 --- a/index.html +++ b/index.html @@ -240,7 +240,7 @@

ai - blog + blog media storage cv @@ -252,4 +252,4 @@ - + \ No newline at end of file