webhelp-responsive scroll content area only (not header, search, breadcrumbs)

shudson310
Posts: 89
Location: USA

webhelp-responsive scroll content area only (not header, search, breadcrumbs)

Thu Jan 26, 2017 10:41 pm

Is there an easy way to configure the webhelp-responsive output so that the header area (banner, search, breadcrumbs) are in a top frame that is ever-present, while allowing the content area to scroll?
Scott Hudson
Content Strategist
Jeppesen
Site: jeppesen.com
alin
Site Admin
Posts: 117

Re: webhelp-responsive scroll content area only (not header, search, breadcrumbs)

Fri Jan 27, 2017 6:28 pm

Hello,

There is no out-of-the-box setting that will enable that behavior. In order to achieve this functionality a solution is to use the "position:fixed" CSS property on the components you want to be always visible.
This procedure in our User Manual describes how to contribute the additional CSS to the WebHelp Responsive transformation scenario: https://www.oxygenxml.com/doc/versions/ ... n-css.html

I gave it a try using the Oxygen skin. You can start from this CSS snippet:

Code: Select all

.wh_header {
    position:fixed !important;
    top:0;
    width: 100%;
    z-index: 2;
}

.wh_search_input {
    position: fixed !important;
    top: 94px;
    width:100%;
    z-index: 2;
}

.container:nth-of-type(2) {
    margin-top: 240px;
}


Regards,
Alin
Alin Balasa
Software Developer
<oXygen/> XML Editor
http://www.oxygenxml.com
shudson310
Posts: 89
Location: USA

Re: webhelp-responsive scroll content area only (not header, search, breadcrumbs)

Fri Jan 27, 2017 8:15 pm

That gives me enough to work with! Thanks, Alin!
Scott Hudson
Content Strategist
Jeppesen
Site: jeppesen.com

Return to “DITA (Editing and Publishing DITA Content)”

Who is online

Users browsing this forum: No registered users and 5 guests