Can Stylus be applied to the Stylus editor (CodeMirror)? It used to work.

[sasgrw]

I have the following line in my Stylus style:

.CodeMirror-line {font-size:1.4em !important}

This used to increase the fontsize when I was using the editor in Stylus but it no longer works. I think the last time I noticed it working was maybe a month ago, although my timing could be off. I know it used to work. Has anything changed in Stylus itself so that it doesn't apply styles to the Stylus editor?

If I view a page where Stylus is be applied, I can see my Stylus styles being included at the end of the page via a <style> element. This <style> element does not exist when I view the code inspector for the Stylus editor so my Stylus styles are not being included.

Was this an intentional change?

[siffegh]

.CodeMirror-line {font-size:1.4em !important} works for me, as does .CodeMirror {font-size: 15px !important;}.

[tophf]

Confirming. Still works. There's no change.

[sasgrw]

I just noticed that the Stylus icon in my plugin list is turned off when I'm in the Stylus editor. If I try to turn it on, it says "No styles installed for this site."

That would explain why my style isn't being applied but why does Stylus turn itself off when I'm editing the style?

[sasgrw]

I looked through all the Options and didn't see anything that might affect it.

[tophf]

I can't guess what happens based on your description. I'd need to see the exact sequence and the code of the style.

[tophf]

Hmm, wait, I have an idea: you may have excluded the editor accidentally:

[sasgrw]

Video attached.

stylus.mp4

[sasgrw]

There is no domain to exclude. I'm in the Stylus editor and there isn't a 3-vertical-dot menu in the Stylus dialog as seen in the video.

[tophf]

Judging by the video you're using a global style i.e. without site qualifiers. Previously such styles were mistakenly applied to the Stylus' own UI, consequently making it unusable. We fixed this bug, so global styles currently apply only to the web sites.

To style Stylus editor or any other page of Stylus extension you need to do it in a section that explicitly targets the extension e.g. you can use URL prefix moz-extension:// and/or chrome-extension://.

[sasgrw]

That's too bad. I took advantage of that feature, having it applied to Stylus' UI, but it sounds like there's a workaround. I'll have to look up how to specify the prefix in the CSS.

When was this "bug" fixed? That would at least give me a timeframe for when I last saw this working.

[tophf]

If you want to use the extension the wrong way you'll have to hack it on your own.

The correct way to target a page is to create a new section and specify its target.

If the section is global like yours there'll be a + button:

click it and then set the target:

[sasgrw]

If you want to use the extension the wrong way you'll have to hack it on your own.

C'mon now. I'm a developer too and I've had tons of times when users used my code in a way I didn't expect.

I looked at the change log, https://github.com/openstyles/stylus/wiki/Log, but couldn't find when this change happened. Would you mind sharing that?

[tophf]

I don't remember.