Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Using SASS, responsive 375px, 1440px

Pierre 250

@Rem0ld

Desktop design screenshot for the Fylo data storage component coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Couldn't do the little arrow on desktop screen, ask for help on slack but nobody answered. I would be glad if anybody can tell me how to do it.

Community feedback

@jfprentice

Posted

I really like the transition you added to the progress bar, very nice touch!

0

Pierre 250

@Rem0ld

Posted

@jfprentice Thanks!

0
Mark Mitchell 1,820

@markup-mitchell

Posted

Hi Pierre,

People do it different ways - there's a thing you can do with the border of a div but IMO a small inline SVG is simpler and more explicit:

<svg height="23" width="23" viewBox="0 0 24 24">
        <polygon points="23,23 0,23 0,0" />
      </svg>
0

@bsabardu

Posted

@markup-mitchell great ! Do you have any to to generate this SVG ?

0
Pierre 250

@Rem0ld

Posted

@markup-mitchell Thanks for this! I was actually trying with shapes and transfrom (rotate, skew) and I forgot I could create svg shapes so easily. Very nice trick.

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord