惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

罗磊的独立博客
小众软件
小众软件
The Cloudflare Blog
博客园 - 【当耐特】
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
酷 壳 – CoolShell
酷 壳 – CoolShell
WordPress大学
WordPress大学
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
V
Visual Studio Blog
量子位
奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
美团技术团队
S
SegmentFault 最新的问题
宝玉的分享
宝玉的分享
博客园 - 叶小钗
月光博客
月光博客
Apple Machine Learning Research
Apple Machine Learning Research
T
Tailwind CSS Blog
博客园 - 聂微东
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
J
Java Code Geeks
Y
Y Combinator Blog
D
Docker
Microsoft Azure Blog
Microsoft Azure Blog

少数派

派早报:Google 发布 Fitbit Air 等 - 少数派 「新人报到」確認需求,再開始 - 少数派 从 SOLO 独立开发者社区,我看到了越来越多开发者开始做自己的产品 - 少数派 我怎么管理那些"不常做,但总会忘"的生活事项 - 少数派 人形机器人量产元年,数据才是具身智能的“生死线” - 少数派 BuhoLaunchpad 高度还原 Mac 启动台:开发历程与思考 - 少数派 五年陪伴依然不舍,DIY 换壳后让罗技 MX Master 3 继续服役 - 少数派 新玩意 240|少数派的编辑们最近买了啥? - 少数派 一日一技|为什么你应该关闭 iOS 的键盘声音 - 少数派 我做了个插件和 Skills,一键提取任何网站的设计规范 Design.md - 少数派 住在三四线城市的你,该开始录播客了 - 少数派 甘南秘境,大白高国 - 少数派 AI的审美:谁让把我变成川内倫子 - 少数派 返工怎能不烦恼,打工人片单总有一部是你的「嘴替」 - 少数派 为了让「上厕所」更健康,我做了一个小工具 - 少数派 AI + Skill,能够让生成的文章去除 AI 味吗? - 少数派 新玩意|韶音OpenDots ONE 耳夹式耳机 - 少数派 《美满》| 在每一个春天的晚上相爱(362) - 少数派 新玩意|优篮子 PS01 MagSnap 磁吸支架 - 少数派 自我整合手记 | 我开始早睡了:用稳定规则,为自由托底 - 少数派 用龙虾(OpenClaw)两个多月,我最深的12个体会 - 少数派 听歌时间到,12 张你可能错过的 2025 华语乐坛好专辑 - 少数派 承诺能追吗 - 少数派 macOS 26启动台没了? 我做了个不一样的App启动器 - Keboard - 少数派 《四海为家的人》| INTJ对话INTJ(361) - 少数派 你发过的那些黑历史,是时候一次清干净了 - 少数派 新玩意:安安静静玩,越玩越专注:计客密码机 - 少数派 iPad 用户首次体验 Android 平板:vivo Pad6 Pro - 少数派 数据逻辑强 - 少数派 极北行+ | 一路向北,探访日本至北之地 | 001 - 少数派
一种基于sidebery侧栏插件的Firefox美化方案 - 少数派
2024-03-28 · via 少数派

Firefox支持高自定义的css自定义,在国外社区多有分享,这里复制了两套代码,以配合sidebery插件实现更大的网页浏览面积。代码非原创,但是有少量删减,这里贴出来源:
https://github.com/refact0r/sidefox/blob/master/userChrome.css

https://www.reddit.com/r/FirefoxCSS/comments/rmi8dg/yet_another_sidebery_setup/

使用效果:

去除书签栏,标签页栏;

使用sidebery侧栏;

更改windows控制按钮(最小化,窗口化,关闭):

调整纵向标签页间距

正常浏览状态
标签页展开状态

使用方法:

  1. 在火狐应用市场安装sidebery
  2. 在火狐地址栏中输入:about:config;确认;无视风险;输入userprof;更改为true

   3. 在火狐右上角菜单栏(三条横线)-帮助-更多排障信息-(下滑)-配置文件夹-打开文件夹

   4. 在打开的文件夹中创建命名为chrome的文件夹,在新创建的文件夹,创建userChrome.css(如果没有css编辑器,可以先创建txt文件编辑后改后缀名为txt),复制下面的第一段代码(少数派的编辑好难受,链接,图片都不能插文字中间),保存。

  5.在sidebery 设置-样式编辑器中复制第二段css代码,重启Firefox即可。

