Frontend Mentor | k-hroma's profile

P

pankajb085•290

@pankajb085Submitted 3 months ago

Responsive Testimonials page using Grid

1

k-hroma•150

@k-hromaPosted 3 months ago

Hi @pankajb085 excellent work!

1

Nika Bibileishvili•280

@kikilo123Submitted 3 months ago

section de fonctionnalités à quatre cartes

2

k-hroma•150

@k-hromaPosted 3 months ago

Hi @kikilo123, your design is excellent. The CSS code is well structured and follows recommended practices such as the use of variables, accessible styles and a general reset. It has even helped me think about and improve the problem I had with mine!! Here are only some suggestions: For more reusable CSS variables you can define more variables in :root for things like margin sizes, padding, and breakpoints. This allows for better customization in the future. For more control over responsive design you can add another breakpoint por tablets.

0

breno belchior de freitas gomes•80

@belchiorgomesSubmitted 3 months ago

Componente de cartão de visualização do produto

1

k-hroma•150

@k-hromaPosted 3 months ago

Hi @belchiorgomes, your design looks really good. I can only suggest that you try using rem instead of px or em. Using rem makes the layout more flexible and accessible since it depends on the base font size. Using em is a little more complex because its layout depends on the parent container. It is not usually the best option when setting font sizes.

0

Lazaro Miranda•60

@mirndlazaroSubmitted 12 months ago

Responsive recipe page

#accessibility

1

k-hroma•150

@k-hromaPosted 3 months ago

Hi @mirndlazaro your CSS code is realy well structured and covers good practices. However, there is always room for improvements that can optimize design efficiency, clarity, and extensibility. Here are some suggestions:

Improved use of CSS variables: Sort variables by categories such as colors, typography, or spacing, and use comments to organize them.

Simplifying repeating styles: Some values like line-height: 24px; o border-radius: .6rem; appear several times. You can consider using global variables or classes to avoid redundancies.

Media query optimization: Mobile-first approach: Define basic styles for small screens first and then add specific rules for larger screens. Using relative units: Adjust dimensions in relative units such as em or rem instead of pixels within media queries. This ensures that the design is more flexible.

0

Stanabsolute•30

@StanabsoluteSubmitted 4 months ago

Social Links Profile

1

k-hroma•150

@k-hromaPosted 3 months ago

Hello @Stanabsolute! your design looks great! I ran into the same problem where there is a slight offset in parts of the text. In relation to the code, I understand that you uploaded the Qr component! However, I looked at it and it is really well structured. I think the only observation I would make would be to try using relative units like em, % and rem instead of absolute units like pixels (px). This has several advantages, especially for scalability and accessibility.

0