PDA

View Full Version : Anyone Know vB CSS?


Bubble #5
08-30-2013, 03:58 AM
I'm trying to find where to change the font color for the pop-up smilie window. Anyone know where I can find it?

Also, where can I change the size of the individual smilie boxes?

Spangle
08-30-2013, 07:21 AM
I'm trying to find where to change the font color for the pop-up smilie window. Anyone know where I can find it?

Also, where can I change the size of the individual smilie boxes?

That would be in your theme stylevars

ACP>Styles and Templates>Style Manager> Click on "Go" next to Style Variable editor for your theme, you are then presented with a list of those you can change on the left side.

Bubble #5
08-30-2013, 01:52 PM
Yes but which one in the list controls the popup smilie window? :confused:

Lynne
08-30-2013, 02:31 PM
You are talking about the text that says "Insert a Smilie"? Stylevar editor_popupbody_frame_color

I'd strongly suggest using something like firebug, for firefox, to find the CSS.

Spangle
08-30-2013, 02:43 PM
You are talking about the text that says "Insert a Smilie"? Stylevar editor_popupbody_frame_color

I'd strongly suggest using something like firebug, for firefox, to find the CSS.

The most up to date versions of Firefox you just need to right click on a page element and select "Inspect Element" from the menu.

Lynne
08-30-2013, 02:46 PM
The most up to date versions of Firefox you just need to right click on a page element and select "Inspect Element" from the menu.
I didn't know that was default - I thought it was my web developer add-on. :)

Bubble #5
08-30-2013, 03:00 PM
You are talking about the text that says "Insert a Smilie"? Stylevar editor_popupbody_frame_color

No, the actual smilie code below each smilie. See screenshot. The box is maroon and the text needs to be changed away from black.

I will see if I can figure out what Spangle was talking about. I do have a copy of firefox I could use.

Bubble #5
08-30-2013, 03:09 PM
The most up to date versions of Firefox you just need to right click on a page element and select "Inspect Element" from the menu.

When I do that it just says divlabel.

Spangle
08-30-2013, 03:43 PM
When I do that it just says divlabel.

yes but on the far right it should tell you which CSS sheet is controlling it

--------------- Added 1377885036 at 1377885036 ---------------

Link to the forum please

Bubble #5
08-30-2013, 04:17 PM
yes but on the far right it should tell you which CSS sheet is controlling it

There is a drop down menu far right. See screenshot. Unfortunately the forum is down today so that MarkB can work on some issues. Besides, I need to learn how to do this because there are other areas of the site that have this same exact issue.

Spangle
08-30-2013, 04:45 PM
There is a drop down menu far right. See screenshot. Unfortunately the forum is down today so that MarkB can work on some issues. Besides, I need to learn how to do this because there are other areas of the site that have this same exact issue.

Ah I see where you are now.

When you click on "Inspect Element" you should have a new panel open up in the bottom of the browser window, that is split into two panes, one shows you the origin HTML, the other on the right shows you any CSS that is overriding the HTML, if the CSS has a line through, that means that particular piece of CSS is overuled by another piece of CSS !

Welcome to the world of HTML and CSS !

Bubble #5
08-30-2013, 05:38 PM
Thanks Spangle for trying to help. Appreciate it.

If anyone knows where I can change this font color please post.

Bubble #5
08-30-2013, 08:39 PM
UPDATE:

Is this what you were talking about? I don't know how I got there, but I did not see anything about font color, just background color. And it doesn't say where it's located at.

tbworld
08-30-2013, 08:40 PM
If anyone knows where I can change this font color please post.


Maybe this will work: Add this to the end of your additional.css

Change color of font text below smilie

#smilies ul.smilielist li div.label {
color: red; /* your color here */
font-size: 11px;
}
Change box size of smilie

#smilies ul.smilielist li div.smilie {
background: none no-repeat scroll 0 0 #FFFFFF;
border-top: 1px solid #6B91AB;
height: 57px; /* box height */
width: 71px; /* box width */
overflow: hidden;
padding: 2px;
}

CAG CheechDogg
08-30-2013, 10:52 PM
Just add the following to your additional css file:


#smilies ul.smilielist li div.label {
color: #ffffff;
}


Oh snaps! Sorry tbworld, didn't see you already answered it.....