Hi all,
I have a Help system using the HTML5 Tripane Light skin. I can't find where to define the glossary text style. The glossary term looks good (right size, font & color) but the definition is all wrong; the text is a dull grey and difficult to read (especially on a dark background, which I cannot change) and the space between lines is huge (see attachment).
(The screenshot is taken form the skin definitions but it looks the same in the generated output)
Does anyone know where I can define the glossary definition style? Nothing I do in the CSS file or the skin seems to make a difference.
Any help would be appreciated, thanks!
Ben
Glossary style issue
Glossary style issue
You do not have the required permissions to view the files attached to this post.
Re: Glossary style issue
Hi Ben - For the definition text color, right click on the skin file and select Open With > Internal Text Editor.
Way past the mess of jumbled code is a setting called Navigation Panel Item Definition (Ctrl + F is useful here). It should have a color property with a hex color code for the color. Change that to whatever you what - #ffffff is white, for example. Save it and close the tab. I don't think the Skin Editor preview area will show the color change, but when you do your output it should work. Not sure why this isn't an option in the Skin Editor, but sneaking into the code works in this case.
For the spacing on the definition, try this first: Back in the regular Skin Editor, go to the Styles tab, then under Navigation Panel Item > Block, adjust the Line Height. In your case, make it smaller. The only problem is that this will impact everything in the left pane. So your Table of Contents items, the Glossary terms, Index terms, etc. will all change their spacing. But if that's okay and you can find a value that works for everything, you're good to go.
If you really need to change just the Glossary definition and want to get a little more involved, you might want to try Dave Lee's method here: viewtopic.php?f=9&t=17175#p90939. Basically, it shows how to make your own CSS file for the skin to make adjustments that aren't available in the skin editor. I use it and it's like my favorite thing ever. If you go that route, you can also use that new CSS file you'll be making to change the definition color instead of hacking the skin file.
If you do end up doing this and need help with the CSS code, let me know and I'll be happy to help you out. Let me know how it goes!
Way past the mess of jumbled code is a setting called Navigation Panel Item Definition (Ctrl + F is useful here). It should have a color property with a hex color code for the color. Change that to whatever you what - #ffffff is white, for example. Save it and close the tab. I don't think the Skin Editor preview area will show the color change, but when you do your output it should work. Not sure why this isn't an option in the Skin Editor, but sneaking into the code works in this case.
For the spacing on the definition, try this first: Back in the regular Skin Editor, go to the Styles tab, then under Navigation Panel Item > Block, adjust the Line Height. In your case, make it smaller. The only problem is that this will impact everything in the left pane. So your Table of Contents items, the Glossary terms, Index terms, etc. will all change their spacing. But if that's okay and you can find a value that works for everything, you're good to go.
If you really need to change just the Glossary definition and want to get a little more involved, you might want to try Dave Lee's method here: viewtopic.php?f=9&t=17175#p90939. Basically, it shows how to make your own CSS file for the skin to make adjustments that aren't available in the skin editor. I use it and it's like my favorite thing ever. If you go that route, you can also use that new CSS file you'll be making to change the definition color instead of hacking the skin file.
If you do end up doing this and need help with the CSS code, let me know and I'll be happy to help you out. Let me know how it goes!
You do not have the required permissions to view the files attached to this post.
Re: Glossary style issue
Hi Dave,
There was no "Navigation Panel Item Definition" there, just a few other Navigation Panel Items, so I added one (copied the "Navigation Panel Item (hover)" and edited it)
I had a few problems initially, it didn't seem to work but that turned out to be a result of the source control (had to commit and push the changes for them to take effect).
It looks much better now, thanks!
Thanks,
Ben
There was no "Navigation Panel Item Definition" there, just a few other Navigation Panel Items, so I added one (copied the "Navigation Panel Item (hover)" and edited it)
I had a few problems initially, it didn't seem to work but that turned out to be a result of the source control (had to commit and push the changes for them to take effect).
It looks much better now, thanks!
Thanks,
Ben