PUBLIC MARKS from decembre with tag userstyles

I see no documentation about this and I have few suggestions about it. I think this is a must-have feature for the freedom of users. A user should be able to install styles from other sources. Example: User goes to www.example.com User clicks on the link (www.example.com/name_of_the_style.user.css) Stylish detects the link by ".user.css" component Stylish shows a dialog: "Would you like to add this site to allowed domains list?" └► This dialog is only shown once and shown when it is required └► Domains can be removed/set/added from User Styles tab in about:addons User clicks "Yes" Stylish shows another dialog "Would you like to install this style?" User clicks "Yes" The style is installed.

Users can currently install from other sources in these ways:Modify the setting extensions.stylish.install.allowedDomains in about:config and visit a site that implements the appropriate meta elements and something like this JavaScript and use its UI (supports metadata).

The @font-face CSS at-rule allows you to define and use your own custom fonts, thus allowing you to extend the limited set of standard system fonts that are installed by default on a computer, and that browsers can access and use.

ss16 - a self-centered, fresh attempt at (user)styling 4chan * * created on: February 11th, 2016 * last modified: May 16th, 2017 * 4chan X version: ccd0 1.13.89.3 / https://github.com/ccd0/4chan-x * created by: @saxamaphone69 * (loose) coding style: https://github.com/necolas/idiomatic-css * * in an attempt to make the style as user-friendly as possible, i will * comment most of the css to explain what it all does * * please leave any comments, suggestions, or feedback on github: * https://github.com/saxamaphone69/ss16 * */ /** * this userstyle utilises a lot of best practices * and sensible defaults inspired from a variety of * stylish and modern web frameworks and resources, mainly: * https://github.com/twbs/bootstrap */ /** * first thing we do, is we use web fonts from google! * this is so users aren't required to download fonts prior. * and of course, if you don't want to or don't like it, * delete or change it accordingly. we use roboto, roboto mono, * karla, and material icons. circular has been removed in the production * version of ss16 to not only keep the file size down, but also * to not have a font that i don't own the license for :^) */

Firefox 57 or Stylish 3.0 users: - Expand the "Show CSS Code" panel - Copy/paste into a userChrome.css file. More information on creating a userChrome.css file:

/* * Edit this file and copy it as userChrome.css into your ff profile */ /* Show TAB favicon only on selected tab */ #feed-button { display: none !important } #urlbar[level] .autocomplete-textbox-container >* { background-color: #FFFFB7 !important; } .autocomplete-history-dropmarker { display: none !important; } /* Hide Tabbar close Button */ /* tabbrowser .tabs-closebutton-box { display: none; } */ /* PERSONAL TOOLBAR */ /* * Note: Rules affecting icons on the PT do not apply to folder contents. * Those are governed by "Bookmarks menu" rules. * Taken from: http://www.mozilla.org/unix/customizing.html#usercss */ /* Kill FOLDER / bookmark icons in the Personal Toolbar */ toolbarbutton.bookmark-item > .toolbarbutton-icon { display: none; } /* BOOKMARKS MENU */ /* OK - kill icons for bookmark groups in Bookmarks menu */ menuitem.bookmark-group > .menu-iconic-left { display: none; } /*hide noscript icon in contextual menu*/ .menu-iconic[id*="noscript-"] > .menu-iconic-left .menu-iconic[class*="noscript-"] > .menu-iconic-left .menuitem-iconic[class*="noscript-"] > .menu-iconic-left { visibility: hidden !important; } /* TABS */ .tabbrowser-tab[selected="true"] { border: none !important; font-family: "pragmata" !important; border-radius: 0 !important; padding-left: 5px !important; padding-right: 5px !important; background: red !important; } .tabbrowser-tab:not([selected="true"]) { border: none !important; font-family: "pragmata" !important; background: #222 !important; border-radius: 0 !important; padding-left: 5px !important; padding-right: 5px !important; } { -moz-appearance: none !important; } #content browser{margin-right:-16px!important;overflow-y:scroll;overflow-x:hidden;} .appmenu-button-container { background: #303030 !important; } #navigator-toolbox #TabsToolbar, { background: #303030 !important; } #appmenu-toolbar-button, .tabbrowser-tab { font: 10pt "pragmata" !important; background-color: #303030 !important; text-shadow: none !important; color: #676767 !important; } #urlbar { height: 22px; } .appmenu-toolbar-button { background: #303030 !important; color: #676767 !important; text-align: left !important; margin: 0 3px 0 0px !important; padding: 0 0 0 0 !important; } .toolbarbutton-menu-dropmarker { display: none !important; } #navigator-toolbox #TabsToolbar { background: #303030 !important; padding: 0px 0px !important; height: 20px !important; } .tabbrowser-tab { text-align: center !important; color: #676767 !important; background: #303030 !important; margin: -2px 0px 0px 0px !important; padding: 0px 2px 0px 4px !important; border: 0 !important; border-left: 0px solid #676767 !important; border-right: 0px solid #676767 !important; border-radius: 0px !important; } .tabbrowser-tab[selected="true"] { /*background: #202020 !important;*/ background: red !important; border-left: 0px solid #676767 !important; border-right: 0px solid #676767 !important; padding: 0px 2px 0px 3px !important; color: #ababab !important; }

