Improve box shadow calculation

eea · Jul 29, 2021 · 2fffb80 · 2fffb80
1 parent 8a91ef1
commit 2fffb80
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 13 deletions.
diff --git a/src/StyleWrapper/StyleWrapperView.jsx b/src/StyleWrapper/StyleWrapperView.jsx
@@ -19,18 +19,11 @@ export function getInlineStyles(data, props = {}) {
           ).toPixel(),
         }
       : {}),
-    ...(data.shadowDepth &&
-      {
-        // TODO: calculate proper shadow CSS
-        // shadowColor: data.shadowColor || '#000',
-        // shadowOffset: {
-        //   width: 0,
-        //   height: data.shadowDepth,
-        // },
-        // shadowOpacity: (data.shadowDepth * 100) / 24 / 100,
-        // shadowRadius: 1 + (data.shadowDepth * 100) / 16,
-        // elevation: data.shadowDepth,
-      }),
+    ...(data.shadowDepth && {
+      boxShadow: `0px 0px ${data.shadowDepth}px rgba(0, 0, 0, ${
+        (data.shadowDepth * 100) / 0.24
+      })`,
+    }),
     ...(data.borderRadius && {
       borderRadius: data.borderRadius,
     }),

diff --git a/src/index.js b/src/index.js
@@ -30,7 +30,7 @@ export const applyStyleWrapperToBlock = (blockConfig) => {
 
   const BaseViewComponent = blockConfig.view;
   let ViewComponent = BaseViewComponent;
-  if (ViewComponent._styleWrapped) {
+  if (!ViewComponent._styleWrapped) {
     ViewComponent = (props) => (
       <BlockStyleWrapperView {...props}>
         <BaseViewComponent {...props} />