Frontend Mentor | Necronyte's profile

P

Stash443•120

@Stash443Submitted 5 days ago

Testimonial Grid Section using CSS

1

Necronyte•90

@NecronytePosted 5 days ago

Great job!

0

shahd Abdalghny Gadalla•80

@Shahd-AbdalghnySubmitted 10 days ago

grids

1

Necronyte•90

@NecronytePosted 9 days ago

Code looks good but i think the box shadows are wrong. box-shadow: 0 2px 8px rgba(0,0,0,0.1); is better.

0

Mohamed Mohamoud•100

@mohamed8eoSubmitted about 1 month ago

Product preview card component with flex-box

1

Necronyte•90

@NecronytePosted 12 days ago

awesome!

0

P

Erik S. Carlsten•220

@ecarlsteSubmitted 13 days ago

What are you most proud of, and what would you do differently next time?

I used a mobile first workflow this time, creating the mobile version first and then adding sm:px-[40px] for switching to tablet/desktop after I'd fully completed the mobile page.

During my conversion over to desktop I wasn't setting the mobile values that were now required since I was overriding them for small and larger screens. Next time I'll be sure to add those values when I'm adding the sm conditional classes.

I also tried setting up the Google fonts used straight in tailwind rather than loading them using Next.js. I like this better I think since it keeps all of the styling in one place potentially. I'm going to keep using this technique unless there is a good reason not to.

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

My challenge this time was figuring out why my UI wasn't scaling back down correctly to mobile sizes once I'd scaled up to desktop size.

Took me a bit to figure out that because I wasn't specifying a default value, it wasn't switching correctly at the size breakpoints.

So, for instance rather than having:

<div className="sm:rounded-3xl" />

I needed to use:

<div className="rounded-none sm:rounded-3xl" />

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

I'd like help potentially organizing the breakdown of React components that I chose to use in this project to see if there are potentially cleaner ways to organize it.