Sidebery侧边栏最小宽度优化方案

背景介绍

Sidebery是一款广受欢迎的Firefox浏览器扩展，它提供了强大的标签页侧边栏管理功能。然而，在隐私保护方面，当用户启用Firefox的resistFingerprinting.letterboxing功能时，Sidebery默认的最小宽度设置可能会影响网页渲染区域的最优分配。

技术原理分析

Firefox的resistFingerprinting.letterboxing功能是一种隐私保护机制，它会将网页渲染尺寸限制为常见的标准值，并以此作为报告给网站的用户屏幕分辨率。这种设计可以有效防止网站通过精确的屏幕尺寸进行用户指纹识别。

在实际使用中，例如在1920x1080分辨率的屏幕上，扣除Windows任务栏和Firefox标签栏的高度后，理论上可以获得1800x900的网页渲染区域。但由于Sidebery默认的最小宽度为168px，用户只能获得1600x900的渲染区域，这造成了可用空间的浪费。

解决方案

方法一：直接修改最小宽度

通过自定义CSS样式，可以轻松覆盖Sidebery的默认最小宽度设置：

#sidebar-box {
  min-width: 0px !important;
}

这种方法简单直接，但可能会影响侧边栏的正常使用体验。

方法二：智能悬停方案

更优雅的解决方案是创建一个响应式的侧边栏，平时保持最小宽度，在鼠标悬停时展开：

:root {
  --sidebar-min-width: 30px;
  --sidebar-visible-width: 230px;
}

#sidebar-box, #sidebar{
  position: relative !important;
  min-width: var(--sidebar-min-width) !important;
  max-width: var(--sidebar-min-width) !important;
  transition: .1s ease .3s;
  z-index: 1;
}

#sidebar-box:hover #sidebar {
  min-width: var(--sidebar-visible-width) !important;
  max-width: var(--sidebar-visible-width) !important;
  transition: .1s ease .2s;
}

#sidebar-header { display: none; }
#sidebar-splitter { display: none; }
#webextpanels-window { background: transparent !important }

这个方案具有以下优点：

1. 平时保持极小的30px宽度，最大化网页渲染区域
2. 鼠标悬停时平滑过渡到完整宽度(230px)
3. 移除了不必要的界面元素(标题栏和分隔条)
4. 设置了适当的z-index和背景透明度

实施建议

1. 在Firefox配置文件中创建或修改userChrome.css文件
2. 将上述代码粘贴到文件中
3. 根据个人偏好调整变量值
4. 重启Firefox使更改生效

注意事项

1. 修改前建议备份原始配置文件
2. 不同Firefox版本可能需要微调CSS选择器
3. 过度减小最小宽度可能影响侧边栏的功能性
4. 建议在修改后进行充分测试，确保所有功能正常

通过这种优化，用户可以在保持隐私保护功能的同时，获得更大的网页浏览区域，提升整体的浏览体验。