Well, next, what we'll do is we'll design it in a responsible way so that whenever we open our website
on a smaller version of the screen for look good.
So after the button styling, what we'll do is provide some mediocrities.
Now, if you don't know mediocrities, what it does is that adjusts your cso's according to the maximum
weight of the screen or minimum width of the screen.
So you need to just provide a screen to resolution.
And according to that, the CCI's is applied to media and an.
Being and and that will be a mix with.
Like, this is the maximum with this success would be applied after this magazine with if the resolution
increases, then the CSIS will be disciplined.
So that is the whole irony of this mediocrity.
So ill 576 pixels is like, what is the like mobile of you?
Go after that, it's really going to be responsible.
So this will impact the container of cost, though, and the container H3, because that is so like
big.
So that's why we just to the font size is going to be decreased to one RTM.
And also, we'll give this to our input because I didn't put needs to also be a lion, according to.
According to our.
Not a solution, so then we need to go to a button, so to the bottom, what will give is that we'll
give off one side of like a smaller foreign side will give maybe point it fi.
IDM, something like that, then we'll save it.
This will not give any impact.
As of now, because whenever we string are fired, so then it will give or you can see, Oh, I like
that.
I can't it.
Me, I can do this.
Not from here, give me that are some still bugs which we need to fix.
Okay, now we need to give an an underclass.
Now what I discussed with you is that whenever user types.
Now will add CSI to the like, what happens when that is an adult and that is an invalid entry.
Before that, I'll add another order after the media queries, after the music is anchored to inside
this, I will add.
Good input only what input?
And now I'll tell you, what is this dog that will do that because we will give a class name to the
input named as at whenever there will be a wrong and to know, how do we detect that it is wrong and
believe that I will just tell you in a minute?
So this is what we are going to do.
So our.
The Earth may be dark, but yeah, so this is the class which will be responsible for showing that.
No, let me just tell you how to get better.
First of all, we need to create a state.
OK, I think you OK.
OK, OK, I'm sorry.
I think the screen was stuck.
OK, I'll repeat it once again.
So this is this is the things which are Typekit only this one line.
I'm tired so far.
So OK.
And that also made a typo, so I will have corrected or input data.
And this is the thing.
It is responsible for showing the right like border to land bulwarks if there is a wrong entry or exit.
And now we need to give it.
We need to create a constant well, that constant will be better and then we'll have a set and a hard
and.
Who will said this at A.
They used it, and initially it will be false.
False.
And I forgot and wanted to hear.
But initially, it'll be false.
Now what I need to do is I need to give a class to this important.
If that is in Iran, so that should be a change of glass and that glass should be like the gospel changes
color to red.
So how we do that?
Well, first of all, I type class name here.
Last name and there would be JavaScript inside.
So here what I do is that.
I'll provide this, and I'll.
And inside this, if that is an error.
If that is an error.
Question mark.
So the class will be set to add a quota.
And if that is no error, so that means colon or semicolon colon, then it will be none.
As simple as that sounds fair enough.
No, no, not I'm not.
Then it will be none.
No.
Let me just save it to right now the class is set to follow.
So let us go back to the browser and see there is nothing wrong here.
But when I tune this to falsify change, I thought if I change to prove or what will happen?
Let me just go to.
That is no color change.
Why is not changing color?
Class name, error excuse that our it will set to error, OK, because I have not seen this.
But I need to save it.
Now, let me go here, and you can see the border is changed to right and let me just send you to.
False.
And let me say a word.
And now you can see Blue Bluish.
So this is how it'll work, but right now we are not like confirming that the text is valid or not valid,
so that will do.
For all we have done with this.
Who know what we'll do is that we are done with, uh.
Now, let's add up on some meat, like whenever we submit the form, we type everything in this form,
right?
And we try to submit this to what will happen.
Before that, we'll add a glass or glass, or they will add a function to it that will be called on
summit.
So on.
Mick, in add a function here, so we'll call it handle summit.
But right now we are not asking you to be liquidated.
Now I'm just writing it.
I'm just calling it.
I'm not.
I have not yet defined or created this function.
Included on Summit and Ultimate.
No, let's go ahead and create the handle summit.
So that will be gone and the government and it will be a further function.
And the first thing which we take care of when we are creating a form is that whenever we submit a form,
so the natural tendency is that a page reloads whenever we submit a form, the page rules.
We want to prevent that page from reloading.
So for that, you all you guys know.
And if you don't know, let me just show you that how we can stop the page from reloading by default.
So we'll provide this e we'll pass e as an argument here in this function, and we are also using this
E.
E nothing but event.
I can alterative into event dart targetable that same thing.
E Dart.
The event be by.
And this is a function to what it does is that like let me just comment, OK?
And let me just say it and go back to your browser.
Now when I click this form, you know, when I try to click it, there is my closer to the page reloads.
The page tends to reload.
But when I go through this and I am the command line and when I now go to the browser.
And and I.
And clicking this part, there is no reload.
Of course, the whatever the action needs to be done, it will be done by turning.
The page will not reload.
So that is what we armed because if the page loads, all the data will be lost and there will be a malfunction
and it needs to.
We don't want that.
That's why we have implemented this feature.