Skip to content
OverviewSolutions
15
Comments
15

Specro

@Specro270 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

Latest solutions

View more solutions

Latest comments

  • Specro•270
    @SpecroPosted 4 months ago

    You can use the HTML picture element to switch the mobile image without the need to use JS e.g. <picture><source srcset="desktop.jpg" media="(min-width: 768px)" /><img src="mobile.jpg" /></picture>. Good job making it responsive👍

    Marked as helpful
    0
  • Specro•270
    @SpecroPosted 4 months ago

    Great addition would be clearing form field values after the form is submitted. Also you should split repeating elements like labels, inputs and error messages into reusable React components to lower repetition in your main app code. Great job on making it responsive👍

    0
  • Specro•270
    @SpecroPosted 4 months ago

    You can simplify the code at line 13 in Accordion.jsx without needing the check like this setExpanded(expandAll); I love expand/collapse all button addition👍

    0
  • Specro•270
    @SpecroPosted 4 months ago

    You could declare card's maximum width value in tailwind config to use less arbitrary values e.g. maxWidth: {card: '400px'}. Instead of w-[90%] on the card you could use mx-6 which would achieve the same result without the arbitrary value. Good job replicating the design👍

    0
  • Specro•270
    @SpecroPosted 4 months ago

    You could extract parts like inputs and tip result lines into separate components for easier management and reading of main app code. From about 390px screen size your label in custom tip input overflows. You could use something like overflow-hidden on the input container to hide it. Similarly numbers in your tip result lines overflow the container from about 412px screen size. You should lower the font size on them on lower screen sizes e.g. text-3xl md:text-6xl. Well done on making it responsive👍

    0
  • Alingggg•150
    @AlinggggSubmitted 6 months ago
    What are you most proud of, and what would you do differently next time?

    First time using react and I used a framework

    Time tracking dashboard

    #react
    1
    Specro•270
    @SpecroPosted 4 months ago

    The design doesn't fit in the screen under 1050px. You should either remove the minimum width to let the cards shrink or collapse into the mobile design sooner. Good job on replicating the design👍

    0
View more comments