userChrome.css代码:

/* Sidebery */
#main-window[titlepreface*="🦊 "] .tabbrowser-tab {
  visibility: collapse !important;
}

#main-window[titlepreface*="🦊 "] .titlebar-button {
  height: 40px !important;
}

#main-window[titlepreface*="🦊 "] #nav-bar {
  margin-top: -40px;
  margin-right: 137px;
  box-shadow: none !important;
}
#main-window[titlepreface*="🦊 "] #titlebar-spacer {
  background-color: var(--chrome-secondary-background-color);
}

#main-window[titlepreface*="🦊 "] #titlebar-buttonbox-container {
  background-color: var(--chrome-secondary-background-color);
}

#main-window[titlepreface*="🦊 "] .titlebar-color {
  background-color: var(--toolbar-bgcolor);
}

#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"] #sidebar-header {
  visibility: collapse;
}

/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_sidebar.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

/* Show sidebar only when the cursor is over it  */
/* The border controlling sidebar width will be removed so you'll need to modify these values to change width */

#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"] {
  --uc-sidebar-width: 48px !important;
  --uc-sidebar-hover-width: 250px;
  --uc-autohide-sidebar-delay: 300ms; /* Wait 0.3s before hiding sidebar */
  position: relative;
  min-width: var(--uc-sidebar-width) !important;
  width: var(--uc-sidebar-width) !important;
  max-width: var(--uc-sidebar-width) !important;
  z-index:1;
}

#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"] > #sidebar-splitter {
  display: none
}

#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"] > #sidebar {
  transition: min-width 115ms linear var(--uc-autohide-sidebar-delay) !important;
  min-width: var(--uc-sidebar-width) !important;
  will-change: min-width;
}

#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"]:hover > #sidebar{
  min-width: var(--uc-sidebar-hover-width) !important;
  transition-delay: 0ms !important
}

/* Add sidebar divider and give it background */

#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"] > #sidebar,
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"] > #sidebar-header {
  background-color: var(--toolbar-bgcolor) !important;
/*  border-inline: 1px solid var(--sidebar-border-color) !important;*/
  border-inline: 1px solid var(--chrome-content-separator-color) !important;
  border-inline-width: 0px 1px;
}
#sidebar-box[positionend]{
  direction: rtl
}
#sidebar-box[positionend] > *{
  direction: ltr
}

#sidebar-box[positionend]:-moz-locale-dir(rtl){
  direction: ltr
}
#sidebar-box[positionend]:-moz-locale-dir(rtl) > *{
  direction: rtl
}




:root {
	--navbar-height: 48px;
	--wc-height: 16px;
	--wc-left-margin: 10px;
	--wc-red: hsl(-10, 90%, 60%);
	--wc-yellow: hsl(50, 90%, 60%);
	--wc-green: hsl(160, 90%, 40%);
	--sidebar-collapsed-width: var(--navbar-height);
	--sidebar-width: 250px;
	--transition-duration: 0.2s;
	--transition-ease: ease-out;
}

/* hide tabline */
#navigator-toolbox {
	-moz-window-dragging: drag;
}

#titlebar {
	appearance: none !important;
}

#TabsToolbar .toolbar-items {
	display: none !important;
}

#TabsToolbar.browser-toolbar {
	display: block !important;
	position: absolute;
	right: 0;
	top: calc((var(--navbar-height) - var(--wc-height)) / 2);
}

#nav-bar {
	margin-right: calc(var(--wc-height) * 6 + var(--wc-left-margin));
	padding: calc((var(--navbar-height) - 40px) / 2) 0;
}

#urlbar {
	--urlbar-toolbar-height: 40px !important;
	z-index: 200 !important;
}

#private-browsing-indicator-with-label {
	display: none !important;
}

.titlebar-button > .toolbarbutton-icon {
	visibility: hidden;
}

