Skip to content
OverviewSolutions
11
Comments
3
Gassai Hamza
@GHamza-Dev

All comments

  • Phil•185
    @PhilJGSubmitted about 3 years ago

    I had trouble in these three areas:

    When the button is pressed the valid or invalid notice will come up. However it will not change if the text is change unless the page is refreshed. It seems that the function can only be called once?

The blue border on the input box. Apparently when adjusted in :active or :focus states it does not change. How do I get rid of it?

I`m having trouble with github pages. Whenever the button is pressed it just takes to a 404 page. That does not help demonstrate the work I did. How do I adjust this?

    Base Apparel email form using match()

    2
    Gassai Hamza•290
    @GHamza-DevPosted about 3 years ago

    Hi Phil 👋

    First, keep it up!!! I really liked your solution.

    • For the first issue it happens because you grabbed the input value just once and what happened is the function called each time you click the button but it uses the old input value.

    To fix this problem you should grab the input value each time you want to make a check

    An appropriate solution would be like:

    //....
const email = document.getElementById("email"); 
// Notice that I selected the element and kept it (without getting the value from it).
//....
//......
//....
let inputValue = " ";  // simple declaration

function validation() {

        inputValue = email.value; // I get the value of the input each time I call the function

        if (inputValue.match(pattern))  // Or simply: if (email.value.match(pattern)) 
        {
            form.classList.add("valid");
            form.classList.remove("invalid");
            //.....
            //.......... the rest of your code

    Thus should work 100%!! and if you need more clarification do not hesitate to ask for it.

    Final tip: There is also a way of validating inputs using CSS you may want to learn about it If so search for validity pseudo-selectors (:valid & :invalid pseudo-selectors)

    HAPPY CODDING!!

    Marked as helpful
    0
  • Gassai Hamza•290
    @GHamza-DevPosted about 3 years ago

    Hi Robert Pandele👋

    I have some suggestions for you (I would really push myself to take into consideration the following suggestions)

    • Use h1,h2,h3... if needed instead of div or p (title,titel2,editorTitle...).
    • Use anchor tag a for links.
    • Use img tag for your logos with alt attribute (<img src="images/logo.svg" alt="blogr"/>).
    • Use ul element for lists (lists of links in the footer and dropdown menus).
    • For the humburder button should have a cursor pointer:
    .hamburger {
    ....
   cursor: pointer;
   ...
}

    Otherwise, you did a nice job!

    HAPPY CODDING!!

    0
  • jose•10
    @geminiidevSubmitted almost 4 years ago

    i do all i can, and i am happy with my skill for now.

    i have problem to posisionate de 'age' at the right, the problem is if the 'name' is too large, the 'name' is over of the 'age'.

    i try using margin-left and position relative. but, nothing.

    jose padrino's profile card component

    2
    Gassai Hamza•290
    @GHamza-DevPosted almost 4 years ago

    Hi, I'm not sure if my solution is practical ;) but I would suggest putting both profileCard_username & profileCard_userAge in one div and set display: inline; to theme

    0