A thin modern-looking scrollbar for all sites. Just as easy to use as the normal one but uses less screen space.

First Visit RawGit as suggested earlier Next copy your file path from github into the RawGit box RawGit will automatically produce two refrences to your web page The Development and Production refrence refrence the development link in your webpage if you are still developing save/upload then reload your webpage if there was no change it means your browser has saved your former refrence clear your browser data then reload Hope that helps?

To save other people some grief, I want to note that the different hosts in extensions.stylish.install.allowedDomains are SPACE separated. I assumed comma and it really tripped me up. I apologize for resurrecting a few old threads, but I just happened on one after another trying to figure this out. I want to avoid anyone else getting stuck like this

Users can currently install from other sources in these ways: Visit a CSS file, click the Stylish icon, click Add File to Stylish (no metadata will be loaded, but updates will work) From the Stylish tab in the Add-ons Manager, click Install from URL, and provide the URL to a CSS file (again, no metadata, but updates work) Modify the setting extensions.stylish.install.allowedDomains in about:config and visit a site that implements the appropriate meta elements and something like this JavaScript and use its UI (supports metadata). Use Install from URL and provide a URL that implements the appropriate meta elements. This way, the site does not need to implement any JS and does not need to be in extensions.stylish.install.allowedDomains (supports metadata) So basically the missing portion to achieve what you want is some way to more easily add a site to extensions.stylish.install.allowedDomains. I would also to give some thought as to how to prevent abuse of this feature. For example, there's nothing currently stopping a site from opening infinite prompts until the user installs.

Instead of having to get an userstyles.org account, it would be much easier to be able to install user styles directly from dA. The process for the upload could be similar to what we have with installable skins right now (based on .txt files with mandatory wrapping code). Imo it's also more logical if dA styles would stay on dA. No need to rely on outside sources. If implemented there needs to be an way to be able to update styles though, to work on bug fixes or do updates from time to time. Similar to the installable skins, you then would have an install button at the deviation page of those styles directly. This would be less scary for people who are warned that there are monsters outside dA and - which would be another big plus (i am totally not biased here lol) - it would make miscats to that gallery nearly impossible.

User Style Extractor (stylish.sqlite). Drag and drop the stylish.sqlite file* onto the gray box. This file is not sent to the network, it is only read within this page in your browser.

FreeStyler

Stylish Add-on with various tweaks to accommodate Stylish Custom² and Stylish Editor² add-ons.

Iconic Font is a free set of 263+ finest icons in one font for your next project. @font-face: .im { display: inline-block; font: 24px/1 "iconmonstr-iconic-font"; text-rendering: auto; }

Toogle Style Lite: https://dl.dropboxusercontent.com/u/77691265/ToggleStyleLite.htm Requires Custom Buttons extension: http://en.sourceforge.jp/frs/g_redir.php?m=jaist&f=/custombuttons/custombuttons-0.0.5.9pre1-20140622.xpi Middle-click button for settings dialog to enter the ID# of the style to be toggled and other various options, including setting-up a keyboard shortcut (hotkey). Left-click button to toggle on/off style. Style Toggler: https://dl.dropboxusercontent.com/u/77691265/StyleToggler.htm Generates a list of all/selected styles with various options.

Hide "add as an application for mailto links" notifications : notification[value="Protocol Registration: mailto"] { display: none !important; }

Fonts with support for much of the unicode standard.

This "base styles sheet". It sets default styling for many elements, follows a couple of recommendations regarding usability/accessibility, and addresses a few "common issues" as well. What does it do that a reset doesn't? It fixes a few things: 1- It forces a gutter for a vertical scrollbar (when content is too short to require a scrollbar) 2- It includes an IE button width fix 3 -It removes "sticky" outline (not in Internet Explorer though) 4- It prevents "mysterious gaps below images" It prevents descenders letters in legend from being cut-off in Internet Explorer 5- It vertically aligns checkboxes and radio buttons with their label 6- It sets a default color background for the document with no shrink wrap effect on body1 7- It styles lists by default

Vieux tuto: Mais utile.Découvrir Firefox si vous ne le connaissez pas (partie 1) et/ou de vous montrer comment modifier Firefox comme vous le voulez.

DefaultIcon ver 0.11 by Interactivemania : .h_icn_previous{ background: url(http://cdn1.iconfinder.com/data/icons/defaulticon/icons/png/32x32/media-fast-forward.png) !important; background-size: 27px 17px !important; transform: rotate(180deg) !important; }

@namespace url(http://www.w3.org/1999/xhtml); @-moz-document domain("deezer.com") { @font-face { font-family: 'Boogaloo'; font-style: normal; font-weight: 400; src: local('Boogaloo'), local('Boogaloo-Regular'), url(https://themes.googleusercontent.com/static/fonts/boogaloo/v3/1x_XysQB9ZwoSzu9a0nb7PesZW2xOQ-xsNqO47m55DA.woff) format('woff'); }