JSFiddle - React, Tailwind, and code Playground

by JamesKyle

HTML

<link rel="stylesheet" href="https://s3.amazonaws.com/cdn.thejameskyle.com/normalize.css">
<header>
<h1>CoachUp</h1>

</header>
<article>
    
    
</article>
<footer>
    
    
</footer>

SCSS

/* COLORS */
$dark: #252525;
$white: #FEFEFE;

/* FONTS */
$font-size: 14px;
$line-height: 21px;
$font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
$font-weight: 300;
@mixin font { font-family: $font-family; font-weight: $font-weight; font-size: 1em; line-height: $line-height/$font-size*1em; }
html {font-size: $font-size/16px*100%}

/* CSS RULES */

body {
    
}

header {
    padding: 40px 45px;
    
    background: $dark;
    color: $white;
    @include font;
}