Web Inspector: Styles Redesign: Display warnings
authornvasilyev@apple.com <nvasilyev@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 7 Nov 2017 01:19:11 +0000 (01:19 +0000)
committernvasilyev@apple.com <nvasilyev@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 7 Nov 2017 01:19:11 +0000 (01:19 +0000)
commit7910d3b1e66bab4d1a3ef72d500613431005e470
tree6e85edd4a4171a36d02db99a362754372bbcffc6
parent87d811a0aeba589fca01617cdd1b33dace2e99fa
Web Inspector: Styles Redesign: Display warnings
https://bugs.webkit.org/show_bug.cgi?id=179215

Reviewed by Brian Burg.

Display warning icons on the right of the property.

For now, the warning icons have only three title messages:
- Invalid property name;
- Invalid property value;
- Duplicate property.

* Localizations/en.lproj/localizedStrings.js:
* UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.css:
(.spreadsheet-style-declaration-editor .property):
(.spreadsheet-style-declaration-editor .property-toggle):
(.spreadsheet-style-declaration-editor .property.invalid-value:not(.disabled) .value):
(.spreadsheet-style-declaration-editor .property.has-warning):
(.spreadsheet-style-declaration-editor .property .warning):
Draw the warning arrow and icon using only one HTML element.
Don't set "top" property so the element remains vertically where it would be if it had "position: static".

(.spreadsheet-style-declaration-editor .property.has-warning .warning):
* UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js:
(WI.SpreadsheetCSSStyleDeclarationEditor.prototype._propertiesChanged):
(WI.SpreadsheetCSSStyleDeclarationEditor):
* UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.css:
(.spreadsheet-css-declaration):
(.spreadsheet-css-declaration :matches(.header, .header-media)):
(.spreadsheet-css-declaration .close-brace):
Make properties span the entire width of the styles sidebar. Unsupported properties have yellow
background. There should be no gaps between the property element and sidebar left and right edges.

* UserInterface/Views/SpreadsheetStyleProperty.js:
(WI.SpreadsheetStyleProperty):
(WI.SpreadsheetStyleProperty.prototype.updateStatus):
(WI.SpreadsheetStyleProperty.prototype._update):
(WI.SpreadsheetStyleProperty.prototype.updateClassNames): Deleted.
Rename updateClassNames to updateStatus since it modifies title attribute of the warning element.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@224523 268f45cc-cd09-0410-ab3c-d52691b4dbfc
Source/WebInspectorUI/ChangeLog
Source/WebInspectorUI/Localizations/en.lproj/localizedStrings.js
Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.css
Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationEditor.js
Source/WebInspectorUI/UserInterface/Views/SpreadsheetCSSStyleDeclarationSection.css
Source/WebInspectorUI/UserInterface/Views/SpreadsheetStyleProperty.js