Dette websted vil have begrænset funktionalitet, mens vi gennemgår vedligeholdelse for at forbedre din oplevelse. Hvis en artikel ikke løser dit problem, og du vil stille et spørgsmål, har vi vores supportfællesskab, der venter på at hjælpe dig på @FirefoxSupport på Twitter og/r/firefox på Reddit.

Søg i Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Læs mere

Can I Make the Bookmarks Folders a Solid Color in FF 89? Mac OS ...

  • 1 svar
  • 2 har dette problem
  • 5 visninger
  • Seneste svar af pcbjr

more options

Can I Make the Bookmarks Folders a Solid Color in FF 89? Mac OS ...

The bookmarks folders on the sidebar are all "transparent" (for lack of a better word). I'd like them to be a solid light blue. Better for my eyes. Is there an add on, an about:config setting or a rule I can add to Chrome that will allow this? I am not speaking of the bookmarks toolbar up top, but the icons for the folders in the bookmarks sidebar on the left.

If there is a solution, although I am fairly FF literate, I am not a guru, so any real basic "See Spot run" instructions are most appreciated!

If it is of any help, here are my Chrome settings for appearance:

  1. PlacesToolbarItems, #sidebar-search-container #search-box, .sidebar-placesTree {
font-size: 16px !important;
font-weight: bold !important;

} label.tab-text {

font-size: 16px !important;

} label.tab-text {

font-weight: bold !important;

}

  1. nav-bar { /* main toolbar */
 -moz-box-ordinal-group: 1 !important;
 box-shadow: none !important;

}

  1. PersonalToolbar { /* bookmarks toolbar */
 -moz-box-ordinal-group: 2 !important;

}

  1. TabsToolbar { /* tab bar */
 -moz-box-ordinal-group: 3 !important;
 padding-top: 0 !important;

} /* Clean up spacing */ .titlebar-placeholder {

 display: none !important;

} toolbarbutton.bookmark-item {

 padding-top: 2px !important;
 padding-bottom: 2px !important;

}

root {
 --tab-curve-width: 30px;
 --tabs-border: transparent !important;

}

.arrowscrollbox-scrollbox {

 padding-inline-start: 10px !important;

}

/* To be able to see the top border of the tab */ .tab-stack {

 margin-top: 2px !important;

}

/* When the window is maximized, the first pinned tab is properly displayed. */

  1. TabsToolbar {
 padding-inline-start: 15px !important;

}

.titlebar-placeholder {

 border: none !important;

}

/* Remove unneeded styles from Photon */ .tabbrowser-tab::before, .tabbrowser-tab::after {

 border: none !important;

}

/* Windows 7 specific */

  1. browser-panel .tabbrowser-tab {
 background-color: transparent !important;
 border: none !important;

}

.tabbrowser-tab > .tab-stack > .tab-background {

 background-image: none !important;
 -moz-box-orient: horizontal !important;
 background-color: transparent !important;
 margin-top: 1px !important;

}

.tab-background[selected="true"] {

 border: none !important;

}

.tab-line {

 display: none !important;

}

.tab-bottom-line {

 display: none !important;

}

/* Match height of new tab button (right svg) on hover */ .tabs-newtab-button {

 margin: 0 !important;

}

/* overlap the tab curves */ .tab-background {

 -moz-margin-end: -15px !important;
 -moz-margin-start: -15px !important;

}

/* Begin tab background customizations */ .tab-background[selected="true"]::before {

 border: none !important;
 content: "" !important;
 width: 30px !important;
 min-height: 30px !important;
 display: -moz-box !important;
 background-repeat: no-repeat !important;

}

.tab-background[selected="true"]::after {

 border: none !important;
 content: "" !important;
 width: 30px !important;
 min-height: 30px !important;
 display: -moz-box !important;
 background-repeat: no-repeat !important;

}

.tab-background[selected="true"] > spacer {

 margin-top: 0px !important;

}

  1. new-tab-button,

.tabs-newtab-button {

 width: calc(36px + 30px) !important;
 margin-inline-start: -15px !important;
 margin-top: 1px !important;

}

/* Tab hover customizations */

/* Regular tabs */ .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::before {

 display: -moz-box !important;
 background-repeat: no-repeat !important;
 content: "" !important;
 width: 30px !important;
 max-height: 30px !important;
 background-color: transparent !important;

}

