Transitions and Animations Chapter 13<p>
Donald Duck is the new president of the USA.
</p>
</article>
</div>The cards will have their unique touch, thanks to the following CSS rule:
.card {
position: relative;
background-color: FloralWhite;
width: 9em;
height: 9em;
margin: 0.5em;
padding: 0.5em;
font-family: sans-serif;
box-shadow: 0px 0px 10px 2px rgba(0,0,0,0.3);
}The JavaScript part will be a very simple Vue instance:
new Vue({
el: '#app',
data: {
showRecipe: false,
showNews: false
}
})Running this code will already display your web page: