Mini-TOC style

[hoss]

Hi,
This is my first post here and i'm relatively new to Flare (have been using for 4 weeks).
I am creating HTML help output, and am trying to use mini-TOC as chapter index pages.
But, I am having similar problems to those i have seen in a few posts (no indent, some entries bold, no underline before visiting)
However the information in those posts and that on the built-in help refer to editing the MadCap|miniTOCProxy style class which i do not have in my stylesheet (we use a corporate stylesheet).
Can someone give me an idiots guide on how to import that Madcap style or create a mini-TOC style from scratch?

TIA

[NorthEast]

If you open any CSS file in Flare's stylesheet editor, the MadCap|miniTOCProxy should be listed (even if the style is not in the CSS file).

If it's not there, check that you're not filtering out styles in the editor: in the top left, make sure Show All Styles is selected, and that the Hide Inherited box is not ticked (as that hides styles that aren't in your stylesheet).

[hoss]

Ok, unchecking 'hide inherted' worked (also even then it doesnt show in the simple view).

Now, it contains no sub-items (excuse me if my terminology is not correct).
I assume i need to create one for each level of the TOC list?

[NorthEast]

Ok, unchecking 'hide inherted' worked (also even then it doesnt show in the simple view).

Now, it contains no sub-items (excuse me if my terminology is not correct).
I assume i need to create one for each level of the TOC list?

I'm not sure what contains no sub-items; are you talking about the style in the stylesheet editor, the mini-TOC in your HTML Help output..?


The MadCap|miniTocProxy style is the container for the mini-TOC; set its properties, e.g. mc-toc-depth to set the number of levels to display, margins and padding, borders, etc.

To format the items in a mini-TOC, use the styles p.MiniTOC1, etc.


And if the mini-TOC isn't appearing on the page:
- Check the topic (or master page) you're using includes the mini-TOC proxy.
- Check the topic is only included in the TOC once, and that it is a book topic containing other topics.

[hoss]

ah ok, thanks.
I told you i was new to this

[hoss]

ok, some progress but still some problems.
- I have edited the Madcap|MiniTOC style as required
- I have created MiniTOC1, 2 & 3 styles under <a>, and configured the indents i require for each 0, 20 & 40px, underline & colours for visited & non-visted links.

But, I have the problem that topic headings that have not been visited are in black and not indented or underlined. (clicking the lick and going back, the miniTOC topic is then indented & purple & underlined). And only the first level shows an underline when hovered.

Am i missing some part of the stylesheet settings?
Any ideas?

EDIT:
It seems that for the un-visited mini-TOC links, the style is being taken from p.MiniTOC1 and once visited from a.MiniTOC
Umm can someone explain that?!

[hoss]

Ok, problem solved.
Thats the way it is - The p.MiniTOCn style is used for unvisited links, and the a.MiniTOCn (that you must create) for visited links.
Bit strange, but now it works.

[NorthEast]

Ok, problem solved.
Thats the way it is - The p.MiniTOCn style is used for unvisited links, and the a.MiniTOCn (that you must create) for visited links.
Bit strange, but now it works.

What you're seeing are Flare's "default" styles.

Even if you have a completely blank stylesheet, Flare will automatically add some default styles; such as the black lines that appear on the breadcrumbs and mini-TOC, and the formatting of mini-TOC items. It adds these to a stylesheet in the output - Content/Skinsupport/MadCap.css.
It's a stupid way to do things, as it means you have to add styles to your stylesheet to counteract and override Flare's defaults.

Anyway, in MadCap.css it adds styles for a.MiniTOC1:link, a.MiniTOC2:link, etc.; and critically they have the properties color: black and text-decoration: none.
So as it's just for the :link pseudo class, that means unvisited links will appear black with no underline; but it will revert to your regular link styles once used.

So, to counteract this, I'd add these styles to your main stylesheet, with the colour to match your a:link properties; e.g.:

Code: Select all

a.MiniTOC1:link, 
a.MiniTOC2:link, 
a.MiniTOC3:link, 
a.MiniTOC4:link 
{
	color: #0000ff;
	text-decoration: underline;
}

I use a slightly different solution in my projects, I use the !important property to override any colours like this which Flare sets in its stylesheet. However, it's only suitable if you want all your links to use the same colour.

Code: Select all

a,
a:link,
a:visited
{
	color: #0000ff !important;
	text-decoration: none ;
}

a:hover,
a:focus
{
	color: #ff0000 !important;
	text-decoration: underline;
}