Skip to content
OverviewSolutions
9
Comments
9
Jason Burke
@JasonPBurke

All comments

  • Jason Burke•150
    @JasonPBurkePosted 2 days ago

    I like this solution! The only thing I would consider changing is the change on screen size. You may consider switching away from the mobile design at a smaller size (say 768px) as it can look a bit strange stretched out up to 1000px.

    Cheers!

    0
  • Jason Burke•150
    @JasonPBurkePosted 11 days ago

    This looks pretty good! In your profile class, you might think about wrapping the image and details in a div and then you can position the share button and the profile at opposite ends of the div.
    Cheers

    0
  • P
    Kumani Kidd•150
    @amancalledkiddSubmitted 15 days ago
    What are you most proud of, and what would you do differently next time?

    This was my second attempt at cube css, found that a good setup of globals really layed a solid foundation for the rest of the project. Next time i would focus on better understanding and application of utilites.

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

    The desktop layout I found I challenging when using grid-template-columns & grid-template-rows. To get a better understanding of my layout, I used grid-template-areas which allowed me to create the desired solution.

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

    Tips on Cube css?

    Any suggestions or recommendations?

    Testimonial grid Responsive Scss using Cube Css methodologies

    #sass/scss#cube-css
    1
    Jason Burke•150
    @JasonPBurkePosted 14 days ago

    Nice!

    0
  • Jason Burke•150
    @JasonPBurkePosted 14 days ago

    This looks great. I think the <p> fonts should be the Grey-400 and Grey-500 outlined in the style guide. 400 for the card paragraphs and 500 for the header paragraph.

    Cheers

    0
  • heixiaozhi•70
    @heixiaozhiSubmitted 17 days ago
    What are you most proud of, and what would you do differently next time?

    using scss

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

    using scss and grid layout

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

    code review

    Responsive page using CSS Grid and SCSS

    #sass/scss
    1
    Jason Burke•150
    @JasonPBurkePosted 16 days ago

    This looks really good!

    Perhaps rather than using an <a> tag, you could use a <button> tag.

    Also, if you use {max-inline-size: 100%} on your image when in mobile you will be able to lock the image to the container without it overflowing.

    Marked as helpful
    0
  • Jason Burke•150
    @JasonPBurkePosted 18 days ago

    Looks good but look in to creating a styles.css file and including it in your HTML with a <link>. Look at the @font-face to help you import and use the correct fonts needed for the page.

    0
  • Jason Burke•150
    @JasonPBurkePosted 21 days ago

    Looks very nice!

    0
  • Jason Burke•150
    @JasonPBurkePosted 21 days ago

    Padding between the image and Learning banner needs to be a bit larger. Maybe try to add more bottom margin to the image.
    Also, try something like the following for the author class: display: inline-block; content: ' '; background-image: url('./assets/images/image-avatar.webp'); background-size: contain; height: 2rem; width: 2rem; margin-right: var(--Spacing-150);

    this should shrink the image and align the two elements.

    All in all this looks great! Keep it up!

    Marked as helpful
    0
  • Jason Burke•150
    @JasonPBurkePosted 22 days ago

    It looks like your padding on your <p> may need adjusting to match the solution provided. Nice job though!!

    0