Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

Userstyles Suck: How to easily Convert an Userstyle to an Geasemonkey script for Friefox / Chrome ?

edited May 2017 in Style Development Waterfox
Userstyles Suck: How to easily Convert an Userstyle to an Geasemonkey script for Friefox / Chrome ?
Any suggestions can be posted here....

Read :
Stylish and have a new owner - [ghacks] Last Update:October 9, 2016


  • Waterfox
    Custom Widescreen CSS theme for and greasyFork / SleasyFork using a new way to use an userstyle in a GM directly - by usign the Library "addStyleEx" by leoncastro.

    With this Library we don't need to post before our Userstyle in PasteBin (by example).
    But we need to edit it when we build the userscript.

    leoncastro provide to me a template to help me :


    Template strings,
    you can copy-paste your code, but:
    1. grave symbols (`) are used as enclosure
    so you need to replace every grave symbol "`" with their html version "`"
    2. octal literals are not allowed
    on character strings you can translate their values to unicode format: octal("\033") == unicode("\u001b")
    sometimes your values are already hexadecimal, like "\A" or "\25B6", so you just need to put "\u000A" or "\25B6".
    How to use:

    var css_example = `
    body {
    color: black;
    div.someclass:before {
    content: "Normal text, `escape` text";

    Replacements needed in this example:
    Find Count Replacement Comments
    ` 6 ` grave to html
    \A 100 \u000A hex to unicode
    \25B6 23 \u25B6 hex to unicode
    \25BA 1 \u25BA hex to unicode
    \01F53B 1 \u01F53B hex to unicode
    \270E 1 \u270E hex to unicode
    \2717 1 \u2717 hex to unicode

    AND :

    Used to filter styles used only in certain locations.
    How to use:

    if( location.href.match(/REGEXP/i) ) // REGEXP: see bellow table
    addStyleEx(css_example, uniqueid_example);

    - Allways:
    Stylish-selector: (none)
    Userscript-header: @include *//*/*
    Userscript-regexp: (do not use conditions)

    - Stylish-selector: @-moz-document domain("")
    Userscript-header: @include*
    and/or @include*

    - Userscript-regexp: (https?:)?\/\/\/.*
    Stylish-selector: @-moz-document url-prefix("http://urlprefix")
    Userscript-header: @include http://urlprefix*
    Userscript-regexp: (https?:)?\/\/\/.*

    - Direct URL:
    Stylish-selector: @-moz-document url("http://someurl")
    Userscript-header: @include http://someurl
    Userscript-regexp: http:\/\/someurl

    - RegExp:
    Stylish-selector: @-moz-document regexp("some\\reg\\exp")
    Userscript-header: @include /some\reg\exp/
    (replace \\ with \)
    Userscript-regexp: some\\reg\\exp

    - common style, do not use conditions

    why not ?, better use a regex:
    if( location.href.match(/(https?:)?\/\/(greasy|sleazy)fork\.org\/([\w-]+)?scripts\/19838-diep-io-by-terjanq\/.*/i) )

    if( location.href.match(/(https?:)?\/\/sleazyfork\.org\/.*/i) )

    if( location.href.match(/(https?:)?\/\/userstyles\.org\/help\/.*/i) )

    Thanks to the very active help of the author of "addStyleEx", leoncastro :
    Fine and Simple style : just a question about your "addStyleEx" and the library "addstylish lib"

    Here a (working...) Test :
    Userstyles TableView+Enhancer - Dark-Grey 57

    That's a previous version because my last version (v.59.1) seems not working....
Sign In or Register to comment.