× Joomla Facebook Connect support forum

Topic-icon Is there any CSS file for JFB login Module ?

Active Subscriptions:

None
14 years 7 months ago #14460 by Mano
Hi!

I'm trying to work on the JFB login module design but I can't find the CSS files.
Any idea?

Thanks.
The topic has been locked.
Support Specialist
14 years 7 months ago #14464 by alzander
Mano,
There isn't a CSS file distributed with the JFBCLogin module. There are classes and ids on most parts of the contents of whats displayed, but the default styling takes on the basic look of your template, and works for most users. If you need additional styling, you should add it to your templates CSS file.

Hope that helps,
Alex
The topic has been locked.
Active Subscriptions:

None
14 years 7 months ago #14578 by Mano
Hi,

I'm trying to change the following CSS line:
.fb_button_text_rtl, .fb_button_medium_rtl .fb_button_text {margin-left: 22px;}
By adding new CSS rule but it doesn't help:
.fb_button_text_rtl, .fb_button_medium_rtl .fb_button_text {margin-right:22px!important;}

The CSS code which in the module is not changing.

You can have a look on at the login module on the left side of the website: tinyurl.com/3wfqmc9

Any suggestions?

Thanks.
The topic has been locked.
Support Specialist
14 years 7 months ago #14592 by alzander
I'm assuming you're trying to get the button to show on one line? Using the Chrome debug tools, if I change the margin-right to 0px (instead of 22px), that seems to work well for me. Try that, as it does look like you should be able to override that style.

If it doesn't work, let me know where you're adding the CSS style so that we can check some things out.

Thanks,
Alex
The topic has been locked.
Active Subscriptions:

None
14 years 7 months ago #14598 by Mano
Yes, this is what I'm trying to do. one line.
If I change margin-right to 0px then it became one line but I lose the Facebook icon.
File Attachment:


Please note that this is a RTL website and maybe the module built in RTL css is wrong somehow.

Any other suggestion ?

Thanks.
The topic has been locked.
Support Specialist
14 years 7 months ago #14604 by alzander
What browser are you using? I'm using Chrome, and with the margin set to 0px, everything looks right to me. I'm not sure why the fb icon is on the left side of the button for you, but it's properly on the right side for me:
File Attachment:


Thanks,
Alex
The topic has been locked.
Active Subscriptions:

None
14 years 7 months ago #14609 by Mano
Hi,

I made the change into template.css (line 1334), but I can't see any change.
.fb_button_text_rtl, .fb_button_medium_rtl .fb_button_text { margin-right: 0 !important;}
I cleared cache and checked with Chrom, FF and IE. It's still look like:
File Attachment:


Thanks.
The topic has been locked.
Support Specialist
14 years 7 months ago #14650 by alzander
Mano,
I finally got a browser to show what you're seeing. Not sure what's different today. The problem looks to be a Facebook styling issue. Basically, the 'f' is in an image on the right side of the button. The text is covering it up though, and simply needs to be shifted to the left. However, I can't seem to get a good style to fix it.

I'll keep look into it, but let us know if you find anything out as well.

Thanks,
Alex
The topic has been locked.