Stylish 0.1.1 Released [Oct 11]

[np]

Stylish 0.1.1 has been released. Stylish allows you to easily manage stylesheets that affect the look of websites and of the user interface. Supported versions: 1.4 (1.5 beta1) to 1.6a1 (trunk nightlies).

Download here

User interface
* Options/Preferences under the Extensions menu will give you the management dialog.
* Highlighting text will give you a context menu option, "Add Selection To Stylish..."
* CSS files will give you a context menu option, "Add File to Stylish..."
* Several styles are included by default (but disabled).
* The rest is self-explanatory
* Available in en-US, fr, it, es-ES, and nl-NL.

How is this better than editing userContent.css and userChrome.css?
* Takes effect almost immediately (on next page load for websites and on next window open for UI) instead of requiring a restart.
* Don't have to find your profile folder.
* Organization - you enter a description for each style instead of having them all clumped together.
* Easy to enable and disable individual styles.
* Syntax errors in an entry will not bork all subsequent entries.

Tips for writing your own styles
* Unlike userChrome.css and userContent.css, styles affect both chrome and content. If you want something to only apply to chrome, make XUL the default namespace (see default styles for examples of this). If you want something to only apply to content, use -moz-document selectors or use a descendant selector (ex: "html #ad" instead of "#ad").
* If you don't know already, -moz-document selectors are cool. They allow you to write styles that only apply to certain pages, servers, or domains instead of having to use wacky selectors to make a style apply to only one page.

Known issues
* If you delete all the styles, you can't add a new one without restarting Firefox.
* Deleting a style will hide all styles below it in the manage dialog. They reappear when the dialog is closed and reopened.
* Styles are not validated before they are added.
* Styles are not sortable

Possible future features
* If the first line of a style is comments, that should become the description of the style.
* Import userChrome.css and userContent.css
* Link to style repository

[Thumper]

Oooh. Awesome. I've spent all night being annoyed by the fact that userContent hacks won't even reload changed images in the stylesheet rules without restarting the browser.

- Chris

[Duke D]

np wrote:

next window open for UI instead of requiring a restart.

Wouldn't that pretty much be the same thing as restarting? Because if u have to open a new window the old one would not show changes it might not exactly be restarting but its just about the same thing isnt it?

[Zoolcar9]

BTW, it works on 1.4 (FF 1.5 Beta 1)

Nice extensions

[np]

Duke D wrote:

np wrote: next window open for UI instead of requiring a restart. Wouldn't that pretty much be the same thing as restarting?

Almost the same if you're a single-window kind of guy... but it's very helpful to test changes. You can have the Stylish window open, add a chrome style, then open a new Firefox window to test it without closing the Stylish (or other) windows. If there was a way to make it apply immediately, I'd do it, but I know of no such way.

I'd like to increase the amount of styles available by default... If anyone has any suggestions (especially for styles that change popular websites), I'd be glad to include them.

[Zoolcar9]

np wrote:

You can have the Stylish window open, add a chrome style, then open a new Firefox window to test it without closing the Stylish (or other) windows. If there was a way to make it apply immediately, I'd do it, but I know of no such way.

Code:

OpenBrowserWindow(); BrowserTryToCloseWindow();

np wrote:

I'd like to increase the amount of styles available by default... If anyone has any suggestions (especially for styles that change popular websites), I'd be glad to include them.

• Skinning BugZilla thread
  
  
• http://zoolcar9.lhukie.net/mozilla/userstyles/adblock.css
  

[np]

Zoolcar9 wrote:

Code: OpenBrowserWindow(); BrowserTryToCloseWindow();

Wouldn't that wipe out every page the user is on?

Thanks for the style suggestions.

[Cusser]

General feedback (in no particular order):

1. It'd be lovely if you revived the style switcher icon in the status-bar for enabling/disabling custom site stylesheets when they're installed for the current site. I suspect most themes still ship with it.
2. #1 could be expanded in the future if you're considering a repository to let users know that a stylesheet is available for that site.
3. The enabled/disabled thing works, but checkboxes would probably be nicer UI (Thumper will probably yay or nay this later on).

Otherwise, nice job, I like it. This is something I was thinking about a while ago but never got round to and it works perfectly. Kudos.

[Zoolcar9]

np wrote:

Zoolcar9 wrote: Code: OpenBrowserWindow(); BrowserTryToCloseWindow(); Wouldn't that wipe out every page the user is on? Thanks for the style suggestions.

Oops! Sorry, I missed "(or-other)" when when read "without closing the Stylish (or other) windows" /zzz damn weed

I'm using session restore from TMP, though

[np]

Cusser wrote:

1. It'd be lovely if you revived the style switcher icon in the status-bar for enabling/disabling custom site stylesheets when they're installed for the current site. I suspect most themes still ship with it.

Hmm... come to think of it, the stylesheet switcher doesn't require a reload to work... I'll look into that.

Cusser wrote:

3. The enabled/disabled thing works, but checkboxes would probably be nicer UI (Thumper will probably yay or nay this later on).

I tried to make it checkboxes at one point but couldn't get them to work in the template. I'll try harder.

Zoolcar9 wrote:

I'm using session restore from TMP, though

Perhaps I could see if a session restore extension exists, and if so, do what you've suggested.

[Zoolcar9]

Add confirmation to delete function because it made me cry when I accidentally pressed the delete button

Code:

this.deleteStyle = function() { +    var confirmDelete = window.confirm('Are you crazy?'); +    if(!confirmDelete) return;       var styles = this.getSelectedStyles(); ...

[np]

I think I'm just going to change the position of the delete button to be further away from the rest to avoid accidental clicks. I hate "Are you sure" prompts.

[np]

Stylish 0.1.1 has been released.

Changes:
- Includes fr, it, es-ES, and nl-NL locales.
- Supports 1.5 beta1 along with beta2 and 1.6 alpha nightlies.
- Delete button moved away from other buttons to prevent accidental clicking.

Sure-clicking English users without an obsolete beta should not upgrade.

[manc39]

Great stuff, np!

Worth noting also: Edit & Test Styles bookmarklets from squarefree.com <- experiment, and then save with Stylish.

[np]

I've fixed the localizations and added nl-NL (thanks RAF).