I am using some custom SVG icons for my bookmark folders. I had my userChrome.css setup to set the icons based on the folder names, as well as color the icons with whate… (funda kabanzi)
I am using some custom SVG icons for my bookmark folders. I had my userChrome.css setup to set the icons based on the folder names, as well as color the icons with whatever the theme color was. This userChrome.css file worked fine in Firefox 116, but no longer works in 117. Now a couple of the icons are invisible, and the rest of them are black instead of the expected purple color from my theme. Can anyone help?
toolbarbutton.bookmark-item{
-moz-context-properties: fill, fill-opacity, stroke !important;
stroke: var(--toolbarbutton-icon-fill) !important;
}
.bookmark-item[container="true"] [label="Finance"] {
list-style-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 13H44V37H4V13Z' stroke='context-stroke' stroke-width='4' stroke-linejoin='round'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 21C8.41828 21 12 17.4183 12 13H4V21Z' stroke='context-stroke' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 29C8.41828 29 12 32.5817 12 37H4V29Z' stroke='context-stroke' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M44 29V37H36C36 32.5817 39.5817 29 44 29Z' stroke='context-stroke' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M44 21C39.5817 21 36 17.4183 36 13H44V21Z' stroke='context-stroke' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M24 31C26.7614 31 29 28.3137 29 25C29 21.6863 26.7614 19 24 19C21.2386 19 19 21.6863 19 25C19 28.3137 21.2386 31 24 31Z' stroke='context-stroke' stroke-width='4' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}
.bookmark-item[container="true"] [label="Health"] {
list-style-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 15 15' fill='context-fill' fill-opacity='context-fill-opacity' xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M7.5 13.5l-.354.354a.5.5 0 00.708 0L7.5 13.5zM1.536 7.536l-.354.353.354-.353zm5-5l-.354.353.354-.353zM7.5 3.5l-.354.354a.5.5 0 00.708 0L7.5 3.5zm.964-.964l-.353-.354.353.354zm-.61 10.61L1.889 7.182l-.707.707 5.964 5.965.708-.708zm5.257-5.964l-5.965 5.964.708.708 5.964-5.965-.707-.707zM6.182 2.889l.964.965.708-.708-.965-.964-.707.707zm1.672.965l.964-.965-.707-.707-.965.964.708.708zM10.964 1c-1.07 0-2.096.425-2.853 1.182l.707.707A3.037 3.037 0 0110.964 2V1zM14 5.036c0 .805-.32 1.577-.89 2.146l.708.707A4.036 4.036 0 0015 5.036h-1zm1 0A4.036 4.036 0 0010.964 1v1A3.036 3.036 0 0114 5.036h1zM4.036 2c.805 0 1.577.32 2.146.89l.707-.708A4.036 4.036 0 004.036 1v1zM1 5.036A3.036 3.036 0 014.036 2V1A4.036 4.036 0 000 5.036h1zm.89 2.146A3.035 3.035 0 011 5.036H0c0 1.07.425 2.096 1.182 2.853l.707-.707z'%3E%3C/path%3E%3C/svg%3E") !important;
}
.bookmark-item[container="true"] [label="Homelab"] {
list-style-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 15 15' fill='context-fill' fill-opacity='context-fill-opacity' xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M7.5.5l.325-.38a.5.5 0 00-.65 0L7.5.5zm-7 6l-.325-.38L0 6.27v.23h.5zm5 8v.5a.5.5 0 00.5-.5h-.5zm4 0H9a.5.5 0 00.5.5v-.5zm5-8h.5v-.23l-.175-.15-.325.38zM1.5 15h4v-1h-4v1zm13.325-8.88l-7-6-.65.76 7 6 .65-.76zm-7.65-6l-7 6 .65.76 7-6-.65-.76zM6 14.5v-3H5v3h1zm3-3v3h1v-3H9zm.5 3.5h4v-1h-4v1zm5.5-1.5v-7h-1v7h1zm-15-7v7h1v-7H0zM7.5 10A1.5 1.5 0 019 11.5h1A2.5 2.5 0 007.5 9v1zm0-1A2.5 2.5 0 005 11.5h1A1.5 1.5 0 017.5 10V9zm6 6a1.5 1.5 0 001.5-1.5h-1a.5.5 0 01-.5.5v1zm-12-1a.5.5 0 01-.5-.5H0A1.5 1.5 0 001.5 15v-1z'%3E%3C/path%3E%3C/svg%3E") !important;
}
.bookmark-item[container="true"] [label="Privacy"] {
list-style-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M12.587 3.513a6.03 6.03 0 01.818 3.745v.75c0 .788.205 1.563.595 2.247M4.483 6.508c0-.795.313-1.557.871-2.119a2.963 2.963 0 012.103-.877c.789 0 1.545.315 2.103.877.558.562.871 1.324.871 2.12v.748c0 1.621.522 3.198 1.487 4.495m-4.46-5.244v1.498A10.542 10.542 0 009.315 14M4.483 9.505A13.559 13.559 0 005.821 14m-3.643-1.498a16.63 16.63 0 01-.669-5.244V6.51a6.028 6.028 0 01.79-3.002 5.97 5.97 0 012.177-2.2 5.914 5.914 0 015.955-.004' stroke='context-stroke' stroke-linecap='square' stroke-linejoin='round'%3E%3C/path%3E%3C/svg%3E") !important;
}
.bookmark-item[container="true"] [label="Gaming"] {
list-style-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg' width='18' height='18'%3E%3Cpath d='M9.817 11.133l-.447.224.447-.224zM9.5 10.5l.447-.224A.5.5 0 009.5 10v.5zm-4 0V10a.5.5 0 00-.447.276l.447.224zm8.5-5v4.528h1V5.5h-1zm-3.736 5.41l-.317-.634-.894.448.316.633.895-.447zM9.5 10h-4v1h4v-1zm-4.447.276l-.317.634.894.447.317-.633-.894-.448zM1 10.028V5.5H0v4.528h1zM3.5 3h8V2h-8v1zm-.528 9A1.972 1.972 0 011 10.028H0A2.972 2.972 0 002.972 13v-1zm9.056 0c-.747 0-1.43-.422-1.764-1.09l-.894.447A2.972 2.972 0 0012.027 13v-1zM14 10.028A1.972 1.972 0 0112.028 12v1A2.972 2.972 0 0015 10.028h-1zm-9.264.882A1.972 1.972 0 012.972 12v1a2.972 2.972 0 002.658-1.643l-.894-.447zM15 5.5A3.5 3.5 0 0011.5 2v1A2.5 2.5 0 0114 5.5h1zm-14 0A2.5 2.5 0 013.5 3V2A3.5 3.5 0 000 5.5h1zM3 7h3V6H3v1zm1-2v3h1V5H4zm7 1h1V5h-1v1zM9 8h1V7H9v1z' fill='context-fill'%3E%3C/path%3E%3C/svg%3E") !important;
}
.bookmark-item[container="true"] [label="Firefox"] {
list-style-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='16' height='16' viewBox='0 0 1000 1000' xml:space='preserve' fill='context-fill' fill-opacity='context-fill-opacity' %3E%3Cpath d='M503.8,975c-103.2,0-195.2-27.4-275.9-82.3C147.1,837.8,87,765.2,47.6,674.7C26.5,627,14.3,572.1,11,510.1s1.5-122.6,14.2-181.8s33-116.1,60.7-170.6c27.7-54.5,60.3-98.7,97.9-132.6l-6,153.7c4-5.1,16.4-7.9,37.2-8.5c20.8-0.5,33.5,2.3,38.3,8.5c15.3-29.5,44.6-54.7,87.8-75.5c43.2-20.8,86-31.5,128.2-32.3c-19.7,16.4-41.5,43.5-65.4,81.2c-23.9,37.7-34.5,67.5-32,89.4c9.1,2.9,20.5,5.4,34.2,7.4c13.7,2,25.2,3.4,34.5,4.1c9.3,0.7,21.7,1.5,37.2,2.2c15.5,0.7,24.7,1.3,27.6,1.6c5.5,1.8,7.2,10.1,5.2,24.9c-2,14.8-7.6,28.5-16.7,41.3c-1.8,2.6-4.8,5.9-9,10.1c-4.2,4.2-14.5,10.7-30.9,19.4c-16.4,8.8-34.8,14.9-55.2,18.6l8.2,103.4l-76-36.6c-6.6,15.7-7.9,30.5-4.1,44.6c3.8,14,10.4,26.2,19.7,36.4c9.3,10.2,21.2,17.8,35.8,22.7s29.4,6.1,44.3,3.6c18.6-3.3,36.5-9.6,53.6-18.9c17.1-9.3,32.4-17.5,45.7-24.6c13.3-7.1,26.7-10.3,40.2-9.6c22.2,1.5,38.6,7.5,48.9,18c10.4,10.6,13.9,22.4,10.7,35.5c-0.4,0.7-0.8,1.7-1.4,3c-0.5,1.3-2.1,3.6-4.6,6.8c-2.6,3.3-5.8,6.1-9.8,8.5c-4,2.4-9.8,4.3-17.2,5.7c-7.5,1.5-16,1.6-25.4,0.5c-21.9,34.6-48.2,59.3-79,74.1c-30.8,14.8-69,20.1-114.6,16.1c27,22.2,56.6,37.3,88.9,45.1c32.3,7.8,63,8.9,92.2,3.3c29.2-5.7,57.3-15.1,84.5-28.4c27.2-13.3,50.5-29.3,70-47.9c19.5-18.6,34.2-37.6,44-56.9c15.7-33.2,22.8-68.3,21.3-105.3c-1.5-37-8.3-71.4-20.5-103.1c-12.2-31.7-26.5-54.5-42.9-68.4c31.7,13.9,56.7,28.3,74.9,43.5c18.2,15.1,32.3,35.6,42.1,61.5c5.5-62-5-124.5-31.4-187.6C770.2,153.4,732,101.6,682,61.1c96.6,28.1,171.7,79,225.3,152.9s81.1,168.2,82.6,283c0.7,46.3-6.7,92.8-22.1,139.5s-38,90.1-67.5,130.2c-29.5,40.1-64,75.8-103.4,107.2c-39.4,31.4-84.5,56.1-135.4,74.1C610.7,966,558.1,975,503.8,975L503.8,975z'/%3E%3C/svg%3E") !important;
}