Stylebot UI, Design

[mvuljevas]

Hello 😄!, I'm a front-end developer mostly focused on UX & UI. Honestly I totally love Stylebot, but was wondering, there's a thread already to talk about the interface, extension icon and user interface improvements?

Wish to have the opportunity to contribute with my design skills, if it is possible!

[ankit]

Hi @mvuljevas - No, there isn't an existing thread. I created the user interface, icon, etc. with my limited design skills, so any improvement suggestions would be highly appreciated. feel free to bring them up in this thread.

[devtemp0]

( I hope my comments are in line with this thread. )

I'd like to offer interface suggestions for this awesome extension.

1. A method to be able to easily maintain more than one stylesheet per site. For instance you can use a global url ("*") stylesheet to apply common styles in addition to site-specific code. This currently can be enabled/disabled from any given webpage, but cannot be accessed/edited from the page. This instead requires opening the Stylebot Options page, selecting Styles, finding the stylesheet, then selecting the stylesheet for editing. Having to edit in this way also prevents the style changes from being visible on-page while editing. A second "Open Stylebot" button perhaps, or changes to the default options available from clicking on the Stylebot icon?

2. The ability to highlight or differentiate the elements on the page selected by the current line of code. The extension "Live editor for CSS, Less & Sass - Magic CSS" is an example of this presentation. ( https://chrome.google.com/webstore/detail/live-editor-for-css-less/ifhikkcafabcgolfjegfcgloomalapol ) This confirms the correct selection of the desired elements, reduces the time required to find it and reduces selection errors. Perhaps this could use something of the existing element selector capability or similar.

Thanks for keeping this extension going.