Latest solutions
- Submitted 6 days ago
Responsive landing page using CSS Grid。
- HTML
- CSS
I have used SCSS to manage CSS before and know that SCSS allows for nested writing and inheritance to manage styles. However, in my practical experience, it’s difficult for me to consider all the SCSS processing at the beginning, so I still prefer to write directly in CSS. Should SCSS be handled at the end to optimize CSS? Because my proficiency in SCSS is not very high, I usually end up choosing to write directly in CSS.
- Submitted 2 months ago
Use SCSS and Grid to create a layout
#sass/scss- HTML
- CSS
If someone has a better structure for my HTML and SCSS, I'd love to hear it. I think the
&:nth-child
parts are a bit redundant. Is there a better way to do this? - Submitted 3 months ago
Using SCSS Flexbox for layout, incorporating accessibility design.
#sass/scss- HTML
- CSS
I hope someone can review my code and provide suggestions on my HTML structure or SCSS code for better practices.
- Submitted 3 months ago
Using SCSS Flexbox for layout, incorporating accessibility design.
#sass/scss- HTML
- CSS
Please review my code. I want to know if there are better ways to write CSS, and I'm not sure if I'm using SCSS correctly. Are there any ways to make my SCSS code more maintainable and readable?
- Submitted 3 months ago
Using CSS Flexbox for layout, incorporating accessibility design.
- HTML
- CSS
Are there better ways to manage CSS to improve its readability and maintainability?
Latest comments
- @TomekWojakSubmitted 14 days agoP@angel-retryPosted about 4 hours ago
Hi @TomekWojak
Your bounce animation is really cute and fun! Also, I checked out your code, and it's very clean. I've learned a lot from it. Looking back at my own project, it seems a bit more complicated. The way you use 'active' to control sharing information is really clever. I’ve learned a lot from that!
0 - P@GentleHorseSubmitted 7 days agoWhat are you most proud of, and what would you do differently next time?
Optimizing for different screen size device took a bit of time and also required a certain amount of code, but now I'm gradually getting used to write and organize the code without using modular components structures like React.
What challenges did you encounter, and how did you overcome them?It's a small detail, but without React component, I didn't know how to render elements conditionally depending on screen sizes, but the solution was very simple; just setting "display" property to "none".
P@angel-retryPosted 6 days agoI clicked on your Repository link(view code), but it shows a 404 error. However, I noticed that you used Vercel to deploy the website and utilized React, which is really impressive! Although I'm not quite sure how your code structure is designed, I want to congratulate you on successfully completing a project using React.
0 - @vladyslav-shulhachSubmitted 2 months agoWhat are you most proud of, and what would you do differently next time?
I'm proud of how I created a grid layout, especially on the desktop version using
What challenges did you encounter, and how did you overcome them?grid-area
. Next time, I will plan the grid structure more thoroughly at the beginning so that I don't need to make as many adjustments later. This will make the process run more smoothly and efficiently.After I learnt how to use
What specific areas of your project would you like help with?grid-area
, I didn't face many problems during development. The overall development and ensuring to make it more matched according to the design I think was the most difficult part, but once I realised that more frequent practice makes it even easier for me to develop projects next time. I took it step by step and focused on learning, which helped me stay on track.I'd like to learn more and explore the use of SCSS to manage complex network layouts, as well as learn about alternative approaches to improving responsiveness and scalability in HTML.
P@angel-retryPosted 2 months agoYour implementation of the page is 99.9% similar to the design draft, which is fantastic! I use a different method for grid layout, and I find your approach much more readable. I used numbers to set grid-area, but after seeing your method, I prefer yours!
Wishing you smooth and happy development!
1 - @KrzysztofRozbickiSubmitted about 2 years agoP@angel-retryPosted 3 months ago
I checked out your code, and your SCSS management is really detailed. You define styles so well (like text-500), it feels like you've mastered the essence of SCSS. It's fantastic and I've learned a lot from it.
Your page is also very close to the design mockup. You've done an excellent job!
0 - @FerdiansyahmulyadiSubmitted 3 months agoP@angel-retryPosted 3 months ago
hello @Ferdiansyahmulyadi
After reviewing your code, I noticed that your SCSS is very well-organized, and I've learned a lot from it. Your page layout is correct, but there are minor differences in font weight and spacing between elements compared to the design. However, I believe that with a Figma design file, you could match the design perfectly.
You did a great job!
0 - @PedroAlmeida3148Submitted 3 months agoP@angel-retryPosted 3 months ago
hello @PedroAlmeida3148
The spacing between elements is acceptable, but some text colors and fonts do not match the design. However, since this project did not refer to the Figma design, it is difficult to ensure the actual page matches the design.
I noticed you used a table for the Nutrition section, which surprised me. I used CSS Flexbox for layout, and it seems you achieved the desired layout quite easily. Based on my observation of the design, you don't need to use
text-center
for td; just addingpadding-left: 40px
will make it look similar to the design!0