From c6a5b090be4dc7bd70188bbfd7d1464a4a67ea1c Mon Sep 17 00:00:00 2001
From: afeiship <1290657123@qq.com>
Date: Mon, 25 Jun 2018 16:44:33 +0800
Subject: [PATCH] issue: opmtize

---
 .gitignore                           |  5 ++
 dist/webkit-sassui-position-box.scss | 96 +++++++++++++---------------
 docs/index.html                      |  4 +-
 docs/test.css                        | 31 ++++-----
 package.json                         |  4 +-
 src/webkit-sassui-position-box.scss  | 96 +++++++++++++---------------
 6 files changed, 113 insertions(+), 123 deletions(-)

diff --git a/.gitignore b/.gitignore
index 0cf530c..786df0e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,4 +1,9 @@
 node_modules
 bower_components
 coverage
+npm-debug.log
+yarn.lock
+package-lock.json
+.DS_Store
 .idea
+.vscode
diff --git a/dist/webkit-sassui-position-box.scss b/dist/webkit-sassui-position-box.scss
index 465cf4e..5c3ab7a 100644
--- a/dist/webkit-sassui-position-box.scss
+++ b/dist/webkit-sassui-position-box.scss
@@ -8,61 +8,55 @@ $webkit-sassui-position-box-list:(relative, absolute, fixed);
   }
 
 
-  > * {
-    &[data-direction]{
-      position: absolute;
-    }
+  [data-direction]{
+    position: absolute;
+  }
 
-    &[data-direction=center]{
-      left: 50%;
-      top: 50%;
-      transform: translate(-50%, -50%);
-    }
+  [data-direction=center]{
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+  }
 
-    &[data-direction=top],
-    &[data-direction=bottom]{
-      left: 50%;
-      transform: translateX(-50%);
-    }
+  [data-direction=top],
+  [data-direction=bottom]{
+    left: 50%;
+    transform: translateX(-50%);
+  }
 
-    &[data-direction=left],
-    &[data-direction=right]{
-      top: 50%;
-      transform: translateY(-50%);
-    }
+  [data-direction=left],
+  [data-direction=right]{
+    top: 50%;
+    transform: translateY(-50%);
+  }
 
-    &[data-direction=top]{
-      top:0;
-    }
-    &[data-direction=right]{
-      right: 0;
-    }
-    &[data-direction=bottom]{
-      bottom:0;
-    }
-    &[data-direction=left]{
-      left: 0;
-    }
-    &[data-direction=lt]{
-      left: 0;
-      top: 0;
-    }
-    &[data-direction=tr]{
-      top: 0;
-      right: 0;
-    }
-    &[data-direction=rb]{
-      right: 0;
-      bottom: 0;
-    }
-    &[data-direction=bl]{
-      bottom: 0;
-      left: 0;
-    }
-    &[data-direction=lt]{
-      left:0;
-      top:0;
-    }
+  [data-direction=top]{
+    top:0;
+  }
+  [data-direction=right]{
+    right: 0;
+  }
+  [data-direction=bottom]{
+    bottom:0;
+  }
+  [data-direction=left]{
+    left: 0;
+  }
+  [data-direction=tl]{
+    left: 0;
+    top: 0;
+  }
+  [data-direction=tr]{
+    top: 0;
+    right: 0;
+  }
+  [data-direction=br]{
+    right: 0;
+    bottom: 0;
+  }
+  [data-direction=bl]{
+    bottom: 0;
+    left: 0;
   }
 }
 /*webkit-sassui-position-box End*/
diff --git a/docs/index.html b/docs/index.html
index 17071d5..4a5eade 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -16,9 +16,9 @@
     <span data-direction='center'>center</span>
     <img data-direction='center' src="circle.png" width="120">
 
-    <span data-direction='lt'>lt</span>
+    <span data-direction='tl'>tl</span>
     <span data-direction='tr'>tr</span>
-    <span data-direction='rb'>rb</span>
+    <span data-direction='br'>br</span>
     <span data-direction='bl'>bl</span>
 
   </div>
diff --git a/docs/test.css b/docs/test.css
index 973760d..22f4be3 100644
--- a/docs/test.css
+++ b/docs/test.css
@@ -11,67 +11,64 @@
   position: fixed;
 }
 
