Disable sticky-sidebar on small viewports (#5985)

source/features/sticky-sidebar.css

@@ -1,4 +1,4 @@
-#js-repo-pjax-container .pagehead ul.pagehead-actions {
+.rgh-sticky-sidebar-enabled #js-repo-pjax-container .pagehead ul.pagehead-actions {
  z-index: initial; /* This affects the social buttons. It seems to have no effect but it constantly causes trouble with other features. */
 }
 

source/features/sticky-sidebar.tsx

@@ -7,6 +7,8 @@ import observe from '../helpers/selector-observer';
 import onAbort from '../helpers/abort-controller';
 import calculateCssCalcString from '../helpers/calculate-css-calc-string';
 
+const minimumViewportWidthForSidebar = 768; // Less than this, the layout is single-column
+
 // The first selector in the parentheses is for the repo root, the second one for conversation pages
 const sidebarSelector = '.Layout-sidebar :is(.BorderGrid, #partial-discussion-sidebar)';
 
@@ -45,7 +47,8 @@ function updateStickiness(): void {
  const offset = calculateCssCalcString(getComputedStyle(sidebar).getPropertyValue('--rgh-sticky-sidebar-offset'));
  sidebar.classList.toggle(
  'rgh-sticky-sidebar',
- sidebar.offsetHeight + offset < window.innerHeight,
+ window.innerWidth >= minimumViewportWidthForSidebar
+ && sidebar.offsetHeight + offset < window.innerHeight,
  );
 }
 
@@ -65,6 +68,9 @@ void features.add(import.meta.url, {
  pageDetect.isRepoRoot,
  pageDetect.isConversation,
  ],
+ exclude: [
+ () => screen.availWidth < minimumViewportWidthForSidebar,
+ ],
  deduplicate: false,
  init,
 });