Skip to content
OverviewSolutions
45
Comments
5
Peter Jonathan-Hart
@PeeroDemba

All comments

  • Peter Jonathan-Hart•800
    @PeeroDembaPosted about 1 year ago

    Many bugs found

    The error messages are not properly displaying when they should

    Marked as helpful
    0
  • ezecoder•870
    @3eze3Submitted over 1 year ago

    Hello community, in this challenge I wanted to get out a little of the established design, but without changing it completely, so I chose to put some interactivity and change the colors that I found a little boring. I also made the decision to put the json data directly in my javascript file, since it is static data, so it will be more flexible to work this way.

    Please if you have any questions, or improvements for my code, design, accessibility, or whatever you can let me know in the comments. Happy coding🍔

    Chart Component (JSON , JS, SCSS)🥨🥚

    1
    Peter Jonathan-Hart•800
    @PeeroDembaPosted over 1 year ago

    Hey Bro, can i get your Twitter username?

    0
  • Peter Jonathan-Hart•800
    @PeeroDembaPosted almost 2 years ago

    Was this how you put the numbers inside the radio button?

                input[type=radio]+label:nth-of-type(1)::before{
                content: "1";
                
            }

            input[type=radio]+label:nth-of-type(2)::before{
                content: "2";
            }

            input[type=radio]+label:nth-of-type(3)::before{
                content: "3";
            }

            input[type=radio]+label:nth-of-type(4)::before{
                content: "4";
            }

            input[type=radio]+label:nth-of-type(5)::before{
                content: "5";
            }
    0
  • Peter Jonathan-Hart•800
    @PeeroDembaPosted almost 2 years ago

    Make the entire QR container relative to the body Let the div with the class container cover the entire QR section Then edit the width and heights in these selectors

    body{position: relative; width: 100vw; height: 100vh} .container{position: absolute; width: 25%; height: 70%} N/B: Toggle the width and height in the container class div tag as appropriate

    Marked as helpful
    0
  • VinnyPC•40
    @VinnyPCSubmitted almost 2 years ago

    I confess that despite this project being relatively basic, I had some difficulties.

    In the beginning, setting up the interface was quite easy. The problem started when I went to design the desktop. It was working on desktop but not on mobile and vice versa. After a lot of thinking I managed to solve it by replacing max-width with min-whidth in @media queries.

    I'm sure my code got unnecessarily long and complex, with lots of repeated lines. Also, I couldn't properly style the button on the desktop layout. Probably because I used a wrong positioning.

    Although I managed to make the project visibly similar to the design, I'm pretty disappointed in myself, I thought I could do better than that.

    Product preview card component using CSS and HTML

    1
    Peter Jonathan-Hart•800
    @PeeroDembaPosted almost 2 years ago

    Hey Bro...Try positioning the body tag relative to the container

    In other words,

    body{ position - relative;} .container {position absolute;}

    Put the entire image into the container and try restyling it....Cheers

    And you do not need max and min widths to solve it.

    Do this instead,

    body{ position - relative; width: 100vw; height: 100vh} Then give the container an appropriate height and width also to make it look like the design

    Use media queries on the width and height in the container to align it on various devices

    Marked as helpful
    1