阅读:2688回复:6
火狐66b3版本书签收藏夹双列CSS失效了帮忙修改一下谢谢!@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul); @-moz-document url(chrome://browser/content/browser.xul) { /*定义收藏项宽度一致*/ .bookmark-item[container="true"]:-moz-any([label="实用小书签"],[label=""],[label="乱七八糟"],[label="杂项"],[label="火狐谷歌浏览器"],[label="VPN--SSH--代理"],[label="网盘搜索云笔记"],[label="电子邮箱"],[label="下载"],[label="论坛"],[label="谷歌"],[label="外国著名网站"],[label="电脑控制手机"]) .menuitem-with-favicon{ max-width:320px !important; min-width:180px !important; } .bookmark-item[container="true"]:-moz-any( /*需要多列显示的书签文件夹名,多个用(,)分割, 格式如下所示。下面的如此类推。跟第一个相同。 在userchorme.css中,中文注意编码, 改为UTF8,stylish扩展可无视*/ [label="实用小书签"], [label="杂项"], [label="火狐谷歌浏览器"], [label="下载"] ) >menupopup>hbox .scrollbox-innerbox{ width: 390px !important; /*双列显示380px ,三列显示数值改为570px(3x190)*/ display: table !important; } .bookmark-item[container="true"]:-moz-any( [label="实用小书签"], [label="杂项"], [label="火狐谷歌浏览器"], [label="下载"] ) .bookmark-item { min-width: 190px !important; max-width: 190px !important; margin-right:5px!important; } .bookmark-item[container="true"] .bookmark-item{ max-width: 220px !important; } .bookmark-item[container="true"]:-moz-any( [label="实用小书签"], [label="杂项"], [label="火狐谷歌浏览器"], [label="下载"] ) menu .bookmark-item { min-width: 220px !important; } .bookmark-item[container="true"]:-moz-any( [label="实用小书签"], [label="杂项"], [label="火狐谷歌浏览器"], [label="下载"] ) >menupopup>hbox .scrollbox-innerbox> menuseparator{ display: block !important; } .bookmark-item[container="true"] scrollbox{ overflow-y: auto !important; } .bookmark-item[container="true"] .bookmark-item .menu-iconic-text{ margin-right:-30px!important; } .bookmark-item[container="true"] :-moz-any(.abhere-menuitem,autorepeatbutton), .bookmark-item[container="true"] .menuitem-iconic.bookmark-item.menuitem-with-favicon ~ menuseparator{ display:none!important; } .bookmark-item[container="true"] .openintabs-menuitem{ position:absolute; } } |
|
1楼#
发布于:2019-01-30 19:13
由于 Bug 1454357 - Remove scrollbox binding
删掉了scrollbox-innerbox 这一层,css 中 删除 .scrollbox-innerbox 就可以了,但是这样过长的双列下拉菜单就无法滚动了。 只能使用 -moz-binding 还原 scrollbox-innerbox。 在你的代码 4 - 5 行间加上 /*还原 https://bugzilla.mozilla.org/show_bug.cgi?id=1454357 的变更*/ #PlacesToolbarItems .bookmark-item[container="true"]:-moz-any( [label="实用小书签"],[label=""],[label="乱七八糟"], /*.....加上你需要双列显示的所有文件夹。当然也可以不用 :-moz-any(...),这样会应用全局的书签文件夹。*/ )>menupopup>hbox>.popup-internal-box>.arrowscrollbox-scrollbox{ -moz-binding: url("data:application/vnd.mozilla.xul+xml;charset=UTF-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+CjxiaW5kaW5ncyB4bWxucz0iaHR0cDovL3d3dy5tb3ppbGxhLm9yZy94YmwiCgl4bWxuczp4dWw9Imh0dHA6Ly93d3cubW96aWxsYS5vcmcva2V5bWFzdGVyL2dhdGVrZWVwZXIvdGhlcmUuaXMub25seS54dWwiCgl4bWxuczp4Ymw9Imh0dHA6Ly93d3cubW96aWxsYS5vcmcveGJsIj4KCTxiaW5kaW5nIGlkPSJzY3JvbGxib3giIGV4dGVuZHM9ImNocm9tZTovL2dsb2JhbC9jb250ZW50L2JpbmRpbmdzL2dlbmVyYWwueG1sI2Jhc2Vjb250cm9sIj4KCQk8Y29udGVudD4KCQkJPHh1bDpib3ggY2xhc3M9ImJveC1pbmhlcml0IHNjcm9sbGJveC1pbm5lcmJveCIgeGJsOmluaGVyaXRzPSJvcmllbnQsYWxpZ24scGFjayxkaXIiIGZsZXg9IjEiPgoJCQkJPGNoaWxkcmVuLz4KCQkJPC94dWw6Ym94PgoJCTwvY29udGVudD4KCTwvYmluZGluZz4KPC9iaW5kaW5ncz4K") !important; } |
|
2楼#
发布于:2019-01-30 20:25
lonely_8:由于 Bug 1454357 - Remove scrollbox binding @namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul); @-moz-document url(chrome://browser/content/browser.xul) { /*还原 https://bugzilla.mozilla.org/show_bug.cgi?id=1454357 的变更*/ #PlacesToolbarItems .bookmark-item[container="true"]:-moz-any( [label="实用小书签"],[label="杂项"],[label="火狐谷歌浏览器"],[label="下载"], /*.....加上你需要双列显示的所有文件夹。当然也可以不用 :-moz-any(...),这样会应用全局的书签文件夹。*/ )>menupopup>hbox>.popup-internal-box>.arrowscrollbox-scrollbox{ -moz-binding: url("data:application/vnd.mozilla.xul+xml;charset=UTF-8;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+CjxiaW5kaW5ncyB4bWxucz0iaHR0cDovL3d3dy5tb3ppbGxhLm9yZy94YmwiCgl4bWxuczp4dWw9Imh0dHA6Ly93d3cubW96aWxsYS5vcmcva2V5bWFzdGVyL2dhdGVrZWVwZXIvdGhlcmUuaXMub25seS54dWwiCgl4bWxuczp4Ymw9Imh0dHA6Ly93d3cubW96aWxsYS5vcmcveGJsIj4KCTxiaW5kaW5nIGlkPSJzY3JvbGxib3giIGV4dGVuZHM9ImNocm9tZTovL2dsb2JhbC9jb250ZW50L2JpbmRpbmdzL2dlbmVyYWwueG1sI2Jhc2Vjb250cm9sIj4KCQk8Y29udGVudD4KCQkJPHh1bDpib3ggY2xhc3M9ImJveC1pbmhlcml0IHNjcm9sbGJveC1pbm5lcmJveCIgeGJsOmluaGVyaXRzPSJvcmllbnQsYWxpZ24scGFjayxkaXIiIGZsZXg9IjEiPgoJCQkJPGNoaWxkcmVuLz4KCQkJPC94dWw6Ym94PgoJCTwvY29udGVudD4KCTwvYmluZGluZz4KPC9iaW5kaW5ncz4K") !important; } /*定义收藏项宽度一致*/ .bookmark-item[container="true"]:-moz-any([label="实用小书签"],[label=""],[label="乱七八糟"],[label="杂项"],[label="火狐谷歌浏览器"],[label="VPN--SSH--代理"],[label="网盘搜索云笔记"],[label="电子邮箱"],[label="下载"],[label="论坛"],[label="谷歌"],[label="外国著名网站"],[label="电脑控制手机"]) .menuitem-with-favicon{ max-width:320px !important; min-width:180px !important; } .bookmark-item[container="true"]:-moz-any( /*需要多列显示的书签文件夹名,多个用(,)分割, 格式如下所示。下面的如此类推。跟第一个相同。 在userchorme.css中,中文注意编码, 改为UTF8,stylish扩展可无视*/ [label="实用小书签"], [label="杂项"], [label="火狐谷歌浏览器"], [label="下载"] ) >menupopup>hbox .scrollbox-innerbox{ width: 390px !important; /*双列显示380px ,三列显示数值改为570px(3x190)*/ display: table !important; } .bookmark-item[container="true"]:-moz-any( [label="实用小书签"], [label="杂项"], [label="火狐谷歌浏览器"], [label="下载"] ) .bookmark-item { min-width: 190px !important; max-width: 190px !important; margin-right:5px!important; } .bookmark-item[container="true"] .bookmark-item{ max-width: 220px !important; } .bookmark-item[container="true"]:-moz-any( [label="实用小书签"], [label="杂项"], [label="火狐谷歌浏览器"], [label="下载"] ) menu .bookmark-item { min-width: 220px !important; } .bookmark-item[container="true"]:-moz-any( [label="实用小书签"], [label="杂项"], [label="火狐谷歌浏览器"], [label="下载"] ) >menupopup>hbox .scrollbox-innerbox> menuseparator{ display: block !important; } .bookmark-item[container="true"] scrollbox{ overflow-y: auto !important; } .bookmark-item[container="true"] .bookmark-item .menu-iconic-text{ margin-right:-30px!important; } .bookmark-item[container="true"] :-moz-any(.abhere-menuitem,autorepeatbutton), .bookmark-item[container="true"] .menuitem-iconic.bookmark-item.menuitem-with-favicon ~ menuseparator{ display:none!important; } .bookmark-item[container="true"] .openintabs-menuitem{ position:absolute; } }添加完没有起作用,麻烦在帮我看看! |
|
3楼#
发布于:2019-01-30 20:35
看1楼我所给出的代码,第三行的注释说明啊。
|
|
4楼#
发布于:2019-01-31 11:35
|
|
5楼#
发布于:2021-11-09 09:48
请问有改好的吗 我照着上面改完无效,是高版本已经不适用了么?
|
|
6楼#
发布于:2021-11-09 15:46
阿特拉斯:请问有改好的吗 我照着上面改完无效,是高版本已经不适用了么?回到原帖纯 css 已经无法实现了,需要 UC 脚本才能实现。 // ==UserScript== // @name 多列书签 // @include main // ==/UserScript== location.href.startsWith('chrome://browser/content/browser.x') && (() => { //按顺序从两列开始 const column = [ ['2列显示的书签文件夹名称1', '2列名称2', '2列名称3', '2列名称4'], ['3列显示的书签文件夹名称1', '3列名称2'], ['4列显示的书签文件夹名称1', '4列名称2'], //...由此类推 ]; const BOOKMARK_WIDTH = 180; // 书签宽度 const MARGIN_RIGHT = 5; const sss = Cc["@mozilla.org/content/style-sheet-service;1"].getService(Ci.nsIStyleSheetService); sss.loadAndRegisterSheet(Services.io.newURI("data:text/css," + encodeURIComponent(` @-moz-document url("chrome://browser/content/browser.xhtml"){ #PlacesToolbarItems menuitem.bookmark-item .menu-accel-container { display: none !important; } ${column.map(c => { return c.length ? `#PlacesToolbarItems .bookmark-item[container="true"]:is( ${c.map(i => `[label=${JSON.stringify(i)}]`).join(', ')} ) > menupopup > :is(menuitem, menu, menuseparator) { min-width: ${BOOKMARK_WIDTH}px !important; max-width: ${BOOKMARK_WIDTH}px !important; margin-right: ${MARGIN_RIGHT}px !important; }` : ''; }).join('\n')} }`), null, null), sss.USER_SHEET); function _getScrollableElements () { let nodes = this.children; if(nodes.length == 1 && nodes[0].className === 'scrollbox-innerbox') { nodes = nodes[0].children; } if (nodes.length == 1) { let node = nodes[0]; if (node.localName == 'children' && node.namespaceURI == 'http://www.mozilla.org/xbl') { nodes = document.getBindingParent(this).children; } else if (node.localName == 'slot' && node.namespaceURI == 'http://www.w3.org/1999/xhtml') { nodes = node.getRootNode().host.children; } } return Array.prototype.filter.call(nodes, this._canScrollToElement, this); } const PlacesToolbarItems = document.getElementById('PlacesToolbarItems'); PlacesToolbarItems.addEventListener('popupshowing', (event) => { const menupopup = event.target; if(menupopup._isInitMultipledBM) return; const title = menupopup.parentNode && menupopup.parentNode._placesNode && menupopup.parentNode._placesNode.title; menupopup._isInitMultipledBM = true; let col = -1; if(!title || !menupopup.shadowRoot || (col = column.findIndex(c => { return c.indexOf(title) > -1; })) === -1) return; col += 2; const markup = `<html:style> arrowscrollbox::part(scrollbox), /*bug 1514926*/ scrollbox.arrowscrollbox-scrollbox{ overflow-y: auto !important; } arrowscrollbox > .scrollbox-innerbox{ display:grid !important; grid-template-columns: repeat(${col}, 1fr); } </html:style>${menupopup.markup.replace( /<html:slot\/>|<html:slot><\/html:slot>/, '<box class="scrollbox-innerbox" orient="vertical" pack="start" smoothscroll="false" flex="1">$&</box>' )}`; let count = menupopup.shadowRoot.childElementCount; menupopup.shadowRoot.prepend(MozXULElement.parseXULToFragment(markup)); while(count--) menupopup.shadowRoot.lastElementChild.remove(); const arrowscrollbox = menupopup.shadowRoot.querySelector('arrowscrollbox'); if(arrowscrollbox && arrowscrollbox._getScrollableElements) { arrowscrollbox._getScrollableElements = _getScrollableElements.bind(arrowscrollbox); } if(menupopup.__indicatorBar){ menupopup.__indicatorBar = null; menupopup._scrollBox = null; }else{ menupopup._indicatorBar = menupopup.shadowRoot.querySelector( '[part="drop-indicator-bar"]' ); menupopup._scrollBox = menupopup.shadowRoot.querySelector( 'arrowscrollbox' ); } }, true); })(); https://pastebin.com/9ZHvFDBW |
|