refs #83419: fix search result right page

packages/app/src/components/Page/PageManagement.jsx

@@ -206,7 +206,7 @@ const LegacyPageManagemenet = (props) => {
           className={`btn-link nav-link dropdown-toggle dropdown-toggle-no-caret border-0 rounded grw-btn-page-management ${isCompactMode && 'py-0'}`}
           data-toggle="dropdown"
         >
-          <i className="icon-options"></i>
+          <i className="text-muted icon-options"></i>
         </button>
       </>
     );
@@ -220,7 +220,7 @@ const LegacyPageManagemenet = (props) => {
           className={`btn nav-link bg-transparent dropdown-toggle dropdown-toggle-no-caret disabled ${isCompactMode && 'py-0'}`}
           id="icon-options-guest-tltips"
         >
-          <i className="icon-options"></i>
+          <i className="text-muted icon-options"></i>
         </button>
         <UncontrolledTooltip placement="top" target="icon-options-guest-tltips" fade={false}>
           {t('Not available for guest')}

packages/app/src/components/SearchPage/SearchResultContent.tsx

@@ -22,7 +22,7 @@ const SearchResultContent: FC<Props> = (props: Props) => {
   if (page == null) return <></>;
   const growiRenderer = props.appContainer.getRenderer('searchresult');
   return (
-    <div key={page._id} className="search-result-page mb-5">
+    <div key={page._id} className="search-result-page grw-page-path-text-muted-container mb-5">
       <SearchResultContentSubNavigation
         pageId={page._id}
         revisionId={page.revision}

packages/app/src/components/SearchPage/SearchResultContentSubNavigation.tsx

@@ -46,33 +46,35 @@ const SearchResultContentSubNavigation: FC<Props> = (props : Props) => {
   const { isSharedUser } = appContainer;
   const isAbleToShowPageManagement = !(isTrashPage(path)) && !isSharedUser;
   return (
-    <div className={`grw-subnav container-fluid d-flex align-items-center justify-content-between ${isCompactMode ? 'grw-subnav-compact d-print-none' : ''}`}>
-      {/* Left side */}
-      <div className="grw-path-nav-container">
-        {!isSharedUser && !isCompactMode && (
-          <div className="grw-taglabels-container">
-            <TagLabels tags={tagInfoData.tags} tagsUpdateInvoked={tagsUpdatedHandler} />
-          </div>
-        )}
-        <PagePathNav pageId={pageId} pagePath={path} isCompactMode={isCompactMode} isSingleLineMode={isSignleLineMode} />
-      </div>
-      {/* Right side */}
-      {/*
-        DeleteCompletely is currently disabled
-        TODO : Retrive isAbleToDeleteCompleltly state everywhere in the system via swr.
-        story: https://redmine.weseek.co.jp/issues/82222
-      */}
-      <div className="d-flex">
-        <SubNavButtons
-          isCompactMode={isCompactMode}
-          pageId={pageId}
-          revisionId={revisionId}
-          path={path}
-          isDeletable={isPageDeletable}
-          // isAbleToDeleteCompletely={}
-          willShowPageManagement={isAbleToShowPageManagement}
-        >
-        </SubNavButtons>
+    <div className="position-sticky fixed-top shadow">
+      <div className={`grw-subnav container-fluid d-flex align-items-start justify-content-between ${isCompactMode ? 'grw-subnav-compact d-print-none' : ''}`}>
+        {/* Left side */}
+        <div className="grw-path-nav-container">
+          {!isSharedUser && !isCompactMode && (
+            <div className="grw-taglabels-container">
+              <TagLabels tags={tagInfoData.tags} tagsUpdateInvoked={tagsUpdatedHandler} />
+            </div>
+          )}
+          <PagePathNav pageId={pageId} pagePath={path} isCompactMode={isCompactMode} isSingleLineMode={isSignleLineMode} />
+        </div>
+        {/* Right side */}
+        {/*
+          DeleteCompletely is currently disabled
+          TODO : Retrive isAbleToDeleteCompleltly state everywhere in the system via swr.
+          story: https://redmine.weseek.co.jp/issues/82222
+        */}
+        <div className="d-flex">
+          <SubNavButtons
+            isCompactMode={isCompactMode}
+            pageId={pageId}
+            revisionId={revisionId}
+            path={path}
+            isDeletable={isPageDeletable}
+            // isAbleToDeleteCompletely={}
+            willShowPageManagement={isAbleToShowPageManagement}
+          >
+          </SubNavButtons>
+        </div>
       </div>
     </div>
   );

packages/app/src/styles/_search.scss

@@ -227,6 +227,8 @@
   .search-result-content {
     padding-bottom: 36px;
 
+    z-index: 0;
+
     .search-result-page {
       padding-top: 64px;
       // adjust for anchor links by the height of fixed .search-page-input