基础提交

@@ -45,11 +45,12 @@
     
     
     /* 切换按钮样式 */
     /* 切换按钮样式 */
     #sidebar-toggle {
     #sidebar-toggle {
-        position: absolute;
-        bottom: 15px;
-        left: -18px;
-        width: 36px;
-        height: 36px;
+        position: fixed;
+        top: 50%;
+        left: -24px;
+        transform: translateY(-50%);
+        width: 48px;
+        height: 48px;
         background-color: #4285f4;
         background-color: #4285f4;
         color: white;
         color: white;
         border: none;
         border: none;
@@ -59,19 +60,18 @@
         justify-content: center;
         justify-content: center;
         cursor: pointer;
         cursor: pointer;
         z-index: 100;
         z-index: 100;
-        font-size: 16px;
+        font-size: 20px;
         box-shadow: 0 3px 8px rgba(0,0,0,0.2);
         box-shadow: 0 3px 8px rgba(0,0,0,0.2);
         transition: all 0.3s ease;
         transition: all 0.3s ease;
     }
     }
     
     
-    #sidebar-toggle:hover {
-        background-color: #3367d6;
-        transform: scale(1.05);
+    #sidebar-toggle {
+        left: 0;
     }
     }
     
     
     /* 收缩状态下的切换按钮位置调整 */
     /* 收缩状态下的切换按钮位置调整 */
     #sidebar.collapsed #sidebar-toggle {
     #sidebar.collapsed #sidebar-toggle {
-        left: -18px;
+        left: 0;
         background-color: #4285f4;
         background-color: #4285f4;
     }
     }
 
 
@@ -91,77 +91,8 @@
         min-height: 100vh; /* 确保至少有足够的高度 */
         min-height: 100vh; /* 确保至少有足够的高度 */
     }
     }
     
     
-    /* 悬浮展开按钮样式 */
-    #expand-sidebar {
-        position: fixed;
-        bottom: 15px;
-        left: 15px;
-        width: 36px;
-        height: 36px;
-        background-color: #4285f4;
-        color: white;
-        border: none;
-        border-radius: 50%;
-        display: none;
-        align-items: center;
-        justify-content: center;
-        cursor: pointer;
-        z-index: 40;
-        font-size: 16px;
-        box-shadow: 0 3px 8px rgba(0,0,0,0.2);
-        transition: all 0.3s ease;
-    }
-    
-    #expand-sidebar:hover {
-        background-color: #3367d6;
-        transform: scale(1.05);
-    }
-    
-    /* 侧边栏收缩时显示展开按钮 */
-    #sidebar.collapsed ~ #main-content #expand-sidebar {
-        display: flex;
-    }
-    
-    /* 确保侧边栏收缩时视频容器仍然可见 */
-    #sidebar.collapsed ~ #main-content #media {
-        display: block !important;
-        width: auto;
-        height: auto;
-        max-height: 90vh;
-        max-width: 90vw;
-        aspect-ratio: 9/16; /* 保持竖屏比例 */
-        z-index: 1000;
-        visibility: visible !important;
-        position: relative;
-        opacity: 1 !important;
-    }
-    
-    /* 侧边栏收缩时主内容区域的调整 */
-    #sidebar.collapsed + #main-content {
-        margin-left: 0;
-        display: flex;
-        justify-content: center; /* 水平居中 */
-        align-items: center; /* 垂直居中 */
-        padding: 20px; /* 添加内边距 */
-        width: 100%; /* 确保占满整个宽度 */
-        height: 100vh; /* 确保占满整个高度 */
-        overflow: visible; /* 防止内容被裁剪 */
-    }
+
     
     
-    /* 侧边栏收缩时媒体容器的调整 */
-    #sidebar.collapsed + #main-content #media,
-    #sidebar.collapsed ~ #main-content #media {
-        width: auto;
-        height: auto;
-        max-height: 90vh;
-        max-width: 90vw;
-        aspect-ratio: 9/16; /* 保持竖屏比例 */
-        display: block !important; /* 确保显示 */
-        z-index: 1000; /* 进一步提高z-index确保在最上层 */
-        position: relative;
-        visibility: visible !important;
-        opacity: 1 !important;
-    }
 
 
     /* 按钮样式 */
     /* 按钮样式 */
     button {
     button {
@@ -313,7 +244,6 @@
 
 
 <!-- 主内容区域 -->
 <!-- 主内容区域 -->
 <div id="main-content">
 <div id="main-content">
-    <button id="expand-sidebar">≫</button>
     <div id="media">
     <div id="media">
         <h2>艺云展陈</h2>
         <h2>艺云展陈</h2>
         <audio id="audio" autoplay="true"></audio>
         <audio id="audio" autoplay="true"></audio>