Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Cannot read properties of null (reading 'code')
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Log in with GitHub
OverviewSolutions10Comments12

All comments

  • WasiArshad• 30

    @WasiArshad

    Submitted

    What are you most proud of, and what would you do differently next time?

    Asking user to enter the details and checking them correctly with the help javascript something which I can be proud of.

    What challenges did you encounter, and how did you overcome them?

    Making it responsive and showing the successful page to the user Used third party website to overcome from that.

    What specific areas of your project would you like help with?

    Handling event listener and showing successful page.

    Newsletter SignUp Page

    1

    P
    jasoneczek• 300

    @jasoneczek

    Posted

    Hi, I came across a couple of functionality issues:

    1. The "Dismiss message" button isn't working when I try to close the success message.
    2. The email input background isn't changing to the error state color when I enter an invalid email address.

    I also noticed you used pixels for font sizes in your CSS. It is best to use rem units for accessibility.

    Your solution is looking good, I think you'll need to work on the functionality and definitely learn about rem units. Good luck!

    0
  • P
    jasoneczek• 300

    @jasoneczek

    Posted

    Hi Nizi, your functionality isn't working for me. When I click the button, the menu does not open. I see you are using sass, which I have only just started learning - I wish I could be more help with that. Your html looks good. Visually your solution is spot on. I think you are very close to an excellent solution once you resolve the javascript functionality.

    0
  • P
    Achara Chisom Solomon• 340

    @AcharaChisomSolomon

    Submitted

    What are you most proud of, and what would you do differently next time?

    Getting it responsive was not fun, tried following some of Andy Bell's 'every layout' principles.

    What challenges did you encounter, and how did you overcome them?

    Had to learn more about the CSS clamp function.

    What specific areas of your project would you like help with?

    I just need to practice more.

    Meet landing page using flexbox and grid

    1

    P
    jasoneczek• 300

    @jasoneczek

    Posted

    Hi Achara, really nice solution. Good job using custom properties and the clamp function too. If I could suggest only a couple minor things, you could maybe add a little transition for your button hover. And you can use rem units for your media queries too. Great job.

    Marked as helpful

    0
  • P
    Martin Mwaka• 300

    @Temceo

    Submitted

    What are you most proud of, and what would you do differently next time?

    Deploying the site in grid

    What challenges did you encounter, and how did you overcome them?

    Using grid, having mainly designed in flexbox previously.

    What specific areas of your project would you like help with?

    Any improvements on the grid layout

    Testimonials grid

    2

    P
    jasoneczek• 300

    @jasoneczek

    Posted

    Hi Martin, super nice job! Good use of custom properties and semantic html. One minor UI difference I noticed is that on desktop, the "quote" mark background image in the violet card should be a little further than the right edge, compared to the mobile version. If you want to match this a little closer you can easily adjust the distance in your media query. I noticed you used rem's, but you can also play with percentage for this.

    Marked as helpful

    0
  • Dan P.• 190

    @Danielfww

    Submitted

    What are you most proud of, and what would you do differently next time?

    I'm proud that I actually understood how the Grid works - it took me so long to actually understand how that works and hopefully in the future this becomes easier and easier.

    *I redid the project after I saw that while my mobile version was ok, Desktop version just not good - I didn't really paid attention to the desktop measurements that they gave and made all the divs way too big. Took me another 2 days to finish this again

    What challenges did you encounter, and how did you overcome them?

    Working with media queries was probably the most challenging part - but practice makes perfect. Another issue I faced is actually creating more space in the main body of the page, while mobile wasn't really an issue I still don't know how to create more space horizontally without redoing the whole project again.

    What specific areas of your project would you like help with?

    • Spacing,
    • How to use box-shadows better,
    • Understanding how to use positioning better, margins and paddings,
    • Working with measurements & Whitespace.

    4 Cards Challenge

    1

    P
    jasoneczek• 300

    @jasoneczek

    Posted

    Hi Dan, I'm getting horizontal scroll on mobile and the cards are and your text above the cards is not responsive. I'm wondering if having min-width:100vh on your container is causing that. Maybe try using a max-width on your container. I also don't think you need to set heights for the different components here (except for the icons). Sometimes that too causes issues. Desktop is looking great, I think I would recommend working on the responsiveness.

    Marked as helpful

    1
  • P
    jasoneczek• 300

    @jasoneczek

    Posted

    Hello Lucas, I noticed you made the main image of the perfume a background image. I think for this one a semantic image tag makes more sense since it is an important image of the product. It should have alt text too.

    I don't think you need sections or articles inside your card component. If you want to divide your content into different sections like this, you can use div's.

    I would check your padding around the card content as well. The text to me looks a little too close to the edge. I also don't see a solid border around the card itself. It might be a stylistic choice if you like that.

    All in all it looks good, I hope some of this information helps.

    Marked as helpful

    0
  • P
    jasoneczek• 300

    @jasoneczek

    Posted

    Your solution looks good, but on my phone it is really skinny. I think it might be your margin for the container is 60px all around. Maybe if you lower the left and right margins it will look better. I would also avoid using px for your font sizes and use rem instead. I think in the table, Calories, Carbs, Protein and Fat would the table headers and with scope of row. Hope this helps, nice job!

    Marked as helpful

    1
  • konraddissake1808• 80

    @konraddissake1808

    Submitted

    What are you most proud of, and what would you do differently next time?

    I'm happy of how smoothly it went, nothing more.

    What challenges did you encounter, and how did you overcome them?

    Nothing was really challenging.

    What specific areas of your project would you like help with?

    None really. But if someone has something to say, i'll gladly listen

    Responsive blog preview card

    2

    P
    jasoneczek• 300

    @jasoneczek

    Posted

    Nice job. I'm wondering though why you chose id's instead of classes for your selectors. There a a couple videos that explain the difference.

    https://www.youtube.com/watch?v=CAPPO0r0DIQ

    https://www.youtube.com/watch?v=69m_rC4UxYY

    You might also consider changing your h3s to paragraphs. Having the h3 before your h2 is out of order, and the name doesn't need to be a header.

    Speaking of the h2, the text inside should be a link to the blog post, using a nested <a> tag. This video helped me immensely when I was working on this challenge.

    https://www.youtube.com/watch?v=nM78am-FC9Q

    Marked as helpful

    0
  • P
    jasoneczek• 300

    @jasoneczek

    Posted

    I have a few suggestions that I hope you will consider:

    Inside of your h2, you'll want to wrap the text in an <a> tag. This is the link where the user would navigate to the blog post.

    I don't think you necessarily need to use extra divs for the image and content.

    The 'Learning' text can just be a paragraph. You have an h2 below this, so having an h5 there is out of order.

    Use rem units instead of pixels for font sizes and sizing.

    Your solution looks good but I think with these adjustments it will be more semantically correct. I hope this helps.

    Marked as helpful

    0
  • P
    jasoneczek• 300

    @jasoneczek

    Posted

    You have a good start but it seems like your project is unfinished. I have a few suggestions that I hope will be of help moving forward if you choose to continue improving it:

    Create a style.css file in your root project directory and use a link tag in the head rather than writing your css in the html file. Your html is missing a <main> element. You can change your section tag to main. Since this is a card and typically cards are often repeated on web pages, you might want to change your h1 to an h2 or h3. I would make the location a p instead of an h4. Your list items should contain anchor tags <a>, since they are linking the user to your different profiles. If you would like to match closer to the design, check your stylings again compared to the design files and see what could be tweaked to more closely match.

    0
  • P
    Cleyrol Santana• 60

    @cleyrolsc

    Submitted

    What are you most proud of, and what would you do differently next time?

    I feel way better working with flexbox thanks to the practice. This project felt way easier than the previous ones.

    What challenges did you encounter, and how did you overcome them?

    None

    What specific areas of your project would you like help with?

    Everything's good so far.

    Responsive Blog Card using Flexbox

    1

    P
    jasoneczek• 300

    @jasoneczek

    Posted

    Nice work on your solution. I see a few improvements that might help. Your h2 title should contain a <a> tag inside, which would serve as a link to the blog in real life. You've also used pixels instead of rem units for your font sizes, which is a problem for accessibility. You might also want to take a look at the differences in the design files for the box shadow between active and inactive states. I hope this helps.

    Marked as helpful

    0
  • Eve• 50

    @evsta24

    Submitted

    What are you most proud of, and what would you do differently next time?

    I did it in short time. Great challenge with simple design for beginners.

    What challenges did you encounter, and how did you overcome them?

    Nothing.

    What specific areas of your project would you like help with?

    I don't know. If you have some tips how to be better, I will be grateful.

    QR code component using HTML & SCSS

    1

    P
    jasoneczek• 300

    @jasoneczek

    Posted

    Your solution looks really accurate to the design, great job. Im getting a little bit of vertical scrolling on mobile. I had the same problem. Changing the height: 100vh to min-height: 100vh, and putting that on the body instead of the main element helped me fix that. Also, the mentors on here will point out to never use pixels for font size, but to use rem units instead. Same for padding and margins.

    Marked as helpful

    0