.titlebar-button {
	padding: 0 !important;
	height: var(--wc-height) !important;
	min-height: var(--wc-height) !important;
	width: var(--wc-height) !important;
	min-width: var(--wc-height) !important;
	border-radius: 50%;
	opacity: 0.7 !important;
}

.titlebar-button:hover {
	transform: scale(1.1);
	opacity: 1 !important;
	cursor: pointer;
}

.titlebar-buttonbox {
	display: flex;
	margin-right: var(--wc-height);
	gap: var(--wc-height);
}

.titlebar-close {
	background: var(--wc-red) !important;
}

.titlebar-min {
	background: var(--wc-yellow) !important;
}

.titlebar-max,
.titlebar-restore {
	background: var(--wc-green) !important;
}

/* hide sidebar header */
#sidebar-box[sidebarcommand='treestyletab_piro_sakura_ne_jp-sidebar-action']
	#sidebar-header {
	display: none;
}

#sidebar-box {
	z-index: 100 !important;
	position: relative !important;
	min-width: var(--sidebar-collapsed-width) !important;
	max-width: var(--sidebar-collapsed-width) !important;
}

sidebery css代码:

#root {
  --tabs-font: 10pt Segoe UI;
  --tabs-count-font: .625rem Segoe UI;
  --bookmarks-bookmark-font: .875rem Segoe UI;
  --bookmarks-folder-font: 10pt Segoe UI;
}
 
/* Adjust styles according to sidebar width */
@media screen and (max-width: 49px) {
  #root {
    --tabs-indent: unset;
  }
  .ScrollBox > .scroll-container {
    overflow: hidden;
  }
  .Tab .audio {
    left: 10px;
    transform: scale(.80);
    transform: translateY(4px);
    z-index: 99 !important;
  }
  .Tab .title {
    visibility: collapse;
  }
}
 
@media screen and (min-width: 49px) {
  .Tab .audio {
    left: 28px;
  }
}
 
/*
 * Add margins and rounding around tabs
 */ 
 
#root {
  --tabs-height: 33px;
}
 
/* Background layer */
 
.Tab {
  margin: 0 4px;
  width: unset;
}
.Tab .lvl-wrapper:after {
  content: '';
  position: absolute;
  top: 4px;
  width: 100%;
  height: calc(100% - 5px);
  border-radius: 4px;
  z-index: -1;
}
 
@media (prefers-color-scheme:light) {
  #root {
    --tabs-activated-bg: white !important;
    --tabs-bg-active: var(--tabs-activated-bg) !important;
    --tabs-selected-fg: var(--tabs-activated-fg) !important;
    --tabs-selected-bg: var(--tabs-activated-bg) !important;
    --bg: #f0f0f0 !important;
  }
  .Tab[data-selected] .lvl-wrapper:after,
  .Tab[data-active] .lvl-wrapper:after {
    box-shadow: 0 0 1px rgba(128,128,142,0.9), 0 0 4px rgba(128,128,142,0.5);
  }
}
 
 
/* Reset default styles */
.Tab:hover,
.Tab:active,
.Tab[data-active],
.Tab[data-active]:active,
.Tab[data-selected],
.Tab[data-selected]:hover,
.Tab[data-selected]:active {
  background: transparent;
}
 
/* Reapply styles */
 
.Tab:hover .lvl-wrapper:after {
  background-color: var(--tabs-bg-hover);
}
 
.Tab:active .lvl-wrapper:after,
.Tab[data-active]:active .lvl-wrapper:after {
  background-color: var(--tabs-bg-active);
}
 
.Tab[data-active] .lvl-wrapper:after {
  background-color: var(--tabs-activated-bg);
}
 
 
.Tab[data-selected] .lvl-wrapper:after {
  background-color: var(--tabs-selected-bg);,
}
 
/* Resize and reposition favicons */
.Tab .fav {
  width: 18px;
  height: 18px;
  margin-left: 10px;
}
 
.Tab .placeholder > svg {
  width: 18px;
  height: 18px;
}
 
.Tab .fav,
.Tab .placeholder,
.Tab .t-box {
  margin-bottom: -2px;
}
 

本文可随意转载。