yisibl · April 7, 2015 08:04 · Apr 7, 2015
diff --git a/SassMeister-input.scss b/SassMeister-input.scss
@@ -0,0 +1,26 @@
+// ----
+// Sass (v3.4.12)
+// Compass (v1.0.3)
+// ----
+
+@for $i from 1 through 8 {
+  .main .line:nth-child(#{$i}){
+    transform: rotate3d(0, 0, 1, 22.5deg * $i);
+  }
+}
+
+$border: 10px;
+$r: 210px - $border;
+$pi: 3.141592653589793;
+
+@for $i from 1 through 4 {
+  .main .line:nth-child(#{$i}):before{
+    top: $r - (cos((4 - $i )*$pi/8)*$r);
+  }
+}
+
+@for $i from 5 through 8 {
+  .main .line:nth-child(#{$i}):before{
+    top: $r - (cos((4 - $i )*$pi/8)*$r);
+  }
+}
diff --git a/SassMeister-output.css b/SassMeister-output.css
@@ -0,0 +1,63 @@
+.main .line:nth-child(1) {
+  transform: rotate3d(0, 0, 1, 22.5deg);
+}
+
+.main .line:nth-child(2) {
+  transform: rotate3d(0, 0, 1, 45deg);
+}
+
+.main .line:nth-child(3) {
+  transform: rotate3d(0, 0, 1, 67.5deg);
+}
+
+.main .line:nth-child(4) {
+  transform: rotate3d(0, 0, 1, 90deg);
+}
+
+.main .line:nth-child(5) {
+  transform: rotate3d(0, 0, 1, 112.5deg);
+}
+
+.main .line:nth-child(6) {
+  transform: rotate3d(0, 0, 1, 135deg);
+}
+
+.main .line:nth-child(7) {
+  transform: rotate3d(0, 0, 1, 157.5deg);
+}
+
+.main .line:nth-child(8) {
+  transform: rotate3d(0, 0, 1, 180deg);
+}
+
+.main .line:nth-child(1):before {
+  top: 123.46331px;
+}
+
+.main .line:nth-child(2):before {
+  top: 58.57864px;
+}
+
+.main .line:nth-child(3):before {
+  top: 15.22409px;
+}
+
+.main .line:nth-child(4):before {
+  top: 0px;
+}
+
+.main .line:nth-child(5):before {
+  top: 15.22409px;
+}
+
+.main .line:nth-child(6):before {
+  top: 58.57864px;
+}
+
+.main .line:nth-child(7):before {
+  top: 123.46331px;
+}
+
+.main .line:nth-child(8):before {
+  top: 200px;
+}