mirror of
https://github.com/aquatix/alfagok.git
synced 2025-12-06 19:55:12 +01:00
Do not blip uninitialised content on load
This commit is contained in:
@@ -7,6 +7,8 @@ body {
|
||||
padding: 2rem 1rem;
|
||||
}
|
||||
|
||||
[x-cloak] { display: none !important; }
|
||||
|
||||
a.title {
|
||||
color: #FF9800;
|
||||
font-weight: bold;
|
||||
|
||||
@@ -20,7 +20,7 @@
|
||||
|
||||
<center>
|
||||
|
||||
<p class="guessesheading" x-show="$store.alfagok.guessesBefore.length">Het woord van de dag komt <em>na</em>:</p>
|
||||
<p class="guessesheading" x-cloak x-show="$store.alfagok.guessesBefore.length">Het woord van de dag komt <em>na</em>:</p>
|
||||
<ul class="guessesbefore">
|
||||
<template x-for="item in $store.alfagok.guessesBefore" :key="item">
|
||||
<li x-text="item"></li>
|
||||
@@ -31,10 +31,10 @@
|
||||
<input type="text" autocomplete="new-password" autocorrect="off" x-model="$store.alfagok.guessValue" @keyup.enter="$store.alfagok.doGuess()">
|
||||
{# <p x-cloak>Je huidige gok is: <span x-text="$store.alfagok.guessValue"></span></p>#}
|
||||
<button @click="$store.alfagok.doGuess()">Doe een gok</button>
|
||||
<p class="error" x-show="$store.alfagok.guessError" x-text="$store.alfagok.guessError"></p>
|
||||
<p class="error" x-cloak x-show="$store.alfagok.guessError" x-text="$store.alfagok.guessError"></p>
|
||||
</div>
|
||||
|
||||
<div x-show="$store.alfagok.winTime" class="win">
|
||||
<div x-cloak x-show="$store.alfagok.winTime" class="win">
|
||||
<h3><b>Je hebt hem! 🎉</b></h3>
|
||||
<p>Het woord van vandaag was <b x-text="$store.alfagok.guessValue"></b>.</p>
|
||||
<div id="stats">
|
||||
@@ -51,14 +51,13 @@
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<p class="guessesheading" x-show="$store.alfagok.guessesAfter.length">Het woord van de dag komt <em>voor</em>:</p>
|
||||
<p class="guessesheading" x-cloak x-show="$store.alfagok.guessesAfter.length">Het woord van de dag komt <em>voor</em>:</p>
|
||||
<ul class="guessesafter">
|
||||
<template x-for="item in $store.alfagok.guessesAfter" :key="item">
|
||||
<li x-text="item"></li>
|
||||
</template>
|
||||
</ul>
|
||||
|
||||
|
||||
</center>
|
||||
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user