JSFiddle - React, Tailwind, and code Playground

by Eugene Trounev

HTML

<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,700,700i" />
<script async type="text/javascript" src="https://lib.docsie.io/1.5.0/service.js" data-docsie="live_pk_nnNk8rdTpTF8LSd8ZLlkB8Fr:boo_FSq5DtCeDR6F233rM,navigation:false,viewportWidth:733px,sectionAnchor:false"></script>

SCSS

#DOCSIE__ROOT {
  color: #003462;
  font-size: 16px;
  font-family: "Open Sans", sans-serif;
  .docsie-doc .docsie-header {
    h1 {
      font-family: elevio-noto-sans, Helvetica, Arial, sans-serif;
      color: rgb(0, 52, 98);
      font-size: 28px;
      font-weight: 700;
      line-height: 1.2;
      margin-bottom: 25px;
      margin-top: 0;
    }
  }
  .docsie-doc .docsie-content {
    h2 {
      font-family: Montserrat, sans-serif;
      color: rgb(0, 52, 98);
      font-size: 24px;
      font-weight: 700;
    }

    h3 {
      font-family: Montserrat, sans-serif;
      color: rgb(0, 52, 98);
      font-size: 24px;
      font-weight: 700;
    }

    p {
      font-weight: 400;
      line-height: 1.8;
      margin-bottom: 30px;
    }

    a {
      color: rgb(74, 144, 226);
    }

    a:hover {
      color: rgb(74, 144, 226);
    }

    a:focus {
      color: rgb(74, 144, 226);
    }

    figure {
      text-align: left;
      margin: 30px 0;
      img {
        border-radius: 8px;
      }
    }
  }
}