fix: alert bar (nacos-group#703)

Tinie13 · Jun 25, 2024 · 03dbd2c · 03dbd2c
1 parent a3f45d7
commit 03dbd2c
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/src/components/common/Header/Alert.astro b/src/components/common/Header/Alert.astro
@@ -30,9 +30,10 @@ const {
 
 <script>
   // handleAlertClose函数用于处理提示条的关闭逻辑。
-  function handleAlertClose(button) {
+  function handleAlertClose(button, pageFrame) {
     button.parentNode.style.display = "none";
     window.alertBarClosed = true;
+    pageFrame.classList.remove('alert-bar-exist')
   }
 
   // 检查localStorage中的状态，看是否需要显示提示条。
@@ -41,13 +42,16 @@ const {
       const alertBar = document.querySelector(".alert-bar");
       const closeButton = document.querySelector(".close-button");
       const isClosed = window.alertBarClosed || false;
+      const pageFrame = document.querySelector('.sidebar-pane');
 
       if (isClosed === true) {
         alertBar.style.display = "none";
+        pageFrame.classList.remove('alert-bar-exist')
       } else {
         closeButton.addEventListener("click", function () {
-          handleAlertClose(closeButton);
+          handleAlertClose(closeButton,pageFrame);
         });
+        pageFrame.classList.add('alert-bar-exist')
       }
     } catch (e) {
       console.log(e);

diff --git a/src/components/starlight/PageFrame.astro b/src/components/starlight/PageFrame.astro
@@ -57,6 +57,9 @@ const { hasSidebar, labels } = Astro.props;
       background-color: var(--sl-color-black);
       overflow-y: auto;
     }
+    .alert-bar-exist {
+      top: 6rem;
+    }
 
     [aria-expanded="true"] ~ .sidebar-pane {
       --sl-sidebar-visibility: visible;