Learnt how to change size of text for mobile devices without using media queries
Latest solutions
Latest comments
- P@troy71What are you most proud of, and what would you do differently next time?@croscob3
HTML semântico: A estrutura está clara e bem definida. Você usou elementos como <p>, <a>, e <button> corretamente.
Fonte customizada: O uso do Google Fonts foi bem implementado.
Hover e responsividade: Adicionar hover na mini-heading melhora a experiência do usuário, e o uso de clamp() foi excelente para responsividade.
Estilo consistente: O design respeita o desafio proposto, com sombras, cores e espaçamento coerentes com o modelo.
- @Elisee7What are you most proud of, and what would you do differently next time?
I’m proud of the following:
- Using reusable classes
- Hosting my solution online
- Working with a design system
- Editing the README.md file
Challenges that I encountered
Working with a Design System
I overcome it by understanding how the design system works and how to translate them in CSS.
Flexbox
I found without
display:flex;
,justify-content
andalign-Items
do not work.Editing in markdown
It was my first time working with Markdown, so the editing process was a bit challenging at first.
@croscob3- Uso de HTML semântico O código usa corretamente a estrutura básica do HTML5 (<!DOCTYPE html>, <html>, <head>, <body>).
Elementos como <h1> e <p> são bem utilizados para conteúdo textual.
- Boa estrutura e legibilidade As classes estão bem organizadas com nomes claros.
As regras CSS seguem um padrão consistente de nomenclatura (ex: margin-top-300, text-preset-1).
O uso de display: flex para centralização está bem aplicado. 3. Estilo visual A combinação de cores (com tons de cinza e branco) está suave e alinhada com o desafio do QR Code.
Tipografia com a fonte “Outfit” dá um toque moderno.