feat: improve snake nesting .s

streamich · Mar 24, 2018 · 1e2409e · 1e2409e
1 parent ee296ed
commit 1e2409e
Show file tree

Hide file tree

Showing 2 changed files with 65 additions and 1 deletion.
diff --git a/addon/__tests__/snake.test.js b/addon/__tests__/snake.test.js
@@ -24,4 +24,64 @@ describe('snake', function () {
             background: 'red'
         });
     });
+
+    it('.relative', function () {
+        var nano = createNano();
+
+        expect(nano.s.rel.obj).toEqual({
+            position: 'relative',
+        });
+    });
+
+    describe('accents', function () {
+        it('semantic', function () {
+            var nano = createNano();
+
+            expect(nano.s.bold.italic.underline.obj).toEqual({
+                fontStyle: 'italic',
+                fontWeight: 'bold',
+                textDecoration: 'underline',
+            });
+        });
+
+        it('shorhand', function () {
+            var nano = createNano();
+
+            expect(nano.s.b.i.u.obj).toEqual({
+                fontStyle: 'italic',
+                fontWeight: 'bold',
+                textDecoration: 'underline',
+            });
+        });
+    });
+
+    describe('.s', function () {
+        it('any value', function () {
+            var nano = createNano();
+
+            expect(nano.s.s('box-shadow', '0 0 3px black').obj).toEqual({
+                'box-shadow': '0 0 3px black',
+            });
+        });
+
+        it('nesting', function () {
+            var nano = createNano();
+
+            expect(nano.s.s(':hover', nano.s.u.obj).obj).toEqual({
+                ':hover': {
+                    textDecoration: 'underline'
+                }
+            });
+        });
+
+        it('nesting shorthand', function () {
+            var nano = createNano();
+
+            expect(nano.s.s(':hover', nano.s.u).obj).toEqual({
+                ':hover': {
+                    textDecoration: 'underline'
+                }
+            });
+        });
+    });
 });
diff --git a/addon/snake.js b/addon/snake.js
@@ -8,7 +8,7 @@ exports.addon = function (renderer, rules) {
 
     var defaultRules = renderer.assign({}, atoms, {
         s: function (prop, value) {
-            this[prop] = value;
+            this[prop] = (value instanceof Object) ? (value.obj || value) : value;
         },
 
         bgWhite: function () {
@@ -19,6 +19,10 @@ exports.addon = function (renderer, rules) {
             this.backgroundColor = '#000';
         },
 
+        rel: function () {
+            this.position = 'relative';
+        },
+
         pointer: function () {
             this.cursor = 'pointer';
         },