Bugzilla – Full Text Bug Listing
| Summary: | [Theming] Cleanup border-radius implementation | ||||||
|---|---|---|---|---|---|---|---|
| Product: | [RT] RAP | Reporter: | Ralf Sternberg <rsternberg> | ||||
| Component: | RWT | Assignee: | Project Inbox <rap-inbox> | ||||
| Status: | RESOLVED FIXED | QA Contact: | |||||
| Severity: | normal | ||||||
| Priority: | P3 | CC: | ivan | ||||
| Version: | 1.2 | ||||||
| Target Milestone: | 1.3 M1 | ||||||
| Hardware: | All | ||||||
| OS: | All | ||||||
| Whiteboard: | |||||||
| Attachments: |
|
||||||
Created attachment 141149 [details]
Proposed patch.
The proposed patch removes the border radius from QxBorder. The actual "merge" between border and border-radius properties is done in ThemeValues#getCssBorder. If the border-radius is set for the specific combination of element/states, get the existing border for this combination and construct the RoundedBorder instead.
Ralf, what do you think?
Fixed in CVS HEAD. The example in the description works as expected. Another case fails:
Button {
border: 1px solid black;
border-radius: 3px;
}
Button.special {
border: none;
}
This renders a strange looking, 1px black border for the .special button. It seems that the combination of zero border width and a border radius set does not work with the client-side rounded border implementation. But we should be abe to handle this case on the server side.
(In reply to comment #3) >... But we should be abe to handle this case on the server side. I was wrong. 0px width rounded borders are a valid use case. It seems that the problem only exists in Chrome. Opened bug bug 284417. |
Currently, the border-radius property must be defined in a CSS rule that also contains a border property. The border radius is then merged into the existing border in StyleSheet#mergeBorderRadius(). This approach has two problems: 1) it fails if the border property is missing 2) it does not create a new border object As an example, the CSS snippet below should work and it should result in three different borders: Button, Labe, Link { border: 1px solid black; } Button[PUSH] { border-radius: 2px; } Button[BORDER] { border: 2px solid gray; }