Avatar for Username

ძიება მხარდაჭერაში

ნუ გაებმებით თაღლითების მახეში მხარდაჭერის საიტზე. აქ არასდროს მოგთხოვენ სატელეფონო ნომერზე დარეკვას, შეტყობინების გამოგზავნას ან პირადი მონაცემების გაზიარებას. გთხოვთ, გვაცნობოთ რამე საეჭვოს შემჩნევისას „დარღვევაზე მოხსენების“ მეშვეობით.

Learn More

How to change the css of addons-pages

  • 5 პასუხი
  • 1 მომხმარებელი წააწყდა მსგავს სიძნელეს
  • 15 ნახვა
  • ბოლოს გამოეხმაურა Thomas likes to learn

Hey there,

How can I change the css of pages created by an addon?

(Example-URL: moz-extension://285d678c-ecb3-4003-923d-835fc9d8e0bc/reader.html)

I know how to change normal pages css via different tools like Stylus etc. (or via userContent.css). But this does not work for pages created by addons.

Can you please help me?

Hey there, How can I change the css of pages created by an addon? (Example-URL: moz-extension://285d678c-ecb3-4003-923d-835fc9d8e0bc/reader.html) I know how to change normal pages css via different tools like Stylus etc. (or via userContent.css). But this does not work for pages created by addons. Can you please help me?

გადაწყვეტა შერჩეულია

I tested on one of my pages and this worked. I did use !important which sometimes is needed to override rules that are considered to have a higher CSS specificity:

@-moz-document url("moz-extension://5cfb8e4d-ab5d-48d2-ac71-8433ee9b62cd/logaddnew.html"){ html {background-color: #fed !important;} body {background-color: transparent !important;} table#CTLog {background-color: #ffc !important;} }

(Those are not recommended colors, just for testing.)

პასუხის ნახვა სრულად 👍 1

ყველა პასუხი (5)

The userChrome.css holds style rules for modifying Firefox's user interface, right?

I am not trying to do that. I am trying to change the page itself. Normally this works via the userContent.css. But not in this case.

Is this a misunderstanding here?

Note that your Firefox 88.0 version is outdated.

Verify that you meet the System Requirements (GTK+ and GLib) for the current Firefox release.


Is this a page that the extension opens in a tab or a page that opens in a pop-up? Did you check this in the Inspector?

You normally use @-moz-document url() or url-prefix(){}

Thank you cor-el!

Yes, the extension opens this page in a tab.

And yes, I checked it with the Inspector ... and could edit and change the elements of the page just fine.

And in the /home/user/.mozilla/firefox/4fgfbksq.default/chrome/userContent.css I used:

@-moz-document domain(moz-extension://285d678c-ecb3-4003-923d-835fc9d8e0bc/reader.html) and also: @-moz-document url(moz-extension://285d678c-ecb3-4003-923d-835fc9d8e0bc/reader.html) and also: @-moz-document url-prefix(moz-extension://285d678c-ecb3-4003-923d-835fc9d8e0bc/reader.html)

... for instance followed by a simple:

{

   div#toolbar {
   background-color: #D09595;
   }

}


But in all 3 cases: No change of color. Am I missing something here?

შერჩეული გადაწყვეტა

I tested on one of my pages and this worked. I did use !important which sometimes is needed to override rules that are considered to have a higher CSS specificity:

@-moz-document url("moz-extension://5cfb8e4d-ab5d-48d2-ac71-8433ee9b62cd/logaddnew.html"){ html {background-color: #fed !important;} body {background-color: transparent !important;} table#CTLog {background-color: #ffc !important;} }

(Those are not recommended colors, just for testing.)

Halleluja!

Thank you guys so much! And especially you, jscher2000! It has indeed been the missing "!important"!

You guys are wonderful! ... and I have so much still to learn!

:-)

ჩასწორების თარიღი: , ავტორი: Thomas likes to learn