feng

src/components/Bookmark/index.js

@@ -26,8 +26,8 @@ export default function Bookmark({ docId }) {
     >
       <svg
         viewBox="0 0 24 24"
-        width="20"
-        height="20"
+        width="16"
+        height="16"
         stroke="currentColor"
         strokeWidth="2"
         fill={isBookmarked ? 'currentColor' : 'none'}

src/components/Bookmark/styles.module.css

@@ -1,6 +1,6 @@
 .bookmarkButton {
   position: absolute;
-  left: -30px;
+  left: -25px;
   top: 50%;
   transform: translateY(-50%);
   background: none;
@@ -10,6 +10,10 @@
   color: var(--ifm-color-emphasis-600);
   transition: all 0.2s ease;
   opacity: 0;
+  z-index: 100;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
 .bookmarkButton:hover {
@@ -30,4 +34,10 @@
 /* 已标记的项目始终显示标记按钮 */
 :global(.menu__link-wrapper) .bookmarked {
   opacity: 1;
+}
+
+/* 确保侧边栏项目有足够的空间显示标记按钮 */
+:global(.menu__link-wrapper) {
+  padding-left: 25px !important;
+  position: relative !important;
 } 

src/css/custom.css

@@ -153,7 +153,8 @@ html[data-theme='dark'] .docusaurus-highlight-code-line {
 
 /* 标记按钮的全局样式 */
 .menu__link-wrapper {
-  position: relative;
+  position: relative !important;
+  padding-left: 25px !important;
 }
 
 /* 已标记项目的样式 */
@@ -176,4 +177,16 @@ html[data-theme='dark'] .docusaurus-highlight-code-line {
 
 .bookmarkButton.bookmarked {
   animation: bookmarkPulse 0.3s ease;
+}
+
+/* 确保侧边栏项目有正确的样式 */
+.menu__link {
+  position: relative !important;
+  display: flex !important;
+  align-items: center !important;
+}
+
+/* 调整侧边栏的padding，为标记按钮留出空间 */
+.menu {
+  padding-left: 20px !important;
 }

src/theme/DocSidebarItem/index.js

@@ -8,7 +8,7 @@ export default function DocSidebarItemWrapper(props) {
   // 只为文档类型的项目添加标记功能
   if (item.type === 'doc') {
     return (
-      <div style={{ position: 'relative' }}>
+      <div className="menu__link-wrapper" style={{ position: 'relative' }}>
         <DocSidebarItem {...props} />
         <Bookmark docId={item.docId} />
       </div>