-.webkit-sassui-position-box > *[data-direction] {
+.webkit-sassui-position-box [data-direction] {
   position: absolute;
 }
 
-.webkit-sassui-position-box > *[data-direction=center] {
+.webkit-sassui-position-box [data-direction=center] {
   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
 }
 
-.webkit-sassui-position-box > *[data-direction=top], .webkit-sassui-position-box > *[data-direction=bottom] {
+.webkit-sassui-position-box [data-direction=top],
+.webkit-sassui-position-box [data-direction=bottom] {
   left: 50%;
   transform: translateX(-50%);
 }
 
-.webkit-sassui-position-box > *[data-direction=left], .webkit-sassui-position-box > *[data-direction=right] {
+.webkit-sassui-position-box [data-direction=left],
+.webkit-sassui-position-box [data-direction=right] {
   top: 50%;
   transform: translateY(-50%);
 }
 
-.webkit-sassui-position-box > *[data-direction=top] {
+.webkit-sassui-position-box [data-direction=top] {
   top: 0;
 }
 
-.webkit-sassui-position-box > *[data-direction=right] {
+.webkit-sassui-position-box [data-direction=right] {
   right: 0;
 }
 
-.webkit-sassui-position-box > *[data-direction=bottom] {
+.webkit-sassui-position-box [data-direction=bottom] {
   bottom: 0;
 }
 
-.webkit-sassui-position-box > *[data-direction=left] {
+.webkit-sassui-position-box [data-direction=left] {
   left: 0;
 }
 
-.webkit-sassui-position-box > *[data-direction=lt] {
+.webkit-sassui-position-box [data-direction=tl] {
   left: 0;
   top: 0;
 }
 
-.webkit-sassui-position-box > *[data-direction=tr] {
+.webkit-sassui-position-box [data-direction=tr] {
   top: 0;
   right: 0;
 }
 
-.webkit-sassui-position-box > *[data-direction=rb] {
+.webkit-sassui-position-box [data-direction=br] {
   right: 0;
   bottom: 0;
 }
 
-.webkit-sassui-position-box > *[data-direction=bl] {
+.webkit-sassui-position-box [data-direction=bl] {
   bottom: 0;
   left: 0;
 }
 
-.webkit-sassui-position-box > *[data-direction=lt] {
-  left: 0;
-  top: 0;
-}
-
 /*webkit-sassui-position-box End*/
 .test-webkit-sassui-position-box {
   border: 1px solid red;
diff --git a/package.json b/package.json
index 38fdc22..bdcbc01 100644
--- a/package.json
+++ b/package.json
@@ -8,9 +8,9 @@
     "email": "1290657123@qq.com"
   },
   "scripts": {
-    "build":"gulp"
+    "build": "gulp"
   },
-  "main":"dist/webkit-sassui-position-box.scss",
+  "main": "dist/webkit-sassui-position-box.scss",
   "license": "MIT",
   "devDependencies": {
     "del": "^2.2.1",
diff --git a/src/webkit-sassui-position-box.scss b/src/webkit-sassui-position-box.scss
index 465cf4e..5c3ab7a 100644
--- a/src/webkit-sassui-position-box.scss
+++ b/src/webkit-sassui-position-box.scss
@@ -8,61 +8,55 @@ $webkit-sassui-position-box-list:(relative, absolute, fixed);
   }
 
 
-  > * {
-    &[data-direction]{
-      position: absolute;
-    }
+  [data-direction]{
+    position: absolute;
+  }
 
-    &[data-direction=center]{
-      left: 50%;
-      top: 50%;
-      transform: translate(-50%, -50%);
-    }
+  [data-direction=center]{
+    left: 50%;
+    top: 50%;
+    transform: translate(-50%, -50%);
+  }
 
-    &[data-direction=top],
-    &[data-direction=bottom]{
-      left: 50%;
-      transform: translateX(-50%);
-    }
+  [data-direction=top],
+  [data-direction=bottom]{
+    left: 50%;
+    transform: translateX(-50%);
+  }
 
-    &[data-direction=left],
-    &[data-direction=right]{
-      top: 50%;
-      transform: translateY(-50%);
-    }
+  [data-direction=left],
+  [data-direction=right]{
+    top: 50%;
+    transform: translateY(-50%);
+  }
 
-    &[data-direction=top]{
-      top:0;
-    }
-    &[data-direction=right]{
-      right: 0;
-    }
-    &[data-direction=bottom]{
-      bottom:0;
-    }
-    &[data-direction=left]{
-      left: 0;
-    }
-    &[data-direction=lt]{
-      left: 0;
-      top: 0;
-    }
-    &[data-direction=tr]{
-      top: 0;
-      right: 0;
-    }
-    &[data-direction=rb]{
-      right: 0;
-      bottom: 0;
-    }
-    &[data-direction=bl]{
-      bottom: 0;
-      left: 0;
-    }
-    &[data-direction=lt]{
-      left:0;
-      top:0;
-    }
+  [data-direction=top]{
+    top:0;
+  }
+  [data-direction=right]{
+    right: 0;
+  }
+  [data-direction=bottom]{
+    bottom:0;
+  }
+  [data-direction=left]{
+    left: 0;
+  }
+  [data-direction=tl]{
+    left: 0;
+    top: 0;
+  }
+  [data-direction=tr]{
+    top: 0;
+    right: 0;
+  }
+  [data-direction=br]{
+    right: 0;
+    bottom: 0;
+  }
+  [data-direction=bl]{
+    bottom: 0;
+    left: 0;
   }
 }
 /*webkit-sassui-position-box End*/