ASP.NET Core 3 and React

Styling the HomePage component

It's time to style the HomePage component. Follow these steps to do so:

1. As usual, we start by importing the functions from Emotion and removing the React import from HomePage.tsx:

/** @jsx jsx */import { css, jsx } from '@emotion/core';

2. Let's style the container element in the HomePage component by placing the page content in the center of the screen:

export const HomePage = () => (  <div    css={css`      margin: 50px auto 20px auto;      padding: 30px 20px;      max-width: 600px;    `}  >    <div>      <h2>Unanswered Questions</h2>      <button>Ask a question</button>    </div>  </div>);

3. Next, we will style the div that wraps the page title and Ask a question button:

<div  css={css`    margin: 50px auto 20px auto;    padding: 30px 20px; max-width: ...