So now what we need to do is that we need to display the, the orders here below the below the account
info on the belong they change password.
So what I'm going to do is that in the cart, we already have a code that we can use.
So instead of anything because from scratch, what I'm going to do is that I'm going to close this cart
and then I'm going to copy the cart.
And then in the account I'm going to close this account, and then below it I'm going to copy.
I'm going to basically cart.
So let me base it on.
Let me close it and then let me show you what I'm going to change.
First, I'm going to say your orders.
And instead of instead of displaying instead of saying your cart, I'm going to say orders.
And we need to change many things.
First of all, I'm going to remove your this column.
I'm going to only display two columns.
The first column is going to say product, and the second column is just going to display date.
Date.
And here I'm going to say your orders.
And we don't need all of these things.
Instead, we just need a linear removal of all these.
Starting from here, I'm just going to keep this TV empty, and I'm going to keep another TV empty.
So I don't want to confuse you, Lainey, here at another tree.
So we need to tease the first tree in the first tree.
I'm going to say you're dense.
Dense, and then I'm going to display the image.
So I'm going to first give it a class.
I'm going to say class, and then I'm going to say product info.
And inside it, I'm going to play the image and we say IMG and then source assets.
Images featured one.
And below the image.
I'm going to also display here B with a glass margin top three, and I'm going to display the name of
the product side.
And this is for the first CD.
The second tree.
I'm just going to play the beat, so I'm going to sing it here.
Span.
On any date you want.
They became a flaming hit and over to the browser and show you how this would look like.
So we have your orders and we have the image and we have the date.
However, we need to work on the design.
So let me go back and let me get in over to the cart, to the CCS.
I think this he says, I'm going to create a new section here.
I'm going to add a new comment and I'm going to say orders.
And here the first thing that we need to add for the orders is that we need to work on the orders itself,
on the orders ID that we created.
So I'm going to sit here, got orders.
Not.
Borders.
And then table we have the order table for the table I'm going to see with 100%.
And then the border border collapse.
Collapse.
Lot of clubs.
Then we want to use this order.
Order.
And then we need to say product info.
So for the product info, we need to change the display to be flex, display, flex and the wrap.
Let's wrap.
Let's wrap our wrap.
So this is going to fix the image and then we need to say orders or there's the edge, so forth at the
edge.
I'm going to first change the text align.
Text, a line left and the padding reporting is going to be five.
Top and bottom and in left and right.
And for the color, the color is going to be white.
Color white.
And the background color is orange.
Background color orange.
Let me show you how this would look like.
So now in the browser, let me refresh.
And as you can see, this is the bar.
It's the color is white and the background is orange.
Our next.
We want to say that orders, orders so far for the orders TV.
I want to change the batting order planning.
So the planning is going to be ten weeks top and bottom and 20 left and right.
For the inputs.
Or the inputs we hear.
Let me check the cart.
We don't have any input, so we remove the inputs so there is no need for the input.
Next, we need to fix the image.
So the image to fix the image.
We need to say that order orders to the image.
So for the image, we need to specify a specific area, a width and height.
So the width 80 x.
And hide also.
And margin will write margin.
Right.
Twin Peaks.
Let me see even let me show you how this looks like.
So as you can see, this is this is the account.
So we have well, we need to remove actually many things.
We need to remove this subtotal and we need to remove these two.
So before I continue me here, remove.
Here.
I need to remove this subtotal.
So for this subtotal, remember, we have this table.
We need to remove this table, and we need to it.
We need to remove the checkout button and we need to remove this.
The R.
And we need to remove also this tr.
And we need to be left only with the one tr.
Let me save a lady.
Show you that now we will have only one product.
So now it looks amazing.
The last thing that we need to work on is the, uh, is the here.
We need to center this order.
We need to center it.
So to center it, we can here for, say, for the first, I'm going to make less margin.
It makes order.
And also the text here, we need to say text.
A lion takes centre.
This should centre the text.
So the text has been centered here.
It says your orders and we have the orders and everything now looks amazing.
We just need to decrease the space.
So to decrease this space, I'm going to here change this from five to only two, and this should decrease
the space.
So as you can see, the space now is smaller, but I think we need to decrease the space further.
Actually, I need to decrease this and keep this.
Fine.
Let me keep this five and let me decrease the crease only the margin top.
So if I decrease the margins up.
The margin top will be much smaller.
Smaller, and we can, we can decrease the, uh, the Y here.
We can say py3.
This will also have an effect on the space here.
So as you can see, the space is smaller and this date we can push it to the right more so in the stylus.
SS So here you can see takes the line center.
Or a line left, let's say center.
If I say center.
All right.
Actually, instead of left, we can say, right.
So I'm going to remove the left and then I'm going to say center and instead of left.
Now.
It should.
This should be displayed on the in the middle.
As you can see, it looks now better here.
It's in the middle or you can say on the right side and you can apply it only to one element.
So instead of applying to applying it to, to, to the two elements, we can see, we can see left.
But to the second, we can see that order.
And then in Child the Age.
A child.
And Child two and then text.
Takes a lion.
Right now, it should fix this problem.
So as you can see now, the products should be displayed on their far left side, whereas it will be
displayed on the far right side.
And now it looks amazing.
So this is the account page where it has now three important elements the account information, the
change password functionality and the orders that the user made earlier.