fix: remove extra top margin in the toc when there is no message block

src/helpers/isMessageBlockDisplayed.js

@@ -0,0 +1,8 @@
+'use strict'
+
+module.exports = (page) => {
+  // To keep in sync with the message blocks that are supported (see partials/toolbar.hbs)
+  return page.attributes?.['next-release'] ||
+    page.attributes?.['custom-message'] ||
+    page.attributes?.['out-of-support']
+}

src/partials/toc.hbs

@@ -1,3 +1,3 @@
-<aside class="toc sidebar" data-title="{{or page.attributes.toctitle 'Contents'}}" data-levels="{{{or page.attributes.toclevels 2}}}">
+<aside class="toc sidebar{{#if (isMessageBlockDisplayed page)}} toc-with-message-block{{/if}}" data-title="{{or page.attributes.toctitle 'Contents'}}" data-levels="{{{or page.attributes.toclevels 2}}}">
   <div class="toc-menu"></div>
 </aside>

src/partials/toolbar.hbs

@@ -22,6 +22,7 @@
   {{/if}}
   </div>
 
+  {{!-- START support for message blocks - to keep in sync with the 'isMessageBlockDisplayed' helper --}}
   {{#if page.attributes.next-release}}
     <div class="paragraph message-block next-release-block">
       <p>This content is dedicated to our next version.
@@ -45,6 +46,7 @@
       <p>You may want to view the same page for the <a href="{{{relativize page.latest.url}}}">latest version</a>, or for any of the versions available in the drop-down menu in the top-right corner.</p>
     </div>
   {{/if}}
+  {{!-- END support for message blocks --}}
 
   {{/unless}}
 </div>

src/stylesheets/globals/vars.scss

@@ -161,8 +161,10 @@
   --nav-panel-height: calc(var(--nav-height) - var(--drawer-height));
   --nav-panel-height--desktop: calc(var(--nav-height--desktop) - var(--drawer-height));
   --nav-width: calc(270 / var(--rem-base) * 1rem);
-  --toc-top: calc(var(--body-top) + var(--toolbar-height) + var(--header-message-height));
+  --toc-top: calc(var(--body-top) + var(--toolbar-height));
+  --toc-top-with-message-block: calc(var(--toc-top) + var(--header-message-height));
   --toc-height: calc(100vh - var(--toc-top) - 2.5rem);
+  --toc-height-with-message-block: calc(var(--toc-height) - var(--header-message-height));
   --toc-width: calc(162 / var(--rem-base) * 1rem);
   --toc-width--widescreen: calc(216 / var(--rem-base) * 1rem);
   --doc-max-width: calc(720 / var(--rem-base) * 1rem);

src/stylesheets/toc.scss

@@ -22,6 +22,15 @@
     }
   }
 }
+.toc-with-message-block.sidebar {
+  .toc-menu {
+    top: var(--toc-top-with-message-block);
+  }
+
+  ul {
+    max-height: var(--toc-height-with-message-block);
+  }
+}
 
 .toc {
   .toc-menu {