Skip to content
OverviewSolutions
7
Comments
7
Kyle Parsotan
@Kyl67899

All comments

  • Kyle Parsotan•90
    @Kyl67899

    Nice website

  • P
    Micha Huhn•200
    @MichaHuhn
    What are you most proud of, and what would you do differently next time?
    • I made the card responsive by using a media query and by using fluid design. The card's width automatically adapts to the viewport on mobile screen sizes.
    • I used semantic HTML, e.g. nav, ul.
    • I implemented proper hover and focus-visible states.
    • I also used the q tag to create the quote.
    What challenges did you encounter, and how did you overcome them?

    First, I centered the card with this code:

    display: grid;
place-content: center;

    But that caused the card to shrink. However, the card should have a bigger width on desktop (see mockup). That's why I only centered the card vertically with this code:

    display: grid;
align-items: center;

    and applied a max-width-wrapper class to the card to center it horizontally and to make it responsive. This technique is explained in this YouTube video.

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

    I think I found a good approach to center the card and to make it responsive (see above). However, let me know if you know a better solution.

    Social links profile using Vue

    #sass/scss#vue#accessibility
    3
    Kyle Parsotan•90
    @Kyl67899

    Nice website

  • Kyle Parsotan•90
    @Kyl67899

    Nice website. Very responsive. Accessible for other users

  • Kyle Parsotan•90
    @Kyl67899

    Great website

  • Darren Ogola•60
    @Ogo1A
    What are you most proud of, and what would you do differently next time?

    I was able to come up with a web page

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

    CSS styling

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

    CSS especially sizing of things.

    Css and html

    #accessibility#bootstrap#django#jss#angular-material
    1
    Kyle Parsotan•90
    @Kyl67899

    Layout is good. Make the background border-box: box-sizing to get the full page to be 100% and not taken up only less than 100% like the background color does. Overall the website is great. The page is not very responsive try to use media query to help with making the site responsive.

  • Kyle Parsotan•90
    @Kyl67899

    I used semantic HTML for this react.js project.

    The website is very responsive for tablets, desktops, and mobile phones.

    The code is reusable, well-structured with comments to further understand the logic, and is very user friendly for reusability.

    I would appreciate any feedback from you on this project

  • Kyle Parsotan•90
    @Kyl67899

    Nice style and responsiveness.