Anki

{{FrontSide}}

<hr id=answer>

{{francuski}}
<hr>
<button id="dalej1"  style='display: block; margin: auto' onclick="firstClick()">Dalej</button>
<div id="odmiana1" style='display: none; width: 50%; float: left'>
    <p>je {{je}}</p>
    <p>tu {{tu}}</p>
    <p>il {{il}}</p>
</div>
<button id="dalej1,5" style='display:none; margin: auto' onclick="afterFirstClick()">Dalej</button>
<div id="odmiana2" style='display:none; width: 50%; float: left'>
    <p>nous {{nous}}</p>
    <p>vous {{vous}}</p>
    <p>ils {{ils}}</p>
</div>
<hr>
<button id="dalej2" style='display: none; margin: auto;' onclick="secondClick()">Dalej</button>
<div id="PC" style='display:none; font-family: Arial; font-size: 20px;'>{{passe compose}}</div>





<script>
const firstButton = document.getElementById('dalej1');
const odmiana1 = document.getElementById('odmiana1');
const afterFirstButton = document.getElementById('dalej1,5');
const odmiana2 = document.getElementById('odmiana2');
const secondButton = document.getElementById('dalej2');

function firstClick (){
firstButton.style.display = 'none';
odmiana1.style.display = 'block';
afterFirstButton.style.display = 'block';
}

function afterFirstClick (){
afterFirstButton.style.display = 'none';
odmiana2.style.display = 'block';
secondButton.style.display = 'block';
}

const PC = document.getElementById('PC');
function secondClick () {
    secondButton.style.display = 'none';
    PC.style.display = 'block'
}

</script>