JSFiddle - React, Tailwind, and code Playground

by andydavies

HTML

<br>
<a href="http://www.youtube.com/watch?v=9sSc5ZPK7P8" data-type="media" data-duration="12:02">Rugby World Cup Highlights</a>
<br>
<br>
<a href="http://" data-type="chat" data-duration="123">Article with lots of comments</a>
<br>

CSS

a {
  font-family: sans-serif; 
  padding: 0.5em;
}

a[data-type$="media"]:after {
  content: " >" attr(data-duration);
/*  font-size:x-small; */
/*  vertical-align:top;*/
  font-family: sparkicons;
} 

a[data-type$="chat"]:after {
  content: " =" attr(data-duration);
  font-size:x-small; 
  vertical-align:top;
  font-family: sparkicons;
} 


@font-face {
    font-family: "sparkicons";
    src:...