Good visual on 375px and 1440px of width. I need to work on the responsive. I think about clamp() or something else. Any suggestion ? Thank you
Kamaradev
@KamaradevAll comments
- @Hitch95Submitted about 2 years ago@KamaradevPosted about 2 years ago
nice work so here are the some tips to help your get unstuck first you can have two script tags in your html if these to script tags are the referring to the same script and declaring your variables with const. for example in the head tag you have a script tag and in your body tag you also have the same script tag delete one of them preferably the one in the head tag second your input tag has two ids you can't have to ids in the same tag use classes instead here is an example i replace the id="email" with class="email"
this is your code
<input type="email" name="email" id="email" placeholder="Email Address" id="input-form" spellcheck="false" onkeyup="validateEmail()" /> <label for="email">
this is a rewrite
<input type="email" name="email" class="email" placeholder="Email Address" id="input-form" spellcheck="false" onkeyup="validateEmail()" /> <label for="email">
this is why theconst input = document.getElementById("input-form");
did get selected because it had to ids. hope everything is clear.0 - @StirattoSubmitted about 2 years ago
Hi! how's your day going?
This is my third project finished, i have a question:
How can I make it so that when I stop clicking the hover, the transitions fall slowly and not immediately? I didn't find anything about it on Google.
Also, any feedback its appreciated.
Goodbye! 👋
@KamaradevPosted about 2 years agothe design is nicely done the problem with the hover effect is that you should added the transition property before the hover for example: the transition propery should be in the .eye-image class and not the .eye-image:hover
.eye-image { background-color: hsla(178, 100%, 50%, 0.15); opacity: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-image: url(images/icon-view.svg); background-position: center; /* transition propery */ transition: 1000ms; transition-property: all; transition-duration: 1000ms; transition-timing-function: ease-in-out; transition-delay: 0s; }
.eye-image:hover { opacity: 1; cursor: pointer; }
Marked as helpful1 - @fruizoteroSubmitted about 2 years ago
Hi guys, I'm trying to do everything with units from the viewport and I see that so far it's adapting well. In this challenge what gave me problems was the part of the footer links where I wanted to force the flex wrap and I had to give a height with percentages to each element, in principle it looks good, but when the size of the viewport is reduced it looks a little bad, so any advice is welcome.
@KamaradevPosted about 2 years agonicely done if i have on suggestion is to use px or rem units in setting your font-size instead of vw because when the screen get resized the text becomes unreadable. clever use of the checkbox to toggle the tabmenu. over all it is nicely done.
0 - @eeffoCdecISubmitted about 2 years ago@KamaradevPosted about 2 years ago
nicely done, you way of writing code is very concise and easy to understand especially the javascript part
Marked as helpful1 - @Shubhankar-SenguptaSubmitted about 3 years ago
Need some feedback on this.
@KamaradevPosted about 3 years agonice work bro you could make a little adjustament on the responsive part and also I cannot click onto the next image but overall you did a amazing job sorry my english is a little off
Marked as helpful0 - @becomeBillionaireSubmitted about 3 years ago
i'm new . please feedback on my code, im not sure about my code.
@KamaradevPosted about 3 years agol very much like the way you organize your code it very easy to follow overall you did a nice job
Marked as helpful0