Chrome can't executeScript on file:// URLs even though we have <all_urls> in manifest.json so on such pages we'll display a warning in the popup. This should only happen when Stylus is [re]enabled/reloaded.
* restore the correct width of svg icons
* popup: use the standard formatting & SVG <symbol>
* popup .breadcrumbs hover highlight
* manage: black links, transitions; use <p> in #options; trim .homepage
* edit: move regexp tester info link to a template
* Now that our own pages retrieve the styles directly via getStylesSafe the only 0.001% of cases where code:false would be needed (the browser is starting up with some of the tabs showing our built-in pages like editor or manage) is not worth optimizing for.
* According to CSS4 @document specification the entire URL must match. Stylish-for-Chrome implemented it incorrectly since the very beginning. We detect styles that abuse the bug by finding the sections that would have been applied by Stylish but not by us as we follow the spec. Additionally we'll check for invalid regexps.
Popup:
* Enforce 200-800px range for the popup width option
Manage:
* faster search via cachedStyles.byId
* faster restoration of search results on history nav
* style name is clickable and opens the editor
* animated highlight of style element on update/add/save
* expandable extra applies-to targets
* remember scroll position on normal history navigation
* boz-sizing in #header, also in editor
* applies-to targets use structured markup
* get*Tab*, enableStyle and deleteStyle are promisified
Switched info to `i` and found a pretty nice external link icon imo. @tophf As for pixelation on the info icons, you mentioned maybe a lighter color would help. For all icons besides external links, I made them lighter with darker hovers. Besides a really high zoom, I never saw any issue to begin with, but let me know if they're alright. I also changed them to use their exact original dimensions, so maybe that helps.
Max height is 600px for the popup, regardless of resolution (so says Google), so we can set the styles section to a max height in px and let the overflow scroll inside the div, instead of scrolling the whole popup. This way the other actions are always present at the bottom of the popup without needing to scroll to use them. I left a little breathing room for the rare instance when domain name in "write style for" is long enough to cause a line break, so there should never really be any overflow for the popup itself.
https://github.com/schomery/stylish-chrome/pull/50#issuecomment-287665085
The icons I used are from right here on Github. They're SVG, so there should't be reliability issues. Wanted to see how they'd look, and I really kinda like it. Thoughts?