Wordpress Themes - WP Forum at BFA

Wordpress Themes - WP Forum at BFA (http://forum.bytesforall.com/index.php)
-   Plugins & Atahualpa (http://forum.bytesforall.com/forumdisplay.php?f=16)
-   -   [SOLVED] Xhanch Twitter Plugin: Styling for Atahualpa (http://forum.bytesforall.com/showthread.php?t=8632)

hlietz Jul 31, 2010 12:24 PM

[SOLVED] Xhanch Twitter Plugin: Styling for Atahualpa
 
Does anyone use the Xhanch Twitter Plugin and knows how to style it for Atahualpa?

The plugin offers the following code. But I don't know where to change to make it fit to Atahualpa. For example the text is too narrow and too close to the bars on the left side.

{xmt_id}.xmt hr{
height:1px;
width:100%;
color:#000000;
}

{xmt_id}.xmt .header_48{
height:48px;
line-height:48px;
vertical-align:middle
}

{xmt_id}.xmt .text_18{
font-size:18px
}

{xmt_id}.xmt .img_left{
float:left;
margin:0 5px 0 0;
border:none
}

{xmt_id}.xmt_list{
padding:0px;
margin:0px;
border:1px solid blue
}

{xmt_id}.xmt ul{
padding:0;
margin:0;
line-height:150%;
list-style:none;
}

{xmt_id}.xmt ul li.tweet_list{
font:inherit;
text-indent:0;
background: none;
padding:0;
margin:0;
display:block;
white-space: normal;
word-wrap: break-word;
color:inherit
}

{xmt_id}.xmt .tweet_date_gray{
font:inherit;
color:gray;
font-style:italic;
}

{xmt_id}.xmt .tweet_date_black{
font:inherit;
color:#000000;
font-style:italic
}

{xmt_id}.xmt .tweet_date_white{
font:inherit;
color:#ffffff;
font-style:italic
}

{xmt_id}.xmt .tweet_date_red{
font:inherit;
color:#ff0000;
font-style:italic
}

{xmt_id}.xmt ul li.tweet_list:before{
content:""
}

{xmt_id}.xmt .tweet_avatar{
float:left;
padding:4px 3px 3px 0;
width:48px;
height:48px;
border:none;
display:block
}

{xmt_id}.xmt .credit{
font-size:10px;
text-align:right;
}

{xmt_id}.xmt .credit a{
text-decoration:none;
font-size:10px
}

{xmt_id}.xmt .credit a:hover{
text-decoration:underline;
}

{xmt_id}.xmt .clear{
clear:both !important;
}

hlietz Aug 1, 2010 10:53 AM

1 Attachment(s)
Here's a screenshot how it looks without changing any CSS.
Obviously the text is too close to the "bars" on the left side (compared with all other plugins). And the space between the lines is too big ...
I tried some changes in the code above (see post 1). But with no success for the first problem. I'm sure it's an easy to solve problem for someone CSS doesn't look like Chinese (as it does for me) ...

lmilesw Aug 1, 2010 11:42 AM

The plugin may have it's own code you can change in the setting. Other than that you would have to determine the selector for the widget via Firebug or source code and use the appropriate CSS in ATO>Add HTML/CSS Inserts>CSS Inserts.

hlietz Aug 1, 2010 01:16 PM

The plugin does indeed have its own code (see first entry above). I just can't find the right place to change. Perhaps someone is able to "read" the posted code (I can't) and tell me which things (I think it must be some "margin" or "padding" (?) I have to change.

juggledad Aug 1, 2010 02:22 PM

What is the URL?

hlietz Aug 2, 2010 07:54 AM

http://dfl.dropforlife.org/

lmilesw Aug 2, 2010 08:09 AM

Try this in ATO>Add HTML/CSS Inserts>CSS Inserts
HTML Code:

div#xmt_dropforlife_wid ul li {padding-left:5px !important;}

hlietz Aug 2, 2010 08:48 AM

Thanks, Imilesw, that worked – and helped me find an even more elegant solution (directly in the plugin).
I changed the following code-snippet (marked red) in the plugin:
{xmt_id}.xmt ul li.tweet_list{
font:inherit;
text-indent:0;
background: none;
padding-left:5px;
margin:0;
display:block;
white-space: normal;
word-wrap: break-word;
color:inherit
}


All times are GMT -6. The time now is 02:49 PM.

Powered by vBulletin® Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.