Minor button cooldown change

This commit is contained in:
George Powell
2026-07-07 17:06:12 -04:00
parent 21efdd4eef
commit 2fb484ebaa
+14 -20
View File
@@ -258,12 +258,11 @@
const days = Math.floor(diff / (1000 * 60 * 60 * 24)); const days = Math.floor(diff / (1000 * 60 * 60 * 24));
const hours = Math.floor((diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); const hours = Math.floor((diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60)); const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
const seconds = Math.floor((diff % (1000 * 60)) / 1000);
countdownText = countdownText =
(days > 0 ? `${days}d ` : "") + (days > 0 ? `${days}d ` : "") +
`${hours.toString().padStart(2, "0")}h ${minutes `${hours.toString().padStart(2, "0")}h ${minutes
.toString() .toString()
.padStart(2, "0")}m ${seconds.toString().padStart(2, "0")}s`; .padStart(2, "0")}m`;
} }
onMount(() => { onMount(() => {
@@ -401,19 +400,22 @@
</form> </form>
{/if} {/if}
{:else if onCooldown} {:else if onCooldown}
<!-- ── State 2: logged in, cooldown active — disabled + countdown ─── --> <!-- ── State 2: logged in, cooldown active — disabled + countdown on button ─── -->
<button <button
type="button" type="button"
class="progress-btn w-full progress-btn-disabled" class="progress-btn w-full progress-btn-disabled"
disabled disabled
aria-disabled="true" aria-disabled="true"
> >
<span>✨ Submit a verse</span> <!-- <span>✨ Submit a verse</span> -->
<span class="lock-icon" aria-hidden="true"></span>
</button>
{#if countdownText} {#if countdownText}
<p class="countdown-text">Next submission in {countdownText}</p> <span class="countdown-inline" aria-hidden="true"
>{countdownText}</span
>
{:else}
<span class="lock-icon" aria-hidden="true"></span>
{/if} {/if}
</button>
{:else} {:else}
<!-- ── State 3: logged in, can submit — selector + preview ────────── --> <!-- ── State 3: logged in, can submit — selector + preview ────────── -->
<button <button
@@ -644,20 +646,12 @@
font-size: 1rem; font-size: 1rem;
} }
.countdown-text { .countdown-inline {
padding-top: 12px; font-size: 0.85rem;
font-size: 0.8rem; font-weight: 700;
font-weight: 600;
color: #6b7280;
letter-spacing: 0.01em;
font-variant-numeric: tabular-nums; font-variant-numeric: tabular-nums;
text-align: center; letter-spacing: 0.01em;
width: 100%; opacity: 0.85;
}
@media (prefers-color-scheme: dark) {
.countdown-text {
color: #9ca3af;
}
} }
.signin-text { .signin-text {