JSFiddle - React, Tailwind, and code Playground

by secretgspot

HTML

<script src="http://static.evernote.com/noteit.js"></script>
  <section id="btn_EVERNOTE">
    <h2>EVERNOTE</h2>
    <article>
      <h3>CLIP</h3>
      <a href="javascript:" onclick="Evernote.doClip({
      title: 'yoursite.com',
      url: 'http://yoursite.com/',
      code: 'myReferralCode',
      suggestNotebook: 'WEB Dev',
      suggestTags: 'JavaScript,HTML5,CSS',
      providerName: 'yoursite.com',
      styling: 'full' });return false">
        <img src="http://static.evernote.com/article-clipper.png" />
      </a>
    </article>
    <article>
      <h3>REMEMBER</h3>
      <a href="javascript:" onclick="Evernote.doClip({
      title: 'yoursite.com',
      url: 'http://yoursite.com/',
      code: 'myReferralCode',
      suggestNotebook: 'WEB Dev',
      suggestTags: 'JavaScript,HTML5,CSS',
      providerName: 'yoursite.com',
      styling: 'full' });return false">
        <img src="http://static.evernote.com/article-clipper-remember.png" />
      </a>
    </article>
      
    <article>
      <h3>Basic</h3>
      <a href="javascript:" onclick="Evernote.doClip({
      title: 'yoursite.com',
      url: 'http://yoursite.com/',
      code: 'myReferralCode',
      suggestNotebook: 'WEB Dev',
      suggestTags: 'JavaScript,HTML5,CSS',
      providerName: 'yoursite.com',
      styling: 'full' });return false">
        <img src="http://static.evernote.com/article-clipper-jp.png" />
      </a>
    </article>
      
    <article>
      <h3>German</h3>
      <a href="javascript:" onclick="Evernote.doClip({
      title: 'yoursite.com',
      url: 'http://yoursite.com/',
      code: 'myReferralCode',
      suggestNotebook: 'WEB Dev',
      suggestTags: 'JavaScript,HTML5,CSS',
      providerName: 'yoursite.com',
      styling: 'full' });return false">
        <img src="http://static.evernote.com/article-clipper-de.png" />
      </a>
    </article>
      
    <article>
      <h3>French</h3>
      <a href="javascript:" onclick="Evernote.doClip({
      title:...

CSS

h2{
  padding:0 0 5px 0;
  margin:0 0 5px 0;
  border-bottom:1px solid #ccc;
  font-size:23px;
  font-weight:bold;
}
h3{
  padding:0 0 5px 0;
  margin:0 0 5px 0;
  border-bottom:1px dashed #fff;
  font-size:13px;
  font-weight:bold;
}
article{
  display:inline-block;
  vertical-align:bottom;
  min-height:65px;
  -webkit-border-radius:5px;
  -moz-border-radius:5px;
  border-radius:5px;
  background:#ccc;
  padding:5px;
  margin: 0px 0px 5px 0px;
}