diff --git a/src/app/pages/component-viewer/component-viewer.scss b/src/app/pages/component-viewer/component-viewer.scss index 996590b46..6c3cc181f 100644 --- a/src/app/pages/component-viewer/component-viewer.scss +++ b/src/app/pages/component-viewer/component-viewer.scss @@ -40,6 +40,7 @@ app-component-viewer { table-of-contents { top: 35px; + position: sticky; // Reposition on top of content on small screens and remove // sticky positioning diff --git a/src/app/pages/guide-viewer/guide-viewer.scss b/src/app/pages/guide-viewer/guide-viewer.scss index 4003a4f92..5fe28ea70 100644 --- a/src/app/pages/guide-viewer/guide-viewer.scss +++ b/src/app/pages/guide-viewer/guide-viewer.scss @@ -46,6 +46,7 @@ $guide-content-margin-side-xs: 15px; table-of-contents { top: 35px; + position: sticky; // Reposition on top of content on small screens and remove // sticky positioning diff --git a/src/app/shared/doc-viewer/header-link.ts b/src/app/shared/doc-viewer/header-link.ts index 65a53cb57..e39abbb18 100644 --- a/src/app/shared/doc-viewer/header-link.ts +++ b/src/app/shared/doc-viewer/header-link.ts @@ -20,7 +20,7 @@ import {Router} from '@angular/router'; link diff --git a/src/app/shared/table-of-contents/table-of-contents.scss b/src/app/shared/table-of-contents/table-of-contents.scss index cc0f829b6..b7092dbdf 100644 --- a/src/app/shared/table-of-contents/table-of-contents.scss +++ b/src/app/shared/table-of-contents/table-of-contents.scss @@ -1,20 +1,15 @@ :host { font-size: 13px; - width: 19%; - position: sticky; - top: 0; padding-left: 20px; box-sizing: border-box; } .docs-toc-container { + box-sizing: border-box; padding: 5px 0 10px 12px; - width: 100%; } .docs-toc-heading { - margin: 0; - padding: 0; font-size: 13px; font-weight: bold; } @@ -26,7 +21,6 @@ a { text-decoration: none; display: block; text-overflow: ellipsis; - width: 100%; overflow: hidden; }