dhorn/Protocol-oral-history-project
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

minor styling updates

Browse Source
This commit is contained in:
Drew
2025-04-25 11:55:48 -06:00
parent b33c8f409f
commit 5290772bce
6 changed files with 34 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
layouts/partials/wompum-demo.html
View File

@ -3,10 +3,10 @@
<p>We use a protocol to generate the colorful wompum style grid for articles and other places around the site, learn how it works here.</p>
<div class="mb-8 font-iosevka">
<div class="mb-8">
<label class="block mb-2">Enter text to generate a grid:</label>
<input type="text"
class="w-full p-2 border rounded bg-sand-100"
class="w-full p-2 border rounded font-iosevka bg-sand-100"
placeholder="Type something..."
value="{{ .Site.Title}}"
oninput="updateWompumDemoGrid(this.value)">
@ -14,35 +14,35 @@
<p>First we generate a sigil by removing spaces, turning to lowercase, removing anything that isn't a consonant, removing repeat letters, find the unicode character number, and finally get the digital root of those numbers. From there the sigil digits are used to choose a color from our pallet.</p>
<div class="transformation-steps mb-8 font-iosevka">
<div>
<span class="font-bold">Original Text:</span>
<ol class="transformation-steps mb-8 font-iosevka pl-0 list-['↪']">
<li>
<span class="font-bold md:inline block">Original Text:</span>
<span class="text-input-display"></span>
</div>
<div>
<span class="font-bold">Lowercase:</span>
</li>
<li>
<span class="font-bold md:inline block">Lowercase:</span>
<span class="text-cleaned-display"></span>
</div>
<div>
<span class="font-bold">Consonants only:</span>
</li>
<li>
<span class="font-bold md:inline block">Consonants only:</span>
<span class="text-consonants-display"></span>
</div>
<div>
<span class="font-bold">Unique consonants:</span>
</li>
<li>
<span class="font-bold md:inline block">Unique consonants:</span>
<span class="text-unique-display"></span>
</div>
<div>
<span class="font-bold">Letters to numbers:</span>
</li>
<li>
<span class="font-bold md:inline block">Letters to numbers:</span>
<span class="text-sigil-numbers"></span>
</div>
<div>
<span class="font-bold">Digital root:</span>
</li>
<li>
<span class="font-bold md:inline block">Digital root:</span>
<span class="text-sigil-root"></span>
</div>
<div>
<span class="font-bold">The final grid:</span>
</div>
</div>
</li>
<li>
<span class="font-bold md:inline block">The final grid:</span>
</li>
</ol>
<div class="wompum-container wompum-container--demo h-48 mb-8">
<div class="wompum-grid h-full"