Skip to content

Instantly share code, notes, and snippets.

@adeleinr
Created February 14, 2011 05:20
Show Gist options
  • Save adeleinr/825517 to your computer and use it in GitHub Desktop.
Save adeleinr/825517 to your computer and use it in GitHub Desktop.
Django Python Twitter + CSS
<div id="twitter-icon" class="span-2">
<a href="http://twitter.com/adeleinr"><img alt="adeleinr" src="http://a0.twimg.com/profile_images/1115342278/me2_normal.jpg"></a>
</div>
<div id="twitter" class="span-16 last">
<ul>
{% for message in messages %}
<li class="{% cycle 'even' 'odd' %}
{% if forloop.last %}
last-row
{% endif %}
{% if forloop.first %}
first-row
{% endif %}">
{{ message|safe|urlize }}
</li>
{% endfor %}
</ul>
<div>
################ CSS ########################
#twitter-icon{
padding-top: 0px;
margin-top: 39px;
text-align: right;
margin-right:0px;
}
#twitter{
margin-top: 10px;
}
#twitter a{
text-decoration: none;
}
#twitter ul{
font-family: verdana; !important
margin: 0px; !important
padding-left: -1,5em; !important
font-size: 12px;
}
#twitter ul li{
padding: 15px;
color: #B8B8B8;
list-style: none;
}
#twitter ul:before{
border-bottom:10px solid transparent;
border-right:10px solid #F0F0F0;
border-top:10px solid transparent;
content:"";
display:block;
font-size:14px;
left:-10px;
line-height:0;
margin:0;
position:relative;
top:43px;
width:0;
}
.first-row{
font-size: 18px;
-webkit-border-top-right-radius: 15px;
-webkit-border-top-left-radius: 15px;
-moz-border-radius-topright: 15px;
-moz-border-radius-topleft: 15px;
}
.last-row{
-webkit-border-bottom-right-radius: 15px;
-webkit-border-bottom-left-radius: 15px;
-moz-border-radius-bottomright: 15px;
-moz-border-radius-bottomleft: 15px;
}
.even{
background-color: #F0F0F0;
}
.odd{
background-color:#D5DFFF;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment