gfranko / jquery.tocify.js

A jQuery Table of Contents plugin that can be themed with Twitter Bootstrap or jQueryUI.
http://gregfranko.com/jquery.tocify.js/
MIT License
928 stars 216 forks source link

CSS for depth #72

Closed jonathan-s closed 9 years ago

jonathan-s commented 9 years ago

You can choose to have a deeper nested structure. The default is currently two levels deep. But what I feel is missing so to be able to style the different levels depending on how deep they are. So it would be nice to have tocify to add classes for the different depth levels.

mubaidr commented 9 years ago

Yup, seems nice suggestion. Adding different styles to different levels should be possible.

But i think that could be achieved regardless of nested architecture. Plug-in should have options to specify custom classes for different levels.

jonathan-s commented 9 years ago

At the moment I figured it that you could do it this way > https://github.com/tripit/slate/wiki/Deeper-Nesting But adding classes for depth would be more intuitive I think.

sman591 commented 9 years ago

I solved this by separating the nav-indent and nav-padding:

ul.tocify-subheader {
   margin-left: $nav-indent;
}
.tocify-subheader .tocify-item>a {
   padding-left: $nav-padding;
}
$("#toc").tocify({
   selectors: 'h1, h2, h3',
...