All solutions

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

Kept working on the projects

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

1. Click on the options, the option color is changed. - tried to use css presudo class for this, but failed, looked into other's code. Separated to different ones.
2. The layout of the media query sometimes are not applied, fixed this because the class rank is lower than the default media.
3. The cards was generated by the data.json. - learned to deal data with js

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

1. Seems I was using flex box too much, would it be a good choice, or the suggested way?

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

Proud: Kept going

Next time:

1. Draw the design first and go through the structure before implementing anything.
2. Break the huge issue into small pieces, analyze goes first then try

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

1. Get to know built in validation, type, required, min-length , max-length and so on.
2. Get to know the JS validation
3. Toggle class when display hide the div
4. mail.style.borderColor = 'var(--Tomato)';, in js if the css property has dash, the just use the camel case.

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

We have a good layout on 375px and 1440px, but when resize , some weird things happen, the layout looks strange, for example: 754*601.

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

1. I kept on working on the project.
2. solved 5 issues. (1) to make 2 landing pages for mobile and desktop (2) made the tooltip from scratch (3) for the drawer picture in desktop version , i used object-position: top 0 left 0 to match the design (4) put the banner to different position on different screens (5) event bubbling : prevent it from using event.stopPropagation()

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

1. googled for the event bubbling.
2. googled for tooltip

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

Any suggestion is welcome~~ thanks `

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

1. I didn't give up. I made it.
2. The code is heavy for different screens, aslo it's a small project, but I've already feel the file management is out of control, need to work on this.

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

1. For the same font, same size, same padding, same line-height, the paragraph's layout is different from the design, I looked for other devs code, and learned I can user padding to make the style.
2. Used BEM, but not good at defining elements. Will check codes of others to learn.

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

For example, I have a container with 1000px width, and i give this container a gray background, then some content inside the container. When resizing the screen, sometimes the issue occur that the content is outside the container, any suggestion to prevent this from happening? I tried max-width:100%, but it seems doesn't work.

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

I'm proud of using the BEM . I learned minmax for grid, but haven't got a closer look at the grid basics... will submit the solution again after get more concepts of the responsive grid

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

Learned to use BEM

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

Responsive page using grid.

Any suggestion is appreciated!

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

1, I finished this project after 3 days.... I didn't give up. 2, I have a deeper understanding of the rank of the classes

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

In the end , I made the 1440 view using a grid, but the grid-gap is fixed, but when the screen goes larger, the vertical gaps between the divs are no longer the same.

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

For the minimal size, how to define it's minimal enough and the cards shouldn't shrink anymore?

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

1. Learned media query.
2. Thinks about the responsive design

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

1. The flex box were not equal in width even though I set flex:1 for each flex item. I gave each flex item 50% so that they are equal in width in the end.

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

There are only 2 designs , how do we know the margin within other designs? how to shirk corresponsive without every media query?

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

1. Keep to try even though it was hard.
2. Pay attention on the divs which css should be affecting.

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

1. For the list, the height is not the original one, I put some margin-bottom for each li
2. For the list, the bullets have some space between the text, I used padding-left for the li so that there will be space
3. Using tailwind, sometimes the config doesn't apply, I don't know why and haven't figured it out.
4. There are a lot of duplications on the styles
5. When there's no padding , the li marker won't show.

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

Any feedback on the improvements

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

Redo the project, and it takes about an hour to finish all.

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

I used flex box alot, i don't know if it's a good choice, or will there be any performance issue, will seek help from google and discord channel.

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

1. We only have 2 designs of figma, for the tablets , do developers decide the layout by themselves?

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

1.Did the challenge 2. It looked pretty

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

1. responsive landing
2. tailwind css - config

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

1. I'd like to see the perfect solution and learn from them

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

1. Finished it and uploaded the project to Git Hub.
2. redo the project and know better on the center container , always learn new things from doing the old project

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

1. use the morden css, flex to center the div
2. pay attention on the description so that they are perfectly matched

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

Both desktop and mobile design work.