P
@welpmoz
What specific areas of your project would you like help with?
I need help with accessibility implementation. Any improvement or observation will be appreciated!
Kristina
@frontend-enAll comments
- @frontend-en
Hi, at 425px, the layout of Consent__header seems to break. You might want to check its responsiveness.
Other than that, excellent work! ✅
- @KingOdoWhat challenges did you encounter, and how did you overcome them?
reviewing the DOM
What specific areas of your project would you like help with?Getting some ideas on how to make the minus sign appear after clicking the plus sign
@frontend-engood job
- @samir-DeveWhat are you most proud of, and what would you do differently next time?
It was quite easy !
What challenges did you encounter, and how did you overcome them?I encountered no challenges
What specific areas of your project would you like help with?It is well designed and complete, I don't think I would need help with it !
@frontend-enHello, I hope this helps you.
-
The background should have a gradient.
-
The spacing on the desktop version should be different.
-
Add smoothness to the animations.
-
If none of the options are selected, the Thank you! window should not be displayed.
-
The README is not formatted.
Overall, great job.
-
- @kaoutar-ouadihWhat are you most proud of, and what would you do differently next time?
I'm proud of completing this project it was a little bit challenging but I did it!
What challenges did you encounter, and how did you overcome them?I encountered a lot of challenges during this project but also I learnt a lot.
What specific areas of your project would you like help with?Anything that can help me improve.
@frontend-enHi, hope this helps:
You can use a javascript object to store all the necessary DOM elements there, and when you write code, refer to this object.
This will speed up the application.
- @PaanKrab@frontend-en
Good job )
- @Benhemin@frontend-en
Hello, I hope my tips help you.
- No processing errors if 0 people
- If there are 0 people, then in tip NaN
- When you hover the mouse over the input, the layout moves. Try setting transparent borders by default
- It's good to write JS in a separate file
- var - considered an obsolete way to declare a variable. Use let and const
- Adding inline style is considered not a very good practice
- @delroscol98What are you most proud of, and what would you do differently next time?
Super proud that I was able to overcome the CORS error by simply using VS Code Live Server extension. I am also proud of using JavaScript to dynamically insert data values into the appropriate places.
What challenges did you encounter, and how did you overcome them?Encountering CORS was not fun. Using Live Server was an absolute save!
What specific areas of your project would you like help with?Could I have made my JS code more clean or neat? I was originally thinking of breaking the entire file into different functions: One for retrieving data; one for handling button states; one for dynamically inserting data. However, this method became too complicated and I found my logic all over the place.
Any suggestions for making my code neater and cleaner would be appreciated.
@frontend-enHope this helps you.
- To get rid of the bottom border in a card, you can use liner-gradient with colorStop.
- I like animation
- You can use import data from '../data.json' assert {type: 'json'}; so you don't have to use promises
So, good job.
- @thomasshelbyyyWhat are you most proud of, and what would you do differently next time?
i added a simple loading animation and disable the button and the input while it's loading, in the future i will add the spinner animation in the loading
@frontend-enHello, I think there is something that can be improved.
- Set up ledges in the card
- Change font size
- To use JavaScript for beautiful styles for validation, you can use the novalidate attribute for the form.
- When you click on Dismiss message - and go back - you need to clear the value of the input.
- @HusniddinAyubjonov@frontend-en
Hi, I hope this helps share - semantically it should be a button.
Good job
Marked as helpful - @kayyrbeks@frontend-en
Good job )
- @twobottles2092What are you most proud of, and what would you do differently next time?
The layouts when using css grid, i just want to know more on the upcoming projects
What challenges did you encounter, and how did you overcome them?well i need to be acurate on the design, the text styles I manage to worked on it.
What specific areas of your project would you like help with?the third section, Kira whittle sentence I cant align and on the other 2 sections, a little mess when adjusting font size or margin
@frontend-enGood job!
- @sohagmnrWhat are you most proud of, and what would you do differently next time?
I learned new element and use in this project
What challenges did you encounter, and how did you overcome them?with align-items
What specific areas of your project would you like help with?alignment
@frontend-enHello, I hope the tips help.
- @media - best used at the very bottom.
- don’t use pixels for fonts, rem is better
- It’s better to download fonts from connect via font-face
- @mellinghWhat are you most proud of, and what would you do differently next time?
My first website that works, responsive!
What challenges did you encounter, and how did you overcome them?Responsiveness/media query
What specific areas of your project would you like help with?Tips in General
@frontend-enGood job )
- @6xg0dWhat are you most proud of, and what would you do differently next time?
It took me a couple hours, but im pretty happy with the final result. I had to search for a couple CSS properties to remember their values or how to use them, so i'm glad that i was able to reenforced my knowledgement
What challenges did you encounter, and how did you overcome them?Semantic was the most challenging part. It took me a while to be happy with the semantic structure in my HTML.
What specific areas of your project would you like help with?I'd like to improve the responsive of the page. And to know if the css can be simplify even more
@frontend-enHello, I hope this advice helps.
Set the maximum card width
Marked as helpful - @Anoop-Rajoriya@frontend-en
Hi, I hope this will be helpful.
- Use @font-face for fonts
- You can use styles reset by Andy Bell
- Pay attention to the indents on the card.
- @arowstevWhat are you most proud of, and what would you do differently next time?
Biuld the project understanding of strutures.
What challenges did you encounter, and how did you overcome them?None
What specific areas of your project would you like help with?To center the card box
@frontend-enHello, arowstev!
You can add 800 font for .foundation. and use more semantic tags.
Line 33 in index.html - the div above the img is redundant.
- @salbltrn33What are you most proud of, and what would you do differently next time?
I feel accomplished for being able to code this in a very similar fashion to the design. Next time id like to try and use bootstrap.
What challenges did you encounter, and how did you overcome them?I had some trouble getting the card to be centered both vertically and horizontally. I was able to utilize flexbox to make that process easier.
What specific areas of your project would you like help with?What are other ways to center the content vertically and horizontally without the use of flexbox?
@frontend-enHello )
You can improve the project by removing
<div class="attribution">...</div>For convenience, you can use class instead of id, because The weight of the class is lower, it will be easier for you to override styles when necessary.
Tray using height: 100% for
html, body{}and height: 100% for #container. If you apply these styles, then the card will be in the center, because flex will work as expected.To make it easier to manage styles, you can reset the default styles for
h3, p { margin: 0; }
