User-Style-Manager
User-Style-Manager copied to clipboard
"Styles management" window should be reconstructed
- currently, increasing height of the window doesn't increase height of "Style Sheet List".
- this window should consist of 3 parts: a. a small menu toolbar at top (it should contain all the settings like "Style Sheet Settings", "Create Menu Entry in" "Create a keyboard shortcut" and "Shortcut key combination") b. a list of all the existing styles at the center c. control buttons at bottom (like "delete [selected] style(s)", "create a new style", "Install a new style from the file", "edit [selected] style(s)" and "[selected] style(s) info", "check for updates", etc.)
- All the buttons from "2.c." should be converted to icons only: a. "Add a new Style Sheet" > a green "+" b. "Install a new style from the file" > something like "File .." c. "check for updates" > something like a green down arrow. d. "More Info" > ( i ) e. "Edit Style Sheet" > [ * ] f. "Delete Style Sheet" > [ x ]
- "Style Sheet List" table's columns should be edited a bit: a. left column ("enabled/disabled" state) should have fixed width of ~18px. b. use date stamps of digits only (if possible, of course. I remember you said you'll look into this).
You should also decide first which way to choose: whether to
- place controls for the styles at bottom (and that would generally require 2 clicks to edit/delete/watch_info of a style) or
- place them on each like of every style (like it is done in Stylish and that would require just 1 click (you should hover the style first, so the control buttons for this style would appear)).
If you choose 2nd variant - it will be very easy to fix issue #3 with just two lines of CSS code: #userstyle:not(:hover) .edit_buttons { display: none !important; } #userstyle:hover .edit_buttons { display: -moz-box !important; }
I agree Drugoy comment. Would be great if you can move the control buttons to each style.
Also, i think that the semi-transparent blue color hover any style should be zero border radius to generate a bit of armony with the outside border from the general styles pane.
When you select an style and hover them, it generates confusion because it overwrites the selected state. I think that hover state is not needed:
treechildren::-moz-tree-row(hover) { outline: 1px solid rgba(255,255,255,.43); border: 1px solid #84acdd; background: #ecf5ff; -moz-border-bottom-colors: none; -moz-border-top-colors: none; border-radius:0px; -moz-outline-radius:2px; }