JSFiddle - React, Tailwind, and code Playground

by viktorb

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.0/normalize.min.css">
<script src="&lt;link href=&quot;https://fonts.googleapis.com/css?family=Roboto:400,500,700&quot; rel=&quot;stylesheet&quot;&gt;"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/material-design-icons/3.0.1/iconfont/material-icons.min.css">
<aside>
  <div class="logo"><svg width="144" height="35" viewBox="0 0 144 35" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><title>SothebysLogo</title><desc>Created using Figma</desc><g id="Canvas" transform="translate(1044 -18)"><g id="SothebysLogo"><g id="s"><use xlink:href="#path0_fill" transform="translate(-911.981 27.9675)" fill="#FFFFFF"/></g><g id="comma"><use xlink:href="#path1_fill" transform="translate(-918.234 25.489)" fill="#FFFFFF"/></g><g id="y"><use xlink:href="#path2_fill" transform="translate(-937.044 28.5509)" fill="#FFFFFF"/></g><g id="b"><use xlink:href="#path3_fill" transform="translate(-955.891 18)" fill="#FFFFFF"/></g><g id="e"><use xlink:href="#path4_fill" transform="translate(-972.404 27.9667)" fill="#FFFFFF"/></g><g id="h"><use xlink:href="#path5_fill" transform="translate(-993.299 18)" fill="#FFFFFF"/></g><g id="t"><use xlink:href="#path6_fill" transform="translate(-1006.63 23.8564)" fill="#FFFFFF"/></g><g id="o"><use xlink:href="#path7_fill" transform="translate(-1025.04 27.9667)" fill="#FFFFFF"/></g><g id="S"><use xlink:href="#path8_fill" transform="translate(-1044 21.2028)" fill="#FFFFFF"/></g></g></g><defs><path id="path0_fill" fill-rule="evenodd" d="M 5.44299 17.5699C 3.43618 17.5699 1.71642 17.2399 0.0359826 16.5856L -1.43337e-06 11.7844L 0.731428 11.7127C 2.70225 15.168 4.20109 16.4773 6.13676 16.4773C 7.85402 16.4773 8.91265 15.3864 8.91265 13.7137C 8.91265 11.821 6.97698 11.0943 4.89485 10.2576C 2.59346 9.27498 0.144776 8.18406 0.144776 5.16546C 0.144776 2.29187 2.70225 5.16557e-07 6.42882 5.16557e-07C 7.85234...

SCSS

html, body {
  font-family: 'Roboto', sans-serif;
  font-size: 14px;
  color: #333333;
}


aside {
  menu {
    width: 200px;
    margin: 0px;
    padding: 16px;
    background-color: #C4C4C4;
    menuitem {
      display: flex;
      align-items: center;
      margin-bottom: 16px;
      font-weight: 300;
      
        i {
          width: 32px;
          height: 32px;
          margin-right: 8px;
          border-radius: 50%;
          background-color: #A8A8A8;
        } 

    }
  }
}