react / react/react-strict-dom
(feature) CSS env(safe-area-inset-*)
Open
Nobody has claimed this yet.
feature
- Dominant language
- JavaScript
- Stars
- 3.6k
- Forks
- 206
- PR merge metrics
- No merged PRs in 30d
Description
Describe the feature request
Would be cool if the CSS env() function can be used, because this would completely replace the need for a SafeAreaView component on the Native side and at the same time this would even work in iOS Web.
Example:
{
paddingTop: 'env(safe-area-inset-top)',
paddingRight: 'env(safe-area-inset-right)',
paddingBottom: 'env(safe-area-inset-bottom)',
paddingLeft: 'env(safe-area-inset-left)',
}
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the linked MDN documentation for CSS env() and the SafeAreaView reference in the issue. Determine how safe-area-inset-top, right, bottom, and left should behave on native and iOS Web. Done means the shown style properties are supported without requiring SafeAreaView.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, react
- Domain
- frontend, mobile
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100