All solutions

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

1. manually changing styles with Javascript probably takes more time than just adding and removing classes, so I should use that approach.

2)I made it so that the pop up can disappear only by pressing on the button (should have made it so that it'd close by pressing anywhere)

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

3)I made the div with triangular shape to be a child of the "sharedata" div which makes transitions more uneven (when disappearing there is a brief moment where u can see triangle as it's own thing and not part of the bigger shape) so I just played around with setTimeout function. I should have tried making it a neighbouring element to the "sharedata" div rather than a child, (or start using "::before" and "::after" pseudo classes?)

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

4)I would like to know how to make the picture look exactly like in the given examples. (do we change it with Css or just use a different picture/use some editor for it)

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

I should probably spend less time trying to make it a perfect match to the original and focus on practical stuff.

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

When it comes to using different units for text elements, when to use rem, em and percentages.

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

Used grid for the first time, tried to make it more responsive than the previous tasks, started using rem,

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

setting minmax width/height when it comes to grid columns/rows seems a bit weird

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

I think I should learn grid and use percentage values for fonts

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

I had a little trouble dividing up space between the given picture and the text article for the desktop version. I just set max width for the article to 300px and it worked I guess.

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

I have a little trouble on deciding where to set break points and I'm still wondering how responsive it is supposed to be. This version looks normal for desktop and intended phone version, but I don't like the way it looks on different types of screen sizes when it comes to phones and tablets (since they mostly have different size ratios and zoom). Writing media queries for each of these seems a bit excessive. (next Time I'll just try to fit it on tablet too I guess).

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

I feel like I got the hang of how to make stuff more responsive

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

very similar to the QR code exercise.

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

svg is a bit more zoomed in in the mobile version, than the desktop version. I'm not exactly sure how to do that (manually changing width/height or something to do with resolution). Also am I supposed to make this thing responsive only for 375 and 1440 viewport widths or inbetween them too?

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

I would like to make it more responsive and accurate

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

I would like to learn how to make it responsive properly and how margin and padding effect responsivness.