Skip to content
OverviewSolutions
4
Comments
23
Jaydi
@ruedasjnthn

All comments

  • Jaydi•355
    @ruedasjnthn

    hi your work is awesome, but im kinda sad im trying to find solution that succesfully use the shortly api into their project. overall, i will use this design as my preference in completing this challenge

  • Jaydi•355
    @ruedasjnthn

    Hey great progress, im wondering if my recent solution about this challenge will help you improve your website. I have to admit the theme toggle switch is the most difficult part.

  • Jaydi•355
    @ruedasjnthn

    i think making the image and content container size proportional to each other will make it more nice, try to set the grid template column to 1fr 1fr.

    be consistent with your padding and margin, i think it is from 900 - 1000px screen width the content gets out of its container and made the layout a bit mess

  • Jaydi•355
    @ruedasjnthn

    there a lot of things in my opinion that need to work on to improve your website

    first using proper breakpoints especially on your mobile screen

    u can use grid to improve your design

    the typography need to be pleasing to the eyes and not breaking lines at some point

    u can use mix-blend-mode: multiply the reduce the opacity of your image to 70% to match the set design in this challenge

    Marked as helpful
  • Jaydi•355
    @ruedasjnthn

    there are some things to change to make this website more elegant in my opinion

    u might want to reduce the padding of your content to make it more nice and readable

    grid is my best suggestion to control your card component to fix the image as it shrink a lot as the viewport width decreases

    Marked as helpful
  • Jaydi•355
    @ruedasjnthn

    there are some things that you can work on to improve your website in my opinion

    First is the typography make sure the heading stand out than the subheading, using font-weight bold might be the way to fix that

    Somewhere at 620 to 635px the design become a mess, make sure to check your media queries to ensure fluid responsiveness

    You might want to consider using percentage in you margin to have consistent margin in your card component

    Marked as helpful
  • Jaydi•355
    @ruedasjnthn

    The website responsiveness is great but the margin of the card component is not proportional

  • Jaydi•355
    @ruedasjnthn

    use display:block to show your image

    also use text -align: left to correct the layout of your design, u can achieve this using media queries to help you change layout as the screen size changes

  • Jaydi•355
    @ruedasjnthn

    using grid will help you a lot in this challenge

    use mixblend mode: multiply then set the opacity of your image to 70%, you can achieve the set design for the image using this technique

    Marked as helpful
  • Jaydi•355
    @ruedasjnthn

    use mixblend mode: multiply then set the opacity of your image to 70%, you can achieve the set design for the image using this technique

  • Jaydi•355
    @ruedasjnthn

    use css grid broo, it will help you a lot in this challenge, also it is easier to use grid with sass

  • Jaydi•355
    @ruedasjnthn

    You can use grid to properly control your card component, take note the it might be easier to use grid with sass

  • Jaydi•355
    @ruedasjnthn

    You can use percentage or viewport width to make consistent margin as the screen size is reduced

    Marked as helpful
  • Jaydi•355
    @ruedasjnthn

    try to make the typography in your website more clean, this could be better with the proper use of margin and padding. also, the proper font-size and family can make your website more pleasing to the eyes

    Marked as helpful
  • Jaydi•355
    @ruedasjnthn

    try to add proper margin and padding to make the website nice and pleasing to the eyes

  • Jaydi•355
    @ruedasjnthn

    U should use object fit to fit the image inside the container. Try to use grid to control the positioning of your card container, take note it might be easier to use grid with sass

  • Jaydi•355
    @ruedasjnthn

    you should set the proper breakpoints in your media query, good try keep on practicing bro!!

    Marked as helpful
  • Jaydi•355
    @ruedasjnthn

    The website is responsive good job! However, watch out your margin and padding in every breakpoint, ensuring that it is pleasant to the eyes of the viewers

    Marked as helpful