I am proud because it is my first time to convert a design into code.
What challenges did you encounter, and how did you overcome them?The challenge was to understand how you can make all elements centered.
What specific areas of your project would you like help with?css styling
I was able to get the layout to be pretty responsive down to a fairly small mobile size. It does eventually break down, but I think it fails at a point that's narrow enough not to really care about.
I'm not sure how to feel about how I handled the nutrition info. I like how it looks, but I'm not sure a bunch of divs is the right solution, but it felt better than using a table, since there's nothing inherently tabular about that data.
The only real challenge I ran into here was how to deal with the nutrition info in a grid. I ended up just styling it with a grid and some css magic. I'm pretty happy with the css side of things, but not so sure on the html. Everything else wasn't too difficult.
What specific areas of your project would you like help with?As I've mentioned in previous projects, any feedback is greatly appreciated. I have many years experience in backend development and such, but frontend experience has been pretty light.
Suggestions on how to better markup the nutrition data would be most welcome.
the image isn't showing up you could use the image provided by default
you could use the baground colour to hsl(47, 88%, 63%)
Most prud of my shadow and that i finished the Challenge. I learn coding since two weeks and i love it.
What challenges did you encounter, and how did you overcome them?For me its very tricky to use the Flexbox. But i finished it, with some that i leraned.
Use the font-family: 'Outfit', sans-serif; and remove the box shadow for the container..
comment it out after checking it
It would be Great if you just use button:hover instead of button:active in the style.css file
Estoy orgulloso porque a pesar de que parece algo fácil, tuve algunos problemas con la parte responsiva y aún así leyendo e investigando pude resolverlo yo solo.
What challenges did you encounter, and how did you overcome them?Al momento de alinear los elementos de la página
What specific areas of your project would you like help with?En la parte de cómo utilizar el atributo Flex de manera efectiva
The page isn't looking good .. you can remove margins and heights and add these css properties it will make it look good and responsive
width: 25em; padding: 1.75rem; border-radius: .6rem;
I am proud of the fact that I was able to apply all the css skills that i learnt without having to revise everything or having to refer multiple times. But obviously there were instances where I had to refer to ai tools like chatgpt when my code was getting broken to speed up my efficiency. I could reduce the overall number of divs in the tag because i think it is overloaded with multiple divs.
What challenges did you encounter, and how did you overcome them?One of the most weird challenges that i encountered was the qr-component not resizing properly due to container-box constraints of height. Then I worked on it by adding some padding and applying aspect ratios to some components
What specific areas of your project would you like help with?I dont think I need help yet, but if there is something that i would need some referrals upon would be the number of divs and sections i should use to mimic the result.
It would be better if you used black color to the paragraph too
The code looks good though... but it would be better if you used the paragraph black color too
Made with:
first time using webpack for bundling JS file and dependency, took me a while to figure out 😵😵
What specific areas of your project would you like help with?Feel free to leave feedback if you notice any bugs etc. 👇👇
Also i think for the dates too. It would suit a light color instead of the purple color...
You could use just like this for the image , the image isn't showing on your site.. <img src="./assets/fonts/images/avatar-jessica.jpeg" alt="profile">
I made it in just 10 min, that's quite an achievement. I'm proud of myself.
What challenges did you encounter, and how did you overcome them?none.
What specific areas of your project would you like help with?none.
