Text Styles

Implementing the Content Section
There are two aspect or "styles concerns" at play here: the alignment of the content, and the typography treatment.
๐Ÿ‘จโ€๐Ÿ’ผ Make the logo, h1 and paragraph look just like the mobile design in Figma.

Layout

๐Ÿจ Center the three elements horizontally and give their container a max-width of md.
๐Ÿฆ‰ The max-width container technically only becomes apparent at the md breakpoint on the design, but adding it here exposes subtle things about centering our text content, so we're adding it early.
๐Ÿ’ฐ You probably want to use ๐Ÿ“œ Grid or ๐Ÿ“œ Flexbox to achieve this centering.
๐Ÿ’ฐ You may still need to center the text-alignment itself with text-center.

Font size and spacing

๐Ÿจ Apply the correct font size, weight and spacing to the h1, based on Figma.
๐Ÿจ Apply the correct text color and decoration to the link, based on Figma.
Don't worry about the hover state for now. We'll take care of these later in the workshop, in the Interaction section.

Please set the playground first

Loading "Text Styles"
Loading "Text Styles"