Style the font name display, sample paragraphs and CSS code

[masakudamatsu]

These three elements are the most important feedback to the user.

We apply the linear light at the top and bottom of these elements.

The linear light is defined as:

  background: hsla(0, 0%, 100%, 0.9);
  box-shadow: 0 0 10px 0 hsla(0, 0%, 100%, 0.9),
    0 0 20px 0 hsla(0, 0%, 100%, 0.9), 0 0 40px 0 hsla(0, 0%, 100%, 0.9);
  height: 1px;
  width: 100%;

Previously, we tried the cove lighting effect: https://codepen.io/masakudamatsu/pen/wvKjLZY

• But this involves the complicated logic of the use of z-index.
• Light spills to the sides of a page; so the sliding page transition (#194 ) reveals it.