Frontend Mentor - Single price grid component solution

Esta é a minha solução do desafio "Single price grid component". O desafio consiste em criar um componente de grid que se adeque a diferente tamanhos de tela e que tenha responsividade no botão.

Link para a solução

Table of contents

• Overview
  • Desafio
  • Screenshots
  • Gifs
• Desenvolvimento
  • Tecnologias usadas
  • Aprendizados
• Contato

Overview

Desafio

Os usuários devem ser capazes de:

• Ver o layout que mais se adeque ao tamanho de sua tela
• Ver um efeito de hover sobre o botão Sign Up

Screenshots

Layout mobile

Layout em 1024x768

Layout em 1440x900

Gifs

Efeito de hover

Desenvolvimento

Para desenvolver este desafio eu usei o SASS pela primeira vez e já vi o quanto é poderoso.

Tecnologias usadas

• HTML5
• SASS
• CSS
• Flexbox
• CSS Grid
• Mobile-first

Aprendizados

• SASS
• Metodologia modular do Sass
• CSS display grid
• Problemas que podem ocorrer com o overflow do display grid

Contato

• Portfólio - Matheus Santos
• Frontend Mentor - @matheusg18
• Linkedin - @matheusg18