added inner depth : #3

ashusharmadev · ashusharmadev · commit b4ab7ad5ea2e · 2022-09-01T18:08:11.000+05:30
diff --git a/dist/js/o.min.js b/dist/js/o.min.js
diff --git a/src/js/orphic.js b/src/js/orphic.js
@@ -154,6 +154,7 @@ function OrphicUI() {
         dropMode: 'o-drop',
         boxMode: 'o-box',
         textMode: 'o-text',
+        innerMode: 'o-in',
         none: 'o-none'
     }
 
@@ -398,6 +399,15 @@ function OrphicUI() {
                         let fval = `${val1}, ${val2}`;
                         cssProps.push(this._styler.createProperty("text-shadow", fval));
                     }
+                    else if(depthVal[this._depthList.innerMode] === '<unknown>')
+                    {
+                        // console.log("BoxShadow");
+                        let depthProps = this._getDepthProps(depthVal, theme);
+                        let val1 = `inset -${depthProps.left}px -${depthProps.top}px ${depthProps.blur}px ${depthProps.spread}px ${depthProps.color1}`;
+                        let val2 = `inset ${depthProps.right}px ${depthProps.bottom}px ${depthProps.blur}px ${depthProps.spread}px ${depthProps.color2}`;
+                        let fval = `${val1}, ${val2}`;
+                        cssProps.push(this._styler.createProperty("box-shadow", fval));
+                    }
                     else if(depthVal[this._depthList.boxMode] === '<unknown>')
                     {
                         // console.log("BoxShadow");
diff --git a/tests/o.html b/tests/o.html
@@ -119,6 +119,7 @@
 
     <div class="custom-aligner">
 
+        <!-- o-in : for inner-shadows -->
         <div class="o-orphic o-logo-wrapper bd-rd" data-osh="o-drop, left: 12, right: 12, top: 12, bottom: 12">
 
             <div class="o-orphic-back bd-rd" data-oblur="none"></div>