.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::after {

 display: -moz-box !important;
 background-repeat: no-repeat !important;
 content: "" !important;
 width: 30px !important;
 max-height: 30px !important;
 background-color: transparent !important;

}

.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]) > spacer {

 margin-top: 0px !important;

}

  1. TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]),

.tabs-newtab-button:hover, .tabs-newtab-button:hover::before, .tabs-newtab-button:hover::after {

 background-color: transparent !important;

}

/* New tab hover customizations */ .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]), .tabs-newtab-button:hover {

 background-position: 0px 2px, 30px 4px , 36px 2px !important;
 background-repeat: no-repeat !important;
 background-size: 30px 30px, calc(100% - (2 * 30px)) 30px, 30px !important;

}

.tabs-newtab-button:hover > .toolbarbutton-icon {

 background: none !important;
 background-color: transparent !important;

}

/* Color specific customizations */

root {
--svg-selected-before: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'>
</foreignObject></svg>"); --svg-selected-after: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'>
</foreignObject></svg>");
 --background-selected-middle:
   linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)),
   linear-gradient(
     transparent
     2px,
     rgb(245,246,247) 2px,
     rgb(245,246,247)
   ),
   none;
--svg-hover-before: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='30px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='30' clip-path='url(%23tab-curve-clip-path-start)'>
</foreignObject></svg>"); --svg-hover-after: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'>
</foreignObject></svg>");
 --background-hover-middle:
   linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)),
   linear-gradient(
     transparent
     2px,
     rgba(0,0,0,.1) 2px,
     rgba(0,0,0,.1)
   ),
   none !important;
--newtab-hover: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'>
</foreignObject></svg>"),
   linear-gradient(rgba(0,0,0,.1), rgba(0,0,0,.1)),
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='30px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'>
</foreignObject></svg>");

}


/* OS-specific color variables */ @media screen and (-moz-windows-theme) {

 :root {
 }

}

@media not screen and (-moz-windows-theme) {

 :root {
 }

}

.tab-background[selected="true"]::before {

 background-image: var(--svg-selected-before) !important;

}

.tab-background[selected="true"]::after {

 background-image: var(--svg-selected-after) !important;

}

.tab-background[selected="true"] > spacer {

background-image: var(--background-selected-middle) !important;

}

.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::before {

 background-image: var(--svg-hover-before) !important;

}

.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::after {

 background-image: var(--svg-hover-after) !important;

}

.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]) > spacer {

 background-image: var(--background-hover-middle) !important;

}

.tabs-newtab-button:hover {

 background-image: var(--newtab-hover) !important;

}


