Skip to main content
JoeJitsu
Known Participant
June 16, 2016
Answered

Modify default TOC pane width in HTML5?

  • June 16, 2016
  • 1 reply
  • 1559 views

Is there a way to edit css file so that my default desktop TOC/Search pane width is a little wider?  I've tried editing several elements in CSS, but to no avail.

Thanks in advance!

This topic has been closed for replies.
Correct answer Willam van Weelden

The best way to do this is through the SCSS files and compile the CSS file from that. There are many different elements that use the sidebar width for correct positioning.

In the SCSS files, you find the variables:

$sidebar-width

$sidebar-width-landscape

$sidebar-width-desktop

By updating these in the SCSS, the sidebar will be shown correctly. You can get the SCSS files (and instructions) here: https://helpx.adobe.com/robohelp/robohelp-screen-profiles-layouts.html

1 reply

Jeff_Coatsworth
Community Expert
Community Expert
June 16, 2016

You might try having a look at this thread - https://forums.adobe.com/message/2007076#2007076 – to get some ideas…

JoeJitsu
JoeJitsuAuthor
Known Participant
June 16, 2016

Thanks Jeff...that one is specific to WebHelp, whereas I'm looking to edit CSS for Responsive HTML. I watched Willam van Weelden​'s webinar on the topic, which is for RH11.

RH2015 seems to have additional elements that need to be modified, as modifying only the sidebar width and main topic pane width doesn't do the trick. The show/hide sidebar icon doesn't shift with the sidebar itself, for example.  It's not a 1 to 1 match, so I was wondering if anyone has actually done this for RH2015 and if so, exactly which elements get changed?

Willam van Weelden
Willam van WeeldenCorrect answer
Inspiring
June 23, 2016

The best way to do this is through the SCSS files and compile the CSS file from that. There are many different elements that use the sidebar width for correct positioning.

In the SCSS files, you find the variables:

$sidebar-width

$sidebar-width-landscape

$sidebar-width-desktop

By updating these in the SCSS, the sidebar will be shown correctly. You can get the SCSS files (and instructions) here: https://helpx.adobe.com/robohelp/robohelp-screen-profiles-layouts.html