Skip to content
OverviewSolutions
8
Comments
7
Mouad
@mouadbimk

All comments

  • Mouad•110
    @mouadbimk

    Nice work, keep it up

  • Mouad•110
    @mouadbimk

    nice work friend keep goind you are so good

  • Mouad•110
    @mouadbimk

    nice work my friend keep going

  • P
    Gabe•320
    @gabei
    What are you most proud of, and what would you do differently next time?

    I am most proud of making this site tabbable. Since most of this page lacks buttons and links, I used tab indexing for the first time. I decided to make use of a class called tab-target which I then programmatically tab indexed using a tiny bit of JS:

    const tabbableElements = document.querySelectorAll('.tab-target');
  tabbableElements.forEach((element) => {
    element.tabIndex = 0;
  });

    I just thought this would be fun to try, and make it easier to add additional tabbable elements with little HTML.

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

    I ran myself in circles trying to organize my styling. I ran into a few issues with style specificity when trying to apply a variety of different styles to similar elements. I realized in this process what types of selectors override others, and got a better idea of how media queries work in order.

    I used this this CSS specificity calculator on a few occasions and ultimately ended up rewriting some funky stuff I had done at the start.

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

    I'm open to any and all criticism. I'm especially curious about how to clean up my CSS a bit, particularly when it comes to making it responsive. It may look different by the time you read it because I'd like to touch it up and refactor it a bit.

    Recipe Page

    #node#sass/scss
    1
    Mouad•110
    @mouadbimk

    nice work

  • S44r4h•30
    @S44r4h
    What are you most proud of, and what would you do differently next time?

    I am proud that i make this without figma files! and i included html semantic tags

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

    It was little bit difficult make this just by looking photo

    social links profile

    #sass/scss
    1
    Mouad•110
    @mouadbimk

    Nice Work Keep Going

  • S44r4h•30
    @S44r4h
    What are you most proud of, and what would you do differently next time?

    Proud of: -i how card looks. This was my first card ever made!

    • I decide to use Sass/Scss first time
    • card looks good mobile too (making responsive was struggle :o)
    • i noticed that i remember html and css basics
    • learned many small css details example: vertical-align: middle; for adjust text and profile photo.

    what do differently:

    • START USE REM for FONTS sizes NO px! (more responsive, i started first with px then remembered mobile :P)
    What challenges did you encounter, and how did you overcome them?
    • Sass was little bit confusing at first -> i googled a lot.
    • that little yellow "learning" category was little bit difficult to make -> i used span
    • author image and name was difficult to put vertically to same line -> vertical-align: middle;
    • semantic html is difficult!
    What specific areas of your project would you like help with?

    I'm wondering if my CSS/SASS is easy to read. I think my class naming could use some improvement, and since this was my first SASS project, I'm still learning. I also noticed that my SASS file has grown quite large (160 lines!).

    Blog preview card using scss first time!

    #sass/scss
    1
    Mouad•110
    @mouadbimk

    nice work keep going

  • Mouad•110
    @mouadbimk

    nice work but you need update screenShot