The last lesson we applied, styling and with styling, it really makes it look.
Bring it to life.
Bring what we're doing to life.
So we do want to be able to hide the first card for the dealer to make the game a little bit more interesting
because we don't want the dealer's cards to be visible.
So we're creating another card B class, and this is going to be the one where it's the hidden part.
So in this case, let's position and absolute and we're going to essentially be putting a cover on top
of the card.
So we're we want to position it so top.
And third team picks.
And to the left of nine picks and a lot of this, the rest of the parameters are gonna be the same.
I do a background color of the blue.
You can keep the border radius.
We can.
Keep that border color for what?
And but let's see how this looks.
So going into the script, we're going to check to see if that boolean value or if doing the show card
and passing it there, that's hidden or not within the take card.
And we're going to do the construction to see if we need to hide it.
And if we don't hide it, then we can show it.
So that h h.
Depending on whatever the boolean value is, we're gonna play a cover on top.
So do true for the first one.
And the condition is gonna be if h then we're going to add into the game card back and using document
create elements and adding in to create a div.
This one's gonna float on top.
And game card back.
Class list add.
And the class that we're adding is gonna be card B and then taking the elements and appending that new
car game card back element that we constructed.
So see what happens.
So we do a deal.
We need to make a few tweaks and adjustments.
That's not quite right.
We've got to move it up.
So position of card, be it actually with us.
Should work for being able to cover any of the cards so it doesn't look like we need to have the border.
So let's adjust the top position.
So bring it down to 63 and we don't need the border either.
So you get rid of that and maybe it's 64.
So until it's covered and once it's covered, then that's fine.
That's all we need.
We just need to make sure that it is covered.
You might have to make some adjustments depending on if you shift other things around on the page,
depending on the content that we have here.
So there might be some additional tweaks, adjustments we need to be able to make to it.
But in this case, we do see that it's showing or hiding the card.
So that's what we initially wanted.
And there's also one other thing that I want to add in before we complete with the take card function.
And this is actually the ideal spot to check to see if the game deck because rubber, we're taking away
the cards from the game deck and we can check to see if the length of that is equal to zero.
And if it is, then we just run build deck one more time and it'll create a brand new deck of cards.
So essentially, we're never gonna run out of cards for the gameplay.
So let's save this and try the deal.
Just make sure it's working and we're ready to move on to the next lesson where we can take some more
advanced functionality of the gameplay.
And that's coming up next.
So go ahead and set up your game area to be functioning the same way where you've got the cards, you're
displaying the cards.
The first card is hidden and it's showing the other cards.
And we're gonna do some calculations allowing the buttons to either hit and stand.
So that's all coming up in upcoming lessons.