@buneeIsSlo
Posted
Hey! @AminaArif0005, Great job on this challenge, Your site responds pretty well. Here are my suggestions:
- The reset button needs to inactive by default and should be activated once the user inputs values. you can use the "input" event listener to achieve this.
- You're missing the box-shadow. Use this
box-shadow: 0px 32px 43px rgba(79 166 175 / 20%);
.
That is all. Hope this helps :)
P.S. Why did you use a heading tag as the logo instead of the SVG? I'm curious.
Marked as helpful
@AminaArif0005
Posted
@buneeIsSlo totally missed the logo now I have seen it because you mentioned it and it would have been far much easier. As for using the heading someone in my previous challenge mentioned that there should be one h1 heading on a page of the website so I thought I should use h1 this way and by the way I have made the changes according to your suggestions.
@buneeIsSlo
Posted
@AminaArif0005 "totally missed the logo" Yup I've done this too XD. It looks like you've deleted the images folder hence the logo doesn't load, I'm sure you can fix that. Keep Coding!
@AminaArif0005
Posted
@buneeIsSlo thnx for mentioning I just added it back. happy coding to you too!.
@muhammadshajjar
Posted
@AminaArif0005 hello, I think I created a misconception in your mind by asked to use one h1
per page or you took it as a misconception by putting your logo into h1
xD. So here are some explanation about using it,
- Just remember that your
h1
s are used to indicate context, not layout. - Semantically, I prefer using one h1 on the page, mainly for the title of the page, so as for there is not any visible tittle of the page which you would apply
h1
, As I , WE know that this isA tip calculator App
but for those who are visually impaired, they can not see the screen, so how they will know this is aTip calculator app
?? .
here is the solution for it..
HTML
<h1 class=sr-only>Tip calculator app </h1>
CSS
.sr-only {
position:absolute;
left:-10000px;
top:auto;
width:1px;
height:1px;
overflow:hidden;
}
This link would help you Invisible Content Just for Screen Reader Users
Hope it would helps you :)
Marked as helpful