JSFiddle - React, Tailwind, and code Playground
by OwenMelbz
HTML
<div id="tweetcontainer"></div>
<script type="text/javascript">
var url = 'http://pipes.yahoo.com/pipes/pipe.run?_id=1d3dbc55c0c81c1e7f3d587606d8010b&_render=json';
$.getJSON(url, function(json) {
$.each(json.value.items, function(i, tweet) {
var avatar = tweet['media:content'].url;
var datweet = tweet['y:title'];
datweet = datweet.replace('talk_design:','We Said: ');
$('#tweetcontainer').prepend('<div style="background-image: url('+avatar+');">'+datweet+'</div>');
});
});
</script>
CSS
#tweetcontainer div {margin-bottom: 10px;background-size: 16px 16px;background-repeat: no-repeat; text-indent:20px;}
#tweetcontainer div:hover {background-color:#3bb8eb;}
#tweetcontainer div img {padding-top: 10px;}