JSFiddle - React, Tailwind, and code Playground

by jgrumpers

HTML

<section class="grid">
        <h1 class="verticaltext purple">
            I'm Disoriented.
        </h1>
        <div class="content">
          <div>Hello,</div>
          <div>I hope you have</div>
          <div>a wonderful day.</div>
          <div>I will too!</div>
        </div>
	</section>

CSS

.verticaltext {
  writing-mode: vertical-rl;
  text-align: center;
}

.purple {
  color: #B10DC9;
}

.grid{
    display: grid;
    grid-template-columns: 1fr 4fr;
}
.content {
	display: flex;
  flex-direction: column;
  justify-content: space-evenly;
}