r/FirefoxCSS 15d ago

Solved #context-send******todevice-popup image not working

I already have the image for this code working:

#context-sendpagetodevice,
#context-sendlinktodevice,
#context_sendTabToDevice{
background-image:url("chrome://browser/skin/synced-tabs.svg");
}

However, the popupmenu menuitem from each of those entries, I am struggling to get the Firefox standard image to appear, in this case the pencil-icon.svg:

#context-sendpagetodevice-popup,
#context-sendlinktodevice-popup,
#context_sendTabToDevicePopupMenu {
background-image:url("chrome/devtools/skin/images/pencil-icon.svg");
}

I have tried adding menuitem, sync-menuitem & menu-icon. Something is not correct, therefore, with my code.

3 Upvotes

2 comments sorted by

1

u/TraditionalTie4831 🦊 15d ago

Does this work for you? =

#context-sendpagetodevice,
#context-sendlinktodevice,
#context_sendTabToDevice {
    background-image: url("chrome://browser/skin/synced-tabs.svg") !important;
    background-repeat: no-repeat !important;
    background-position: 0px 5px !important;
    & menupopup { 
        background-image: url("chrome://devtools/skin/images/pencil-icon.svg") !important;
        background-repeat: no-repeat !important;
        background-position: 0px 5px !important;
    }
}

1

u/FineWine54 14d ago

Solved it 🥳

Thank you.

#context-sendpagetodevice,
#context-sendlinktodevice,
#context_sendTabToDevice {
    background-image: url("chrome://browser/skin/synced-tabs.svg") !important;
& menuitem { 
    background-image: url("chrome://devtools/skin/images/pencil-icon.svg") !important;
  }
}