Bug 37770

Summary: Web Inspector: put checkbox to disable/enable styles to the left of the property
Product: WebKit Reporter: lensco <lensco>
Component: Web Inspector (Deprecated)Assignee: Annie Sullivan <sullivan>
Status: RESOLVED DUPLICATE    
Severity: Normal CC: apavlov, bweinstein, joepeck, keishi, mathias, paulirish, pfeldman, pmuellr, poppyto, rik, sullivan
Priority: P2    
Version: 528+ (Nightly build)   
Hardware: All   
OS: All   
Attachments:
Description Flags
Patch
pfeldman: review-
[IMAGE] Before
none
[IMAGE] After
none
after-2 none

Description lensco 2010-04-18 03:01:58 PDT
Judging by Fitts's law and personal experience, the checkbox to disable/enable a certain property in the styles panel should go on the left of the property, not the right. Especially when you make the styles panel wider, the checkbox is too far from the property itself.

Pfeldman noted (http://lensco.be/2010/04/15/webkit-inspector-wish-list/#comment-304) that this "is tough due to expandable shorthands" but I don't really see that problem?
Comment 1 poppyto 2011-06-22 11:20:41 PDT
A lot of developers dislike this right css checkbox.
AND The modification is very...trivial !

The solution is in this issue :

http://code.google.com/p/chromium/issues/detail?id=66628

I think it's VERY important to implement this issue, I have personally had enough to use Firefox&Firebug for add/remove style.
Comment 2 Annie Sullivan 2011-07-25 13:46:02 PDT
Created attachment 101902 [details]
Patch

Implements suggestions from comments 4 and 7 of Chromium bug 66628
Comment 3 Pavel Feldman 2011-07-25 14:04:14 PDT
Created attachment 101907 [details]
[IMAGE] Before
Comment 4 Pavel Feldman 2011-07-25 14:04:59 PDT
Created attachment 101908 [details]
[IMAGE] After
Comment 5 Pavel Feldman 2011-07-25 14:12:38 PDT
"After" looks way more cluttered to me. Can we show checkboxes on hover + to the left from the expand arrows without indenting the content?

Nit: It seems to be broken a bit (longhand properties are indented way too much), while editing name, edit box touches checkbox.

Could you start with a mock / screenshot instead? I don't think we should make new looks default, but we now have settings + ability to track user preference.
Comment 6 Pavel Feldman 2011-07-25 14:13:24 PDT
Comment on attachment 101902 [details]
Patch

r- for minor glitches. lets start with the mock too.
Comment 7 poppyto 2011-07-27 07:34:08 PDT
Many Thanks for adding my patch :)
Regards
Comment 8 poppyto 2011-07-27 07:41:55 PDT
I also disagree about checkboxes always visible.

(In reply to comment #5)
> "After" looks way more cluttered to me. Can we show checkboxes on hover + to the left from the expand arrows without indenting the content?
> 
> Nit: It seems to be broken a bit (longhand properties are indented way too much), while editing name, edit box touches checkbox.
> 
> Could you start with a mock / screenshot instead? I don't think we should make new looks default, but we now have settings + ability to track user preference.
Comment 9 Ingo Chao 2011-12-13 02:17:59 PST
Created attachment 118980 [details]
after-2

checkbox to the left, then the longhand indicator, then the property/value
Comment 10 Alexander Pavlov (apavlov) 2012-02-17 03:44:20 PST

*** This bug has been marked as a duplicate of bug 78780 ***