https://grantsform.github.io/ Recent content on GRANT'S FORM - Dilutions Of Grant'ur Hugo en-us Mon, 09 Mar 2026 00:00:00 +0000 https://grantsform.github.io/posts/2026-03-09-the-foreword-on-moving-forwards/ Mon, 09 Mar 2026 00:00:00 +0000 https://grantsform.github.io/posts/2026-03-09-the-foreword-on-moving-forwards/ &hellip; https://grantsform.github.io/tots/quick-tot/ Mon, 01 Jan 0001 00:00:00 +0000 https://grantsform.github.io/tots/quick-tot/ <div class="tot-thread-posts"> <div class="tot-post"> <div class="tot-post-body"> Hey, hi, howdy everybody! This is example of a <code>tot</code>. A Tot is my site&rsquo;s answer to a self-hosted microblog kind-of / kinda thing. lol I don&rsquo;t know if it&rsquo;s the right answer, but it&rsquo;s a gradient solution between a full-blown post and the misc thought / quirky posting and/or meme&rsquo;n I&rsquo;m apt to &ldquo;do on the timeline&rdquo;. This is more intended for / as progress over time that I plan to publically iterate on. <a href="https://grantsform.github.io/tots/?tag=intro" class="post-tag">#intro</a> </div> <div class="tot-refs"> <span class="muted">References:</span><a href="https://grantsform.github.io/tots/test-refs/#test-refs" class="tot-ref-link" title="Permalink to tot test-refs"><i class="fas fa-link"></i> test-refs</a> </div> <time class="tot-date" datetime="2026-03-09T10:00:00">Mar 9, 2026 · 10:00 AM</time> </div> <div class="tot-post"> <div class="tot-post-body"> test test test </div> <time class="tot-date" datetime="2026-03-09T10:00:00">Mar 9, 2026 · 10:00 AM</time> </div> </div> https://grantsform.github.io/tots/test-refs/ Mon, 01 Jan 0001 00:00:00 +0000 https://grantsform.github.io/tots/test-refs/ <div class="tot-thread-posts"> <div class="tot-post" id="test-refs"> <div class="tot-post-body"> Does this work? </div> <time class="tot-date" datetime="2026-03-09T10:00:00">Mar 9, 2026 · 10:00 AM</time> </div> </div> https://grantsform.github.io/about/ Mon, 01 Jan 0001 00:00:00 +0000 https://grantsform.github.io/about/ <style> .flip-indicator { font-size: 2rem; color: #ffd54f; margin-right: 1rem; margin-left: 0.5rem; transition: transform 0.3s cubic-bezier(.68,-0.55,.27,1.55); user-select: none; cursor: pointer; opacity: 0.85; } #profileSwap:hover .flip-indicator { transform: rotateY(180deg) scale(1.2); opacity: 1; } .profile-right { display: flex; flex-direction: row-reverse; align-items: center; justify-content: flex-end; width: 100%; gap: 2rem; } .profile-text { text-align: right; min-width: 220px; flex: 1; } #profileImg { margin-left: 2rem; margin-right: 0; float: right; box-shadow: 0 2px 12px rgba(0,0,0,0.12); } #profileDesc { padding-right: 3.5rem; } #profileName { font-size: 1.5rem; } /* Responsive styles for small screens */ @media (max-width: 576px) { .profile-right { flex-direction: column; align-items: center; gap: 1rem; } .profile-text { text-align: center; min-width: unset; width: 100%; } #profileImg { margin-left: 0; float: none; } #profileName { flex-direction: column; font-size: 1.25rem; } #profileNameText { text-align: center; } .flip-indicator { margin: 0.5rem 0 0 0; font-size: 1.5rem; } #profileDesc { padding-right: 0; text-align: center; } } </style> <h1 id="about">About</h1> <div class="profile-right mb-4" id="profileSwap" style="cursor:pointer;"> <img id="profileImg" src="https://grantsform.github.io/face-grantsform.webp" alt="Avatar" class="rounded shadow" style="width:128px;height:128px;object-fit:cover;transition:box-shadow 0.2s;"> <div class="profile-text"> <h2 class="mb-1 d-flex align-items-center justify-content-end" id="profileName"> <span id="profileNameText">GRANT'S FORM (@grantsform)</span> <span class="flip-indicator" id="flipIndicator" title="Click to flip profile">↻</span> </h2> <p class="lead mb-0" id="profileDesc"></p> https://grantsform.github.io/projects/ Mon, 01 Jan 0001 00:00:00 +0000 https://grantsform.github.io/projects/ <div class="card mb-3"> <div class="card-body"> <h1>Projects</h1> <p class="lead">Fleshing Out Soon</p> </div> </div>