views:

23

answers:

0

Here's a tricky one: has anybody seen a YUI dialog/panel implementation with nice OS X style shadows around the dialog, instead of the blocky shadow that is implemented by default with the "underlay" element?

This kind of shadow

You can see this type of shadow on Amazon.com popup windows. It requires quite a bit of PNGs but looks very nice.

I'm thinking of inserting extra DIVs or replacing the .underlay element, and hook into the dialog size event to adapt the dimensions. The latter would be required because YUI uses some CSS trickery to make the underlay element "snap" to the dialog dimensions with CSS only in modern browsers, and uses a manual dimension update for IE.

EDIT: Just checked YUI 3. The Panel widget is not available yet, only the Container and it's still beta. So I'm looking at solving this in YUI 2.

PS: Oh I guess I could include the PNG shadow as part of the Panel's header, body and footer (hd, bd, ft), as an extra padding. And use a css rule to hide YUI's underlay. Hmmmmmm I just wish I didn't have to do this because it changes calculations for the draggable area, it's not a great way to do it.