@salesforcedevs/docs-components 1.3.242-dc-alpha1 → 1.3.242-dc-alpha3

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@salesforcedevs/docs-components",
-    "version": "1.3.242-dc-alpha1",
+    "version": "1.3.242-dc-alpha3",
     "description": "Docs Lightning web components for DSC",
     "license": "MIT",
     "main": "index.js",

package/src/modules/doc/amfReference/amfReference.html

@@ -19,6 +19,7 @@
         enable-slot-change="true"
         languages={languages}
         language={language}
+        show-footer={enableFooter}
     >
         <doc-phase
             slot="doc-phase"

package/src/modules/doc/amfReference/amfReference.ts

@@ -50,6 +50,7 @@ export default class AmfReference extends LightningElement {
     @api tocOptions?: string;
     @api languages!: OptionWithLink[];
     @api language!: string;
+    @api hideFooter = false;
     @track navigation = [] as NavigationItem[];
     @track versions: Array<ReferenceVersion> = [];
     @track showVersionBanner = false;
@@ -184,6 +185,10 @@ export default class AmfReference extends LightningElement {
         this._coveoAdvancedQueryConfig = toJson(config);
     }
 
+    private get enableFooter(): boolean {
+        return !this.hideFooter;
+    }
+
     // model
     protected _amfConfigList: AmfConfig[] = [];
     protected _amfConfigMap: Map<string, AmfConfig> = new Map();

package/src/modules/doc/contentLayout/contentLayout.html

@@ -56,7 +56,7 @@
                     ></dx-toc>
                 </div>
             </div>
-            <div class="footer-container">
+            <div lwc:if={showFooter} class="footer-container">
                 <dx-footer variant="no-signup"></dx-footer>
             </div>
         </div>

package/src/modules/doc/contentLayout/contentLayout.ts

@@ -42,6 +42,9 @@ export default class ContentLayout extends LightningElement {
     @api bailHref!: string;
     @api bailLabel!: string;
 
+    // This is needed for now to prevent failing snapshot tests due to links in the footer
+    @api showFooter = false;
+
     @api
     get breadcrumbs() {
         return this._breadcrumbs;

package/src/modules/doc/header/header.css

@@ -6,15 +6,22 @@ dx-logo {
 
 .dev-center-link {
     display: inline-block;
-    margin-left: var(--dx-g-global-header-padding-horizontal);
-    height: 20px;
+    padding: var(--dx-g-spacing-smd) var(--dx-g-spacing-lg) 0
+        var(--dx-g-global-header-padding-horizontal);
+    height: var(--dx-g-spacing-xl);
 }
 
 .dev-center-content {
-    display: flex; /* This makes the anchor element a flex container */
-    align-items: center; /* This centers the content vertically */
-    text-decoration: none; /* Remove underline from the anchor element */
+    display: flex;
+    align-items: center;
+    text-decoration: none;
     color: inherit;
+    font-weight: var(--dx-g-font-bold);
+}
+
+dx-icon {
+    --dx-c-icon-size: var(--dx-g-icon-size-xs);
+    --dx-c-icon-color: var(--dx-g-blue-vibrant-20);
 }
 
 .dev-center-content > * + * {
@@ -26,6 +33,10 @@ dx-logo {
     height: var(--dx-g-doc-header-main-nav-height);
 }
 
+.has-brand .header_l2 {
+    height: var(--dx-g-spacing-3xl);
+}
+
 .nav_menu-button {
     --dx-c-button-primary-color: var(--dx-g-blue-vibrant-20);
     --dx-c-button-secondary-color-hover: var(
@@ -57,7 +68,7 @@ header:not(.has-brand) > .header_l2 {
 }
 
 .has-brand .header_l2_group-title {
-    padding: var(--dx-g-spacing-smd) var(--dx-g-spacing-xl)
+    padding: var(--dx-g-spacing-sm) var(--dx-g-spacing-xl)
         calc(var(--dx-g-spacing-smd) - 1px) 0;
     min-width: 320px;
 }

package/src/modules/doc/header/header.html

@@ -1,34 +1,29 @@
 <template>
     <template lwc:if={shouldRender}>
-        <div lwc:if={devCenter} class="dev-center-link">
-            <a href={devCenter.link} class="dev-center-content">
-                <dx-icon symbol="back" size="small"></dx-icon>
-                <dx-icon
-                    class="brand-icon"
-                    lwc:if={devCenter.icon}
-                    sprite="salesforcebrand"
-                    symbol={brand}
-                    size="small"
-                ></dx-icon>
-                <span>{devCenter.title}</span>
-            </a>
-        </div>
         <dx-brand-theme-provider brand={brand}>
             <header class={className}>
                 <dx-banner
                     lwc:if={showBanner}
                     banner-markup={bannerMarkup}
                 ></dx-banner>
+                <div lwc:if={devCenter} class="dev-center-link">
+                    <a href={devCenter.link} class="dev-center-content">
+                        <dx-icon symbol="back"></dx-icon>
+                        <dx-icon
+                            class="brand-icon"
+                            lwc:if={devCenter.icon}
+                            sprite="salesforcebrand"
+                            symbol={brand}
+                            size="large"
+                        ></dx-icon>
+                        <span class="subtitle dx-text-body-4">
+                            {devCenter.title}
+                        </span>
+                    </a>
+                </div>
                 <div class="header_l2">
                     <div class="header_l2_group header_l2_group-title">
                         <a href={headerHref} class="home-link">
-                            <dx-icon
-                                class="brand-icon"
-                                lwc:if={isValidBrand}
-                                sprite="salesforcebrand"
-                                symbol={brand}
-                                size="large"
-                            ></dx-icon>
                             <span class="subtitle dx-text-display-7">
                                 {subtitle}
                             </span>

package/src/modules/doc/header/header.ts

@@ -27,7 +27,6 @@ export default class Header extends HeaderBase {
 
     set devCenter(value) {
         this._devCenter = toJson(value);
-        console.log(this._devCenter);
     }
 
     private _scopedNavItems!: OptionWithNested[];

package/src/modules/doc/xmlContent/xmlContent.html

@@ -17,6 +17,7 @@
         language={sidebarFooterContent.language}
         bail-href={sidebarFooterContent.bailHref}
         bail-label={sidebarFooterContent.bailLabel}
+        show-footer={enableFooter}
     >
         <doc-phase
             slot="version-banner"

package/src/modules/doc/xmlContent/xmlContent.ts

@@ -44,6 +44,7 @@ export default class DocXmlContent extends LightningElementWithState<{
     @api coveoPublicAccessToken!: string;
     @api coveoAnalyticsToken!: string;
     @api coveoSearchHub!: string;
+    @api hideFooter = false;
 
     @api
     get allLanguages(): Array<Language> {
@@ -84,6 +85,10 @@ export default class DocXmlContent extends LightningElementWithState<{
     private latestVersion = false;
     private previewVersion = false;
 
+    private get enableFooter(): boolean {
+        return !this.hideFooter;
+    }
+
     private searchSyncer = new SearchSyncer({
         callbacks: {
             onSearchChange: (nextSearchString: string): void => {