Opened 11 years ago

Last modified 2 years ago

#9728 reopened bug

Webkit: missing text-shadow, box-shadow support, broken border-radius support

Reported by: dsjonny Owned by: leavengood
Priority: normal Milestone: R1
Component: Kits/Web Kit Version: R1/Development
Keywords: Cc:
Blocked By: #7407 Blocking:
Platform: All

Description

There are some CSS properties are missing: text-shadow box-shadow

And the border*radius looks wrong.

In InternetExplorer:

In WebPositive:

Attachments (3)

ie.png​ (163.1 KB ) - added by dsjonny 11 years ago.
webpositive.png​ (95.1 KB ) - added by dsjonny 11 years ago.
rounded-rect.patch​ (1.5 KB ) - added by thebuck 2 years ago.
unrelated border-radius patch: the background of a box with border-radius has bottom left corner use bottom-right radius for its y-radius while x-radius and border stroke are correct. Otherwise I think border-radius looks perfect these days…

Download all attachments as: .zip

Change History (16)

by dsjonny, 11 years ago

Attachment: ie.png​ added

by dsjonny, 11 years ago

Attachment: webpositive.png​ added

comment:1 by dsjonny, 11 years ago

The "legend" border is still wrong (the label is striked out): No image "webpositive2.png" attached to Ticket #9728

Version 0, edited 11 years ago by dsjonny (next)

comment:2 by anevilyak, 11 years ago

Blocked By: 7407 added

The box-shadow issue problems are already tracked in ticket #7407.

comment:3 by diver, 11 years ago

Should this one be closed as a dupe of #7407 then?

comment:4 by pulkomandy, 10 years ago

Summary: WebPositive: missing/wrong CSS properties → WebPositive: missing text-shadow, box-shadow support, broken border-radius support

comment:5 by pulkomandy, 8 years ago

Do you have a website where I can test this?

comment:6 by waddlesplash, 5 years ago

Resolution: → invalid
Status: new → closed

No reply, and the major issue was tracked and fixed in a separate ticket.

comment:7 by pulkomandy, 5 years ago

Resolution: invalid
Status: closed → reopened

Shadows are still not implemented.

comment:8 by dsjonny, 5 years ago

Unfortunatelly I have less time for Haiku, but now put the latest nightly anyboot (hrev52824) image to Hyper-V and checked one of my latest website (fonalfeszek.hu) and some CSS not working instead of other browsers:

  • opacity != 1
  • @font-face
  • box-shadow

It would be a big help if I can use developer/debugger tools in the browser.

comment:9 by nephele, 3 years ago

Component: Applications/WebPositive → Kits/Web Kit
Summary: WebPositive: missing text-shadow, box-shadow support, broken border-radius support → Webkit: missing text-shadow, box-shadow support, broken border-radius support

comment:11 by pulkomandy, 3 years ago

This should be implemented in GraphicsContextHaiku: ​https://github.com/haiku/webkit/blob/rebased/Source/WebCore/platform/graphics/haiku/GraphicsContextHaiku.cpp#L288

The specific lines I linked should simply be re-enabled since we now have support for the composite operators.

Similar things should be done in various other places in the GraphicsContext implementatiom, using the other platform implementations as a reference. Searching for "shadowstate" in ​https://github.com/haiku/webkit/blob/rebased/Source/WebCore/platform/graphics/cairo/GraphicsContextImplCairo.cpp gives a good idea of where shadows are needed.

comment:12 by X512, 3 years ago

The specific lines I linked should simply be re-enabled since we now have support for the composite operators.

It don't compile anymore. ShadowBlur::drawRectShadow API was changed.

by thebuck, 2 years ago

Attachment: rounded-rect.patch​ added

unrelated border-radius patch: the background of a box with border-radius has bottom left corner use bottom-right radius for its y-radius while x-radius and border stroke are correct. Otherwise I think border-radius looks perfect these days...

comment:13 by pulkomandy, 2 years ago

I merged your patch. I agree border-radius is done now, but the other problems in this ticket are still here.

Note: See TracTickets for help on using tickets.