fix divider position

Author: nemerovchenko

app/build/mojs-curve-editor.js

@@ -58,13 +58,17 @@
   }
 
   &__anchor-buttons {
-    margin-top: 20px;
+    margin-top:   calc(  10*$PX );
 
     & icon-button {
-      margin-bottom: 5px;
+      margin-bottom: calc(  5*$PX );
     }
   }
 
+  & icon-divider {
+    margin: calc( 10*$PX ) calc( 4*$PX );
+  }
+
   &__mojs-logo {
     position:     absolute;
     bottom:       calc( 1.7 * $gap * $PX );

app/build/mojs-curve-editor.min.js

@@ -1 +1 @@
-{"curve-editor":"_curve-editor_x2z8q_4","curve-editor__left":"_curve-editor__left_x2z8q_1","curve-editor__right":"_curve-editor__right_x2z8q_1","curve-editor__anchor-buttons":"_curve-editor__anchor-buttons_x2z8q_1","curve-editor__mojs-logo":"_curve-editor__mojs-logo_x2z8q_1"}
+{"curve-editor":"_curve-editor_seic3_4","curve-editor__left":"_curve-editor__left_seic3_1","curve-editor__right":"_curve-editor__right_seic3_1","curve-editor__anchor-buttons":"_curve-editor__anchor-buttons_seic3_1","curve-editor__mojs-logo":"_curve-editor__mojs-logo_seic3_1"}

app/css/blocks/curve-editor.postcss.css

@@ -2,12 +2,11 @@
 
 .icon-divider {
   position:         relative;
-  top:              10px;
-  left:             4px;
+  margin:           0 auto;
   width:            calc( 16*$PX );
   height:           calc( 2*$PX );
   display:          block;
-  background:       $c-white;
+  background:       rgba(255,255,255,.3);
   border-radius:    calc( 3*$PX );
-  box-shadow:       0px calc( 2*$PX ) 0 rgba(0,0,0,.6);
+  box-shadow:       0px calc( 2*$PX ) 0 rgba(0,0,0,.3);
 }

app/css/blocks/curve-editor.postcss.css.json

@@ -1 +1 @@
-{"icon-divider":"_icon-divider_197j2_3"}
+{"icon-divider":"_icon-divider_15ou5_3"}

app/css/blocks/icon-divider.postcss.css

@@ -6,7 +6,7 @@
       <circle cx="21" cy="16" r="1"></circle>
     </g>
     <path id="code-shape" d="M8,16.0849648 C8,15.8210793 8.11149069,15.6129393 8.33483405,15.4609065 L12.3390874,12.8419612 C12.3897649,12.8014192 12.4657813,12.7811481 12.5674985,12.7811481 C12.7398023,12.7811481 12.9048664,12.8571645 13.0623289,13.0095592 C13.2194294,13.161954 13.2983417,13.3393255 13.2983417,13.5423979 C13.2983417,13.7353347 13.2219633,13.8826617 13.0692066,13.9840168 L9.85769553,16.0849648 L13.0692066,18.1862747 C13.2219633,18.2677208 13.2983417,18.4146858 13.2983417,18.6278937 C13.2983417,18.830966 13.2197914,19.0061657 13.0623289,19.1531307 C12.9048664,19.3004576 12.7398023,19.3739401 12.5674985,19.3739401 C12.4657813,19.3739401 12.3897649,19.3536691 12.3390874,19.313127 L8.33483405,16.6938198 C8.11149069,16.541425 8,16.3387147 8,16.0849648 L8,16.0849648 Z M14.1399516,20.6875756 C14.1265582,20.6075774 14.1287301,20.5301131 14.1468293,20.4548207 L16.9395263,11.356022 C16.9891179,11.1623612 17.1237755,11.0468887 17.344223,11.0096045 C17.5042194,10.9824558 17.658786,11.0128623 17.8075609,11.1008242 C17.9563358,11.1891479 18.0442976,11.313308 18.0710844,11.4733044 C18.0862876,11.5634381 18.079772,11.6470561 18.0518993,11.7237965 L15.2664419,20.7748134 C15.2085247,20.9800577 15.0593878,21.1031318 14.8193932,21.1440358 C14.6488993,21.1729945 14.4994005,21.1389681 14.3698106,21.0426807 C14.2402208,20.9460313 14.1638424,20.8276629 14.1399516,20.6875756 L14.1399516,20.6875756 Z M18.9528744,19.1527687 C18.7954119,19.0058037 18.7168616,18.830604 18.7168616,18.6275317 C18.7168616,18.4244594 18.7878102,18.2774944 18.9300695,18.1859127 L22.1426665,16.0846028 L18.9300695,13.9836549 C18.7878102,13.8718022 18.7168616,13.7248372 18.7168616,13.5420359 C18.7168616,13.3389636 18.7954119,13.161592 18.9528744,13.0091973 C19.1103369,12.8568025 19.275039,12.7807861 19.4477048,12.7807861 C19.5389245,12.7807861 19.6098731,12.8014192 19.6609126,12.8415992 L23.6651659,15.4605445 C23.8881473,15.6129393 24,15.8210793 24,16.0846028 C24,16.3488502 23.8881473,16.5515606 23.6651659,16.6938198 L19.6609126,19.3127651 C19.6098731,19.3533071 19.5389245,19.3735782 19.4477048,19.3735782 C19.275039,19.3735782 19.1103369,19.3000957 18.9528744,19.1527687 L18.9528744,19.1527687 Z"></path>
-    <path id="divider-shape" d="M0,1 L15.625,1"></path>
+    <path id="divider" d="M0,1 L15.625,1"></path>
     <g id="point-straight-shape" fill="none" fill-rule="evenodd">
       <polyline fill="#8B6E8A" stroke="#FFFFFF" points="7.881 19.568 15.451 11.241 23.892 19.568"/>
       <ellipse stroke="none" cx="16" cy="12" rx="2.667" ry="2.667" fill="black" fill-opacity="0.5" />