Add possibility to specify StickyHeader top position of Diff component

gradle/gradle/sticky_pr-header.yaml

@@ -0,0 +1,2 @@
+- type: added
+  description: Possibility to specify StickyHeader top position of Diff component

scm-ui/ui-components/src/repos/DiffTypes.ts

@@ -64,7 +64,11 @@ export type DiffObjectProps = {
   isCollapsed?: (file: File) => boolean;
   onCollapseStateChange?: (file: File, newState?: boolean) => void;
   hunkClass?: (hunk: Hunk) => string;
-  stickyHeader?: boolean;
+  /**
+   * Toggle whether header of diff should be sticky
+   * If truthy, numeric value adds distance to top position
+   */
+  stickyHeader?: boolean | number;
   /**
    * Fontawesome Icon Unicode
    *

scm-ui/ui-components/src/repos/diff/styledElements.tsx

@@ -79,13 +79,14 @@ export const MarginlessModalContent = styled.div`
   }
 `;
 
-export const PanelHeading = styled.div<{ sticky?: boolean }>`
-  ${(props) =>
-    props.sticky
-      ? `
+export const PanelHeading = styled.div<{ sticky?: boolean | number }>`
+  ${(props) => {
+    if (props.sticky) {
+      return `
    position: sticky;
-   top: 52px;
+   top: calc(${typeof props.sticky === "number" ? props.sticky : 0}px + var(--scm-navbar-main-height));
    z-index: 1;
-  `
-      : ""}
+  `;
+    }
+  }}
 `;

scm-ui/ui-styles/src/components/_main.scss

@@ -36,16 +36,18 @@
   --scm-danger-color: #{$danger};
   --scm-hover-color-blue: #{scale-color($blue, $alpha: -90%)};
 
+  --scm-navbar-main-height: 52px;
+
   --scm-secondary-least-color: #{$secondary-least};
   --scm-secondary-less-color: #{$secondary-less};
   --scm-secondary-color: #{$secondary};
   --scm-secondary-more-color: #{$secondary-more};
   --scm-secondary-most-color: #{$secondary-most};
-
   --scm-border-color: #{$border};
   --scm-border: #{$border-width} solid #{$border};
-
   --scm-popover-border-color: #{$popover-border-color};
+  --scm-panel-heading-color: #{$panel-heading-color};
+  --scm-panel-heading-background-color: #{$panel-heading-background-color};
 }
 
 // Workaround for https://github.com/radix-ui/primitives/issues/1572
@@ -918,7 +920,7 @@ form .field:not(.is-grouped) {
   }
 
   a:before {
-    font-family: "Font Awesome 5 Free"; /* NOSONAR */
+    font-family: "Font Awesome 5 Free", sans-serif;
     font-weight: 900;
     -webkit-font-smoothing: antialiased;
     display: inline-block;

scm-ui/ui-webapp/src/admin/plugins/containers/PluginsOverview.tsx

@@ -62,7 +62,7 @@ type Props = {
 
 const StickyHeader = styled.div`
   position: sticky;
-  top: 52px;
+  top: var(--scm-navbar-main-height);
   z-index: 10;
   margin-bottom: 1rem;
   margin-top: -1rem;