JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://raw.github.com/seaofclouds/tweet/master/tweet/jquery.tweet.js"></script>
<div class="tweet"></div>
<p style="float: right;">More from <a href="http://twitter.com/#!/mgifford/dgd7">DGD7</a></p>
CSS
.tweet,
.query {
font: 120% Georgia, serif;
color: #085258;
}
.tweet_list {
-webkit-border-radius: 0.5em;
-moz-border-radius: 0.5em;
border-radius: 0.5em;
list-style: none;
margin: 0;
padding: 0;
overflow-y: hidden;
background-color: #8ADEE2;
}
.tweet_list .awesome,
.tweet_list .epic {
text-transform: uppercase;
}
.tweet_list li {
overflow-y: auto;
overflow-x: hidden;
padding: 0.5em;
}
.tweet_list li a {
color: #0C717A;
}
.tweet_list .tweet_even {
background-color: #91E5E7;
}
.tweet_list .tweet_avatar {
padding-right: .5em; float: left;
}
.tweet_list .tweet_avatar img {
vertical-align: middle;
}
JavaScript
(function($) {
$(function(){
$(".tweet").tweet({
avatar_size: 32,
count: 15,
username: "mgifford",
list: "DGD7",
loading_text: "loading tweets..."
});
});
})(jQuery);