Questions: Custom template and nav structure

[welding11]

Apologies if this is the wrong place to ask this but I am attempting to implement the style guide myself, which may I add is great so far. I have a couple of questions which I am hoping you can clear up.

1. Creating a custom template appears to be relatively straightforward in that I have to use the template property in the options. I have copied over the templates that are originally used and am going to edit them, as far as the style guide styles, would removing the main style sheet and adding my own to the css that is copied over be sufficient? Or am I going about it the wrong way?

2. I would like to list the entire menu as a side nav but with child components as pages, not one long page with sections. For example:

   Overview
   - Introduction
   - Getting started
   - Design Principles
   

   I would like the three sub-nav items to be sectionsOf Overview but as links to their own page. I've not had too much experience with .hbs, how would I go about doing this?

   I know the below isn't correct but you can see what I mean

   /**
     * @section Design Principles
     * @sectionOf Overview
     * @page Design Principles
   **/
   
   /**
     * @section Getting Started
     * @sectionOf Overview
     * @page Getting Started
   **/
   
   /**
    * @page Overview
    */
   

[straker]

This is a great place to ask questions.

1. There's no wrong way to go about it, it just depends on what you're trying to do. For example, the FamilySearch Style Guide only uses a single custom handlebars template and just loads the styleguide css in the main page.

2. It's been awhile for me, so I'm not sure off the top of my head how to do this. Testing your example it looks like it generates the 3 separate pages and the top nav

So it seems that all you would need to do is style the top nav as a side nav and you'd be close to what you want.

[welding11]

I see, I have gone over the template again with some new found knowledge of the syntax and it all makes a lot more sense now. I didn't realise at first how the js/css was being inserted into the page with the use of partials. I can see how I can replace it all now.

As for the second part, I get what you are getting at and it could possibly work. What I had in mind was something like that but with a title section such as below:

Section A (not a page or link, simply a title)
- page 1
- page 2

Section B (not a page or link, simply a title)
- page 3
- page 4

A bit like

I think what you have suggested is a good start and I should be able to experiment. I can always manually do the nav in a partial. Will need to decide if it is worth the effort.