Revery: UI - Box Shadow: 'Inset' property

Created on 4 Jan 2019  路  2Comments  路  Source: revery-ui/revery

The CSS box-shadow supports a property called inset, which causes the box-shadow to be rendered _inside_ the element:

__Without__ inset:
image

__With__ inset:
image

We use this inner-box-shadow styling in Oni's tab-bar to create the illusion of depth:
image

The README.md and Theme.re both have this style applied to make it appear they are 'underneath' the editor surface. It would be cool if we had that styling capability for Oni2, as well.

I think the approach would be quite similiar to the approach @Akin909 took with #107 - it'd just be about rendering the shadow _above_ the element, and positioning it correctly in the inset case.

A-primitives enhancement help wanted skia-dependent

Most helpful comment

I can have a look at this @bryphe, since I knew it would come up :laughing:

All 2 comments

I can have a look at this @bryphe, since I knew it would come up :laughing:

Sweet, thanks @Akin909 !

Was this page helpful?
0 / 5 - 0 ratings

Related issues

SamuelTrew picture SamuelTrew  路  4Comments

jericdeleon picture jericdeleon  路  3Comments

albertorestifo picture albertorestifo  路  3Comments

tcoopman picture tcoopman  路  6Comments

akinsho picture akinsho  路  5Comments