added upvotes, like Bear Blog (and Reddit)

My interest in upvotes peaked while reading small cypress’ blog.

So, I went searching: “add upvote indieweb” using Startpage, IndieWeb’s BurgeonLab.com was listed top five. Naty S’ guide, specific for Hugo, “How to Add … Upvote/Like Button…” also goes into detail on the inner workings of iine, the privacy-conscious anonymous counter button.

I altered the JavaScript optional script, below, which works for any site. The original iine.mini.js script loads the page slug using window.location.pathname if no data-slug attribute is found.

<form action="https://vhiweeypifbwacashxjz.supabase.co/rest/v1/rpc/increment_hits?apikey=sb_publishable_EoB7MFJhCmb6PiAk-GPJ4w_PGhQ44Ru" method="post">
    <button type="submit" class="iine-button" aria-hidden="true" data-icon="upvote">
        <noscript>Upvote</noscript>
    </button>
</form>

Changing the page slug results in a reset of the total count, but changing the page-slug back, returns the previous upvote count.

The HTML elements (icon and counter) are dynamically created and styled to stack.

button.iine-button {
    display: block;
    text-align: center;
    background: transparent;
    border: 1px solid transparent;
    color: var(--font-color);
    margin: 0;
    padding: 0;
}
button.iine-button .icon{
    display: block;
}
button.iine-button .icon svg {
    display: block;
    height: 1.5rem;
    width: 1.7rem;
}
button.iine-button .counter {
    font-size: 0.833rem;
}

• added iine, a simple upvote button for appreciation with zero tracking