Skip to content
OverviewSolutions
44
Comments
4
Adam Alexander
@aja26

All comments

  • Adam Alexander•790
    @aja26Posted about 1 year ago

    hey great project!

    I noticed the form doesn't complete and i just wanted to point out something which helped me which was using regex patterns on as html attributes. Here is an example for number validation, pattern="[0-9\s]+$". Please see example below where I also show maxlength which is another type of simple validation you can use.

    <input id="card-number" pattern="[0-9\s]+$" type="text" maxlength="16" placeholder="e.g. 1234 5678 9123 0000">

    More Info: https://www.w3schools.com/tags/att_input_pattern.asp

    Marked as helpful
    0
  • Nivrii•410
    @nivriiSubmitted over 1 year ago

    I have to refresh the page when i change to a different resolution, and sometimes the javascript will ask for a valid email even when the email input checks out.

    Used grid, flex and DOM manipulation.

    1
    Adam Alexander•790
    @aja26Posted over 1 year ago

    Hey, Great attempt here.

    Have you looked into making it responsive? One thing you could look at is using media queries. Please find a guide below:

    https://www.w3schools.com/cssref/css3_pr_mediaquery.php

    It works based on the pixel width of the browser and you add css rules for smaller browser sizes.

    Marked as helpful
    0
  • Adam Alexander•790
    @aja26Posted over 2 years ago

    hey,

    Try making your QR code image have a width of 100% and remove the margin. Then remove the padding left on the .box and add one value for all your padding. See below.

    .box { background-color: #ffffff; border-radius: 15px; /* padding-left: 15px; / max-width: 345px; height: 570px; box-shadow: 0 14px 28px rgb(0 0 0 / 25%), 0 10px 10px rgb(0 0 0 / 22%); text-align: center; / display: flex; */ padding: 1rem; }

    img { width: 100%; /* margin-top: 15px; / / margin-right: 13px; / / margin-bottom: 10px; */ border-radius: 15px; }

    0
  • Adam Alexander•790
    @aja26Posted over 2 years ago

    hey, the number isn't saving when I click on a number, Have you looked at adding javascript?

    This is a great place to learn some basics if you have not got to javascript yet: https://www.w3schools.com/js/

    You should look into click events and how to save the outcome of your click in a variable so that the second card and show you what review score that user selected.

    Marked as helpful
    1