@salesforcedevs/docs-components 1.18.5-alpha → 1.18.5-layoutfix-alpha1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +2 -7
- package/src/modules/doc/lwcContentLayout/lwcContentLayout.css +20 -0
- package/src/modules/doc/lwcContentLayout/lwcContentLayout.html +3 -3
- package/src/modules/doc/lwcContentLayout/lwcContentLayout.ts +13 -0
- package/src/modules/docHelpers/contentLayoutStyle/contentLayoutStyle.css +1 -2
package/package.json
CHANGED
|
@@ -1,16 +1,11 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@salesforcedevs/docs-components",
|
|
3
|
-
"version": "1.18.5-
|
|
3
|
+
"version": "1.18.5-layoutfix-alpha1",
|
|
4
4
|
"description": "Docs Lightning web components for DSC",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"main": "index.js",
|
|
7
7
|
"engines": {
|
|
8
|
-
"node": "20.x"
|
|
9
|
-
"yarn": "1.22.19"
|
|
10
|
-
},
|
|
11
|
-
"volta": {
|
|
12
|
-
"node": "20.18.2",
|
|
13
|
-
"yarn": "1.22.19"
|
|
8
|
+
"node": "20.x"
|
|
14
9
|
},
|
|
15
10
|
"publishConfig": {
|
|
16
11
|
"access": "public"
|
|
@@ -1 +1,21 @@
|
|
|
1
1
|
@import "docHelpers/contentLayoutStyle";
|
|
2
|
+
|
|
3
|
+
.lwc-content-body-container {
|
|
4
|
+
display: flex;
|
|
5
|
+
justify-content: center;
|
|
6
|
+
max-width: var(--dx-g-doc-content-max-width);
|
|
7
|
+
|
|
8
|
+
/* Derived this manually by substracting (topHeader, doc header, banner and the content). */
|
|
9
|
+
min-height: 62vh;
|
|
10
|
+
margin: auto;
|
|
11
|
+
padding: 0 var(--dx-g-global-header-padding-horizontal);
|
|
12
|
+
margin-bottom: calc(2 * (var(--dx-g-spacing-5xl) + 4px));
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.fixed-right-nav-bar {
|
|
16
|
+
width: 180px;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.content-body-no-rnb {
|
|
20
|
+
max-width: 1220px;
|
|
21
|
+
}
|
|
@@ -18,8 +18,8 @@
|
|
|
18
18
|
<div class="content-body-doc-phase-container">
|
|
19
19
|
<slot name="doc-phase"></slot>
|
|
20
20
|
<slot name="version-banner"></slot>
|
|
21
|
-
<div class="content-body-container">
|
|
22
|
-
<div class=
|
|
21
|
+
<div class="lwc-content-body-container">
|
|
22
|
+
<div class={contentBodyClasses}>
|
|
23
23
|
<doc-breadcrumbs
|
|
24
24
|
lwc:if={showBreadcrumbs}
|
|
25
25
|
breadcrumbs={breadcrumbs}
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
lwc:if={shouldDisplayFeedback}
|
|
30
30
|
></doc-sprig-survey>
|
|
31
31
|
</div>
|
|
32
|
-
<div lwc:if={showToc} class=
|
|
32
|
+
<div lwc:if={showToc} class={rightNavBarClasses}>
|
|
33
33
|
<dx-toc
|
|
34
34
|
header={tocTitle}
|
|
35
35
|
options={tocOptions}
|
|
@@ -23,6 +23,19 @@ export default class LwcContentLayout extends ContentLayout {
|
|
|
23
23
|
return this.rnbByTab;
|
|
24
24
|
}
|
|
25
25
|
|
|
26
|
+
get rightNavBarClasses() {
|
|
27
|
+
const baseClasses = "right-nav-bar is-sticky";
|
|
28
|
+
return this.showTabBasedRNB
|
|
29
|
+
? `${baseClasses} fixed-right-nav-bar`
|
|
30
|
+
: baseClasses;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
get contentBodyClasses() {
|
|
34
|
+
return this.showToc
|
|
35
|
+
? "content-body"
|
|
36
|
+
: "content-body content-body-no-rnb";
|
|
37
|
+
}
|
|
38
|
+
|
|
26
39
|
/**
|
|
27
40
|
* Check if the main slot contains doc-specification-content
|
|
28
41
|
* Uses caching to avoid repeated DOM queries
|
|
@@ -74,7 +74,7 @@ dx-toc {
|
|
|
74
74
|
|
|
75
75
|
.content-body {
|
|
76
76
|
margin: var(--dx-g-spacing-md) 0 0;
|
|
77
|
-
max-width:
|
|
77
|
+
max-width: 1000px;
|
|
78
78
|
flex: 1;
|
|
79
79
|
width: 0;
|
|
80
80
|
}
|
|
@@ -116,7 +116,6 @@ dx-toc {
|
|
|
116
116
|
|
|
117
117
|
.content-body-container {
|
|
118
118
|
padding-right: 0;
|
|
119
|
-
padding-left: 0;
|
|
120
119
|
overflow-x: auto;
|
|
121
120
|
margin-bottom: calc(var(--dx-g-spacing-5xl) + 4px);
|
|
122
121
|
}
|