mirror of
https://github.com/pupperpowell/bibdle.git
synced 2026-08-22 22:32:28 -04:00
Minor button cooldown change
This commit is contained in:
@@ -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 {
|
||||||
|
|||||||
Reference in New Issue
Block a user