fix sector limits

zumerlab · Sep 29, 2023 · b602c68 · b602c68
1 parent 22dace2
commit b602c68
Show file tree

Hide file tree

Showing 6 changed files with 19 additions and 10 deletions.
diff --git a/assets/css/index.min.css b/assets/css/index.min.css
diff --git a/assets/css/index.min.css.map b/assets/css/index.min.css.map
diff --git a/assets/css/zumer.min.css b/assets/css/zumer.min.css
diff --git a/assets/css/zumer.min.css.map b/assets/css/zumer.min.css.map
diff --git a/examples/generic.html b/examples/generic.html
@@ -13,10 +13,10 @@
   </head>
   <body>
     <div class="docker" >
-      <div class="core orbiters-1">
+      <div class="core ">
         <div class="orbiter s" style="transform: translate(-50%, -50%);"></div>
       </div>
-      <div class="orbit">
+      <div class="orbit limit-180">
         <div class="sector"></div>
         <div class="sector"></div>
         <div class="sector"></div>
@@ -30,14 +30,14 @@
             <div class="sector"></div>
             <div class="sector"></div>
           </div>
-          <div class="orbit">
-            <div class="orbiter s lower">
-              <div class="orbit">
+          <div class="orbit offset-45">
+            <div class="orbiter l">
+              <div class="orbit ">
                 <div class="sector"></div>
                 <div class="sector"></div>
                 <div class="sector"></div>
               </div>
-              <div class="orbit-3 ">
+              <div class="orbit ">
                 <svg class="z-svg">
                   <circle class="svg-progress" style="--val: 59; stroke: purple;" /> 
                 </svg>

diff --git a/src/layouts/_radial-grid.scss b/src/layouts/_radial-grid.scss
@@ -31,6 +31,14 @@
     }
   }
 }
+@for $i from $min-orbiters through $max-orbiters {
+  @each $limit, $value in $limits {
+    .orbit.#{$limit}:has(.sector:nth-child(#{$i})) {
+      --arc: #{$value};
+      --angle: calc((var(--arc) / #{$i}) * var(--direction));
+    }
+  }
+}
 
 @for $i from $min-orbits through $max-orbits {
   $resta: 1;
@@ -131,3 +139,4 @@
     --orbiter-number: #{$i};
   }
 }
+