zoriya/react-native-web
1
0
Fork 0
mirror of https://github.com/zoriya/react-native-web.git synced 2026-06-03 02:42:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

[add] SafeAreaView support for iOS 11 CSS constant

Browse Source 
Close #1359
This commit is contained in:
Evan Bacon
2019-06-01 21:49:18 -07:00
committed by Nicolas Gallagher
parent 8908db7690
commit 11d00ff111
1 changed files with 17 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/react-native-web/src/exports/SafeAreaView/index.js
Vendored
+17 -4
View File
@@ -8,6 +8,7 @@
* @flow * @flow
*/ */
import { canUseDOM } from 'fbjs/lib/ExecutionEnvironment';
import React from 'react'; import React from 'react';
import StyleSheet from '../StyleSheet'; import StyleSheet from '../StyleSheet';
import View from '../View'; import View from '../View';
@@ -34,12 +35,24 @@ class SafeAreaView extends React.Component<ViewProps> {
} }
} }
const cssFunction: 'constant' | 'env' = (function() {
if (
canUseDOM &&
window.CSS &&
window.CSS.supports &&
window.CSS.supports('top: constant(safe-area-inset-top)')
) {
return 'constant';
}
return 'env';
})();
const styles = StyleSheet.create({ const styles = StyleSheet.create({
root: { root: {
paddingTop: 'env(safe-area-inset-top)', paddingTop: `${cssFunction}(safe-area-inset-top)`,
paddingRight: 'env(safe-area-inset-right)', paddingRight: `${cssFunction}(safe-area-inset-right)`,
paddingBottom: 'env(safe-area-inset-bottom)', paddingBottom: `${cssFunction}(safe-area-inset-bottom)`,
paddingLeft: 'env(safe-area-inset-left)' paddingLeft: `${cssFunction}(safe-area-inset-left)`
} }
}); });