Frontend Mentor - QR code component solution

Esta es una solucion de QR code component challenge on Frontend Mentor.

Los desafíos de Frontend Mentor te ayudan a mejorar tus habilidades de programacion construyendo projectos realistas.

Tabla de contenidos

• Vista General
  • Screenshot
  • Links
• Mi Proceso
  • Hecho con
  • Lo que aprendí
  • Progreso continuo
  • Recursos Útiles
• Autor

Vista General

Screenshot

Links

• Live Site URL: Github Page

Mi Proceso

Hecho con

• HTML5
• CSS Nativo
• Flexbox
• Figma

Lo que aprendí

Para este pequeño projecto me decidí en aprender mas a fondo sobre CSS nativo. En este caso pobre distintas posibilidades de usar variables de CSS para distintos selectores, lo cual me permitió tener mas organizado el archivo style.css.

Aqui abajo les muestro un pequeño ejemplo de los descrito arriba:

.card {
  --mobMargin: 28%;
  margin-top: var(--mobMargin);
  margin-bottom: var(--mobMargin);
}

Progreso continuo

En el futuro quisiera continuar aprendiendo mas sobre Flexbox y tambien conocer un poco sobre CSS Grid.

Recursos Útiles

• CSS Variables - The var() Function - Esto me ayudo para entender de que manera se escriben las variables en CSS nativo.
• Using CSS custom properties (variables) - Esta pagina ahonda aun mas en la utilización de variables de CSS nativo.

Autor

• Website - Manuel Gago
• Frontend Mentor - @gagomanuel

Agradecimientos...