[Webkit-unassigned] [Bug 145985] New: Web Inspector: Styles Top Options Use Too Much Vertical Real Estate

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=145985

            Bug ID: 145985
           Summary: Web Inspector: Styles Top Options Use Too Much
                    Vertical Real Estate
    Classification: Unclassified
           Product: WebKit
           Version: 528+ (Nightly build)
          Hardware: Macintosh
                OS: Mac OS X 10.10
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Web Inspector
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: chris at heavymark.com
                CC: graouts at webkit.org, joepeck at webkit.org,
                    jonowells at apple.com, mattbaker at apple.com,
                    nvasilyev at apple.com, timothy at apple.com,
                    webkit-bug-importer at group.apple.com

Created attachment 254889
  --> https://bugs.webkit.org/attachment.cgi?id=254889&action=review
Comparing top of Chrome and Safari's style inspector

On Safari 8.1 on 10.11.

As Front End developers work away typically on their Macbook Pro's or other laptops, the Style sidebar is very small, thus conservative padding, font sizes, line-heights, and elements are very important. In the new Safari an enormous portion of real estate is now taken up by default as seen in the screen. That is compared to Chrome which uses just a sliver, and allows the user to show the same options by clicking buttons when needed, but not clog the sidebar when not needed. Once again, visually Safari's looks great, just not very functional compared to Chrome's implementation. I do prefer Safari's single row of state radio buttons (compared to Google's two rows), if it were just hidden by default. Having Computed, Rules, Metrics shown by default on one rule makes sense. I think The Node, Styles, Layers should however be on the same row left aligned and only show one at a time such as "Styles" with a dropdown arrow that allows you to toggle between Styles, Node, Layers, etc. Or which

To note, Firefox I believe allows you have Styles docked to the right of the window but leaving html docked to the bottom which is absolutely amazing, and surprised Safari nor Chrome ever did the same since there is extra space to the right of most all web pages when working on a typical 15in laptop. Which then would make the space saving issues less of an issue. Though I imagine Chrome/Safari choose not to implement this for some reason.

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <https://lists.webkit.org/pipermail/webkit-unassigned/attachments/20150615/92b196cb/attachment.html>