DevTools/Features/CSSDoctor: Difference between revisions

Revision as of 11:26, 19 May 2011

Feature	Status	ETA	Owner
Style Doctor	need a test page to try out the rules+results	2011-05-19	Kevin Dangoor

Summary

The goal of the Style Doctor is to answer the question "why doesn't this look the way I expected it to?" as quickly as possible.

CSS rule precedence is complex and little understood and the Style Doctor will help users get their layouts working 'and' help them learn precedence at the same time.

Team

Have ideas on solving this problem well? Do you know the dark, secret rules of CSS? Join us on #devtools on irc.mozilla.org, dev-apps-firefox or in our weekly devtools call and help out!

Feature Manager: Kevin Dangoor (irc: kdangoor)
Lead Developer: Joe Walker (irc: jwalker)
Product Manager: Kevin Dangoor (irc: kdangoor)
QA: TBD
UX: TBD
Security: TBD

Release Requirements

integrates with nodes selected via the Highlighter, GCLI or other means
can provide answers for a "substantial" set of node/rule combos.

Next Steps

test page with examples that test each rule
need the same thing working as a traditional addon
enough rules to produce interesting results (perhaps ~15)
- click around and get a sensible answer for many cases
- those selectors don't match
- everything is actually fine, the rule did apply

Open Issues

can this work with multiple selected nodes?

Related Bugs & Dependencies

Source at Github. At some stage we should move this back into Moz/HG.
Demo video.
- Pages from video: demo test
Documentation
Status

Designs

(I believe Joe has some writeups we can add here...)

Use Cases

TBD

Test Plans

TBD

Goals/Use Cases

TBD

Non-Goals

TBD

@@ Line 52: / Line 52: @@
 == Related Bugs & Dependencies ==
-* Source: https://github.com/joewalker/csstools
+* Source [https://github.com/joewalker/csstools at Github]. At some stage we should move this back into Moz/HG.
-* Demo video: https://people.mozilla.com/~jwalker/cssdoctor/cssdoctor.webm
+* [https://people.mozilla.com/~jwalker/cssdoctor/cssdoctor.webm Demo video].
-* Demo pages (from video): https://people.mozilla.com/~jwalker/cssdoctor/demo.html https://people.mozilla.com/~jwalker/cssdoctor/test.html
+** Pages from video: [https://people.mozilla.com/~jwalker/cssdoctor/demo.html demo] [https://people.mozilla.com/~jwalker/cssdoctor/test.html test]
-* Documentation: https://github.com/joewalker/csstools/blob/master/docs/main.md
+* [https://github.com/joewalker/csstools/blob/master/docs/main.md Documentation]
-* Status: http://mozilla.github.com/devtools/2011/status.html#cssdoctor
+* [http://mozilla.github.com/devtools/2011/status.html#cssdoctor Status]
 == Designs ==