Skip to content
OverviewSolutions
12
Comments
6

Dragos Popescu

@ospopCluj-Napoca, Romania320 points

Looking for ways to improve my JS

I’m currently learning...

React

Latest solutions

View more solutions

Latest comments

  • Dragos Popescu•320
    @ospop

    The buttons popping up on hover, the animations that occur while scrolling and overall the attention to detail makes the site so much more welcoming. Great job! and props for the accesibility stuff.

  • Dragos Popescu•320
    @ospop

    First attempt! While working on this project I realised I'm not using css selectors as often as I should, they are powerful, especially in situations where you want to avoid JS.

  • Dragos Popescu•320
    @ospop

    Hi!

    This is a better way to style the stars individually but since there is no content inside the element it is not possible to align the stars with the text and it also removes the ability of moving them beneath the text on media query. This way the stars can't respond to width changes.

    I updated the media queries though, you were right about the threshold. I only looked for the name and status of each person not to move on 2 rows each, I try to avoid having 4 rows of text with one word each.

    Thanks for the input!

  • Dragos Popescu•320
    @ospop

    I think grid-template-columns: 1fr enabled grid-template-areas to work in your case. I only updated grid-template-areas in my media query. I will try this next time I use grids. Thanks for the input!

  • Dragos Popescu•320
    @ospop

    Hi!

    The 'accordion' elements don't roll back after you click outside the container box. I think the user expects to go back to the original state of it when hovering or clicking outside the stack. Maybe add one more event listener?

    Everything else seems to be on point, great job!

  • Dragos Popescu•320
    @ospop

    Pretty cool, you actually took the time to align the background circles.

    Try styling the hr with this:

    hr{
      height:1px;
      border:none;
      background-color: rgba(179, 179, 179, .5);
}