/* Standard folder */

  1. bookmarks-view treechildren::-moz-tree-image(container),
  2. PlacesToolbarItems toolbarbutton[container="true"] .toolbarbutton-icon,
  3. PlacesToolbarItems menu[container="true"] .menu-iconic-left,
  4. BMB_bookmarksPopup menu[container="true"] .menu-iconic-icon,
  5. bookmarksMenu menu[container="true"] .menu-iconic-icon {
 fill: #104B87 !important; /* slightly muted gold */

}

 /* Live Bookmark (RSS Feed) */
  1. bookmarks-view treechildren::-moz-tree-image(container, livemark),
  2. PlacesToolbarItems toolbarbutton[container="true"][livemark="true"] .toolbarbutton-icon,
  3. PlacesToolbarItems menu[container="true"][livemark="true"] .menu-iconic-left,
  4. BMB_bookmarksPopup menu[container="true"][livemark="true"] .menu-iconic-icon,
  5. bookmarksMenu menu[container="true"][livemark="true"] .menu-iconic-icon {
 fill: orange !important;

}

 /* Smart bookmark folder */
  1. bookmarks-view treechildren::-moz-tree-image(container, query),
  2. PlacesToolbarItems toolbarbutton[container="true"][query="true"] .toolbarbutton-icon,
  3. PlacesToolbarItems menu[container="true"][query="true"] .menu-iconic-left,
  4. BMB_bookmarksPopup menu[container="true"][query="true"] .menu-iconic-icon,
  5. bookmarksMenu menu[container="true"][query="true"] .menu-iconic-icon {
 fill: #69c !important; /* similar to blue smart folder color */

}

 /* These "containers" are SVG in the sidebar, not yet on the menu */
  1. bookmarks-view treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksMenu) {
 fill: olive !important;

}

  1. bookmarks-view treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksToolbar) {
 fill: olive !important;

}

  1. bookmarks-view treechildren::-moz-tree-image(container, OrganizerQuery_UnfiledBookmarks) {
 fill: olive !important;

} /* Avoid overriding classic Bookmarks Toolbar and Other Bookmarks icons in menus */

  1. BMB_bookmarksPopup #BMB_bookmarksToolbar.menu-iconic-icon,
  2. bookmarksMenu #bookmarksToolbarFolderMenu.menu-iconic-icon {
 list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png") !important;

}

  1. BMB_bookmarksPopup #BMB_unsortedBookmarks.menu-iconic-icon,
  2. bookmarksMenu #menu_unsortedBookmarks.menu-iconic-icon {
 list-style-image: url("chrome://browser/skin/places/unsortedBookmarks.png") !important;

} /*

   Display the status bar in Firefox Quantum (Firefox 57+)
   permanently at the bottom of the browser window.
   Code below works best for the Light Firefox theme and is based on:
   https://github.com/MatMoul/firefox-gui-chrome-css/blob/master/chrome/userChrome.css
  • /
  1. browser-bottombox {
   height: 20px;
   border-top: solid 1px #CCC;

}

.browserContainer>statuspanel {

   left: 4px !important;
   bottom: 0;
   transition-duration: 0s !important;
   transition-delay: 0s !important;

}

.browserContainer>statuspanel>.statuspanel-inner>.statuspanel-label {

   margin-left: 0 !important;
   border: none !important;
   padding: 0 !important;

}

window[inFullscreen="true"] #browser-bottombox {

   display:none !important;

}

window[inFullscreen="true"] .browserContainer>statuspanel[type="overLink"] .statuspanel-label {

   display:none !important;

}

.toolbarbutton-icon {

   fill: darkblue !important;

}


  1. main-window:not(#f) #back-button {
 list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAjUlEQVR42uWXwQrAIAxD9f8/OttlIDK2mkYrVvCYl3cQtbX4Fu5dPQBPGAIGHYaAQYchYNBhCBh0GAIGHYaAQYchYNDhv/KpApbyaQLW8ikCI+Xu1QssLe8Flpe3AiHlj0BY+TYCJVJim0MYJrHdRcRInPkYjUic/SGxSOT4lH5J5BpM3iRyDqethItxAaTNIBfhl7xRAAAAAElFTkSuQmCC") !important;

}

  1. main-window:not(#f) #forward-button {
 list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAkElEQVR42sWXSw7AIAhEy/0P3ZoumtRoKyPwSFy4YObFL9ixH2cbpibLiR2ArBUJIOlFA7g1MwBculkAy9qZAEv62QC/HhUAnz5VAFOvSoChnzkFIsL6STXAC4ICeCBIgNufBsBXAAdAtwA9hOg1tOlEjO2nuAoA/YzQ7xgtSNCSDC1K0bIcbUzQ1gxtTmWdCyMiIB+7tLLnAAAAAElFTkSuQmCC") !important;

}

'''Can I Make the Bookmarks Folders a Solid Color in FF 89? Mac OS ... ''The bookmarks folders on the sidebar are all "transparent" (for lack of a better word). I'd like them to be a solid light blue. Better for my eyes. Is there an add on, an about:config setting or a rule I can add to Chrome that will allow this? I am not speaking of the bookmarks toolbar up top, but the icons for the folders in the bookmarks sidebar on the left. If there is a solution, although I am fairly FF literate, I am not a guru, so any real basic "See Spot run" instructions are most appreciated!'' If it is of any help, here are my Chrome settings for appearance:''' #PlacesToolbarItems, #sidebar-search-container #search-box, .sidebar-placesTree { font-size: 16px !important; font-weight: bold !important; } label.tab-text { font-size: 16px !important; } label.tab-text { font-weight: bold !important; } #nav-bar { /* main toolbar */ -moz-box-ordinal-group: 1 !important; box-shadow: none !important; } #PersonalToolbar { /* bookmarks toolbar */ -moz-box-ordinal-group: 2 !important; } #TabsToolbar { /* tab bar */ -moz-box-ordinal-group: 3 !important; padding-top: 0 !important; } /* Clean up spacing */ .titlebar-placeholder { display: none !important; } toolbarbutton.bookmark-item { padding-top: 2px !important; padding-bottom: 2px !important; } :root { --tab-curve-width: 30px; --tabs-border: transparent !important; } .arrowscrollbox-scrollbox { padding-inline-start: 10px !important; } /* To be able to see the top border of the tab */ .tab-stack { margin-top: 2px !important; } /* When the window is maximized, the first pinned tab is properly displayed. */ #TabsToolbar { padding-inline-start: 15px !important; } .titlebar-placeholder { border: none !important; } /* Remove unneeded styles from Photon */ .tabbrowser-tab::before, .tabbrowser-tab::after { border: none !important; } /* Windows 7 specific */ #browser-panel .tabbrowser-tab { background-color: transparent !important; border: none !important; } .tabbrowser-tab > .tab-stack > .tab-background { background-image: none !important; -moz-box-orient: horizontal !important; background-color: transparent !important; margin-top: 1px !important; } .tab-background[selected="true"] { border: none !important; } .tab-line { display: none !important; } .tab-bottom-line { display: none !important; } /* Match height of new tab button (right svg) on hover */ .tabs-newtab-button { margin: 0 !important; } /* overlap the tab curves */ .tab-background { -moz-margin-end: -15px !important; -moz-margin-start: -15px !important; } /* Begin tab background customizations */ .tab-background[selected="true"]::before { border: none !important; content: "" !important; width: 30px !important; min-height: 30px !important; display: -moz-box !important; background-repeat: no-repeat !important; } .tab-background[selected="true"]::after { border: none !important; content: "" !important; width: 30px !important; min-height: 30px !important; display: -moz-box !important; background-repeat: no-repeat !important; } .tab-background[selected="true"] > spacer { margin-top: 0px !important; } #new-tab-button, .tabs-newtab-button { width: calc(36px + 30px) !important; margin-inline-start: -15px !important; margin-top: 1px !important; } /* Tab hover customizations */ /* Regular tabs */ .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::before { display: -moz-box !important; background-repeat: no-repeat !important; content: "" !important; width: 30px !important; max-height: 30px !important; background-color: transparent !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::after { display: -moz-box !important; background-repeat: no-repeat !important; content: "" !important; width: 30px !important; max-height: 30px !important; background-color: transparent !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]) > spacer { margin-top: 0px !important; } #TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]), .tabs-newtab-button:hover, .tabs-newtab-button:hover::before, .tabs-newtab-button:hover::after { background-color: transparent !important; } /* New tab hover customizations */ .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]), .tabs-newtab-button:hover { background-position: 0px 2px, 30px 4px , 36px 2px !important; background-repeat: no-repeat !important; background-size: 30px 30px, calc(100% - (2 * 30px)) 30px, 30px !important; } .tabs-newtab-button:hover > .toolbarbutton-icon { background: none !important; background-color: transparent !important; } /* Color specific customizations */ :root { --svg-selected-before: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgb(245,246,247);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --svg-selected-after: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgb(245,246,247);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --background-selected-middle: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), linear-gradient( transparent 2px, rgb(245,246,247) 2px, rgb(245,246,247) ), none; --svg-hover-before: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='30px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='30' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgba(0,0,0, .1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --svg-hover-after: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgba(0,0,0,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --background-hover-middle: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), linear-gradient( transparent 2px, rgba(0,0,0,.1) 2px, rgba(0,0,0,.1) ), none !important; --newtab-hover: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgba(0,0,0,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"), linear-gradient(rgba(0,0,0,.1), rgba(0,0,0,.1)), url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='30px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgba(0,0,0,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); } /* OS-specific color variables */ @media screen and (-moz-windows-theme) { :root { } } @media not screen and (-moz-windows-theme) { :root { } } .tab-background[selected="true"]::before { background-image: var(--svg-selected-before) !important; } .tab-background[selected="true"]::after { background-image: var(--svg-selected-after) !important; } .tab-background[selected="true"] > spacer { background-image: var(--background-selected-middle) !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::before { background-image: var(--svg-hover-before) !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::after { background-image: var(--svg-hover-after) !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]) > spacer { background-image: var(--background-hover-middle) !important; } .tabs-newtab-button:hover { background-image: var(--newtab-hover) !important; } /* Standard folder */ #bookmarks-view treechildren::-moz-tree-image(container), #PlacesToolbarItems toolbarbutton[container="true"] .toolbarbutton-icon, #PlacesToolbarItems menu[container="true"] .menu-iconic-left, #BMB_bookmarksPopup menu[container="true"] .menu-iconic-icon, #bookmarksMenu menu[container="true"] .menu-iconic-icon { fill: #104B87 !important; /* slightly muted gold */ } /* Live Bookmark (RSS Feed) */ #bookmarks-view treechildren::-moz-tree-image(container, livemark), #PlacesToolbarItems toolbarbutton[container="true"][livemark="true"] .toolbarbutton-icon, #PlacesToolbarItems menu[container="true"][livemark="true"] .menu-iconic-left, #BMB_bookmarksPopup menu[container="true"][livemark="true"] .menu-iconic-icon, #bookmarksMenu menu[container="true"][livemark="true"] .menu-iconic-icon { fill: orange !important; } /* Smart bookmark folder */ #bookmarks-view treechildren::-moz-tree-image(container, query), #PlacesToolbarItems toolbarbutton[container="true"][query="true"] .toolbarbutton-icon, #PlacesToolbarItems menu[container="true"][query="true"] .menu-iconic-left, #BMB_bookmarksPopup menu[container="true"][query="true"] .menu-iconic-icon, #bookmarksMenu menu[container="true"][query="true"] .menu-iconic-icon { fill: #69c !important; /* similar to blue smart folder color */ } /* These "containers" are SVG in the sidebar, not yet on the menu */ #bookmarks-view treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksMenu) { fill: olive !important; } #bookmarks-view treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksToolbar) { fill: olive !important; } #bookmarks-view treechildren::-moz-tree-image(container, OrganizerQuery_UnfiledBookmarks) { fill: olive !important; } /* Avoid overriding classic Bookmarks Toolbar and Other Bookmarks icons in menus */ #BMB_bookmarksPopup #BMB_bookmarksToolbar.menu-iconic-icon, #bookmarksMenu #bookmarksToolbarFolderMenu.menu-iconic-icon { list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.png") !important; } #BMB_bookmarksPopup #BMB_unsortedBookmarks.menu-iconic-icon, #bookmarksMenu #menu_unsortedBookmarks.menu-iconic-icon { list-style-image: url("chrome://browser/skin/places/unsortedBookmarks.png") !important; } /* Display the status bar in Firefox Quantum (Firefox 57+) permanently at the bottom of the browser window. Code below works best for the Light Firefox theme and is based on: https://github.com/MatMoul/firefox-gui-chrome-css/blob/master/chrome/userChrome.css */ #browser-bottombox { height: 20px; border-top: solid 1px #CCC; } .browserContainer>statuspanel { left: 4px !important; bottom: 0; transition-duration: 0s !important; transition-delay: 0s !important; } .browserContainer>statuspanel>.statuspanel-inner>.statuspanel-label { margin-left: 0 !important; border: none !important; padding: 0 !important; } window[inFullscreen="true"] #browser-bottombox { display:none !important; } window[inFullscreen="true"] .browserContainer>statuspanel[type="overLink"] .statuspanel-label { display:none !important; } .toolbarbutton-icon { fill: darkblue !important; } #main-window:not(#f) #back-button { list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAjUlEQVR42uWXwQrAIAxD9f8/OttlIDK2mkYrVvCYl3cQtbX4Fu5dPQBPGAIGHYaAQYchYNBhCBh0GAIGHYaAQYchYNDhv/KpApbyaQLW8ikCI+Xu1QssLe8Flpe3AiHlj0BY+TYCJVJim0MYJrHdRcRInPkYjUic/SGxSOT4lH5J5BpM3iRyDqethItxAaTNIBfhl7xRAAAAAElFTkSuQmCC") !important; } #main-window:not(#f) #forward-button { list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAkElEQVR42sWXSw7AIAhEy/0P3ZoumtRoKyPwSFy4YObFL9ixH2cbpibLiR2ArBUJIOlFA7g1MwBculkAy9qZAEv62QC/HhUAnz5VAFOvSoChnzkFIsL6STXAC4ICeCBIgNufBsBXAAdAtwA9hOg1tOlEjO2nuAoA/YzQ7xgtSNCSDC1K0bIcbUzQ1gxtTmWdCyMiIB+7tLLnAAAAAElFTkSuQmCC") !important; }

Ændret af pcbjr den

Alle svar (1)

more options

PS - Example screenshot ...