update

zumerlab · Jul 20, 2024 · ea5628f · ea5628f
1 parent bc5dbae
commit ea5628f
Show file tree

Hide file tree

Showing 6 changed files with 48 additions and 13 deletions.
diff --git a/assets/css/orbit.min.css b/assets/css/orbit.min.css
diff --git a/assets/css/orbit.min.css.map b/assets/css/orbit.min.css.map
diff --git a/examples/analog-watch.html b/examples/analog-watch.html
@@ -128,34 +128,34 @@
               <div class="spoke inner-orbit reduce-50"></div>
               <div class="spoke inner-orbit reduce-50"></div>
             </div>
-            <div class="orbit-5  ">
-              <div class="satellite">
+            <div class="orbit-5  gooey-fx">
+              <div class="satellite grow-3x" style="border: none">
                 <div class=" capsule stable">
                   1
                 </div>
               </div>
-              <div class="satellite">
+              <div class="satellite grow-3x" style="border: none">
                 <div class=" capsule flip">
                   2
                 </div>
               </div>
-              <div class="satellite">
+              <div class="satellite grow-3x" style="border: none">
                 <div class=" capsule turn-left">
                   3
                 </div>
               </div>
-              <div class="satellite">
+              <div class="satellite grow-3x" style="border: none">
                 <div class=" capsule turn-right">
                   4
                 </div>
               </div>
-              <div class="satellite">
+              <div class="satellite grow-3x" style="border: none">
                 <div class=" capsule stable">
                   5
                 </div>
               </div>
-              <div class="satellite">6</div>
-              <div class="satellite">7</div>
+              <div class="satellite grow-3x" style="border: none">6</div>
+              <div class="satellite grow-3x" style="border: none">7</div>
               <div class="satellite">8</div>
               <div class="satellite">9</div>
               <div class="satellite">10</div>

diff --git a/src/scss/_orbit-class.scss b/src/scss/_orbit-class.scss
@@ -101,9 +101,10 @@ Please see **Radial Layout section**.
 * resize orbit as optional function.
 * trabajar con spoke as container... tiene que alinearse siempre a la mitad asi, si tiene una imagen dentro queda
 alineada tambien.
-- add rules to support chek
+* add rules to support chek
 - create basic and alternative theme
 - volver a chequear documentacion
+* add gooey
 * textLength y space. 
 * el gap en label no anda super duper con texto invertido
 * agregar quarters a secto, label, progress

diff --git a/src/scss/_support.scss b/src/scss/_support.scss
@@ -17,6 +17,28 @@ Currently Orbit doesn't support ellipse shapes, so when detected these web-compo
 - Orbit checks and warns if `.satellite` has some invalid Orbit direct child element. Only `.orbit-zone` is allowed. 
 
 */
+/* Check Firefox has() support */
+@supports not selector(:has(a)) {	
+  .orbit-zone {
+    border: 3px dotted red!important;
+  }
+  .orbit-zone>* {
+    display: none;
+  }
+
+  .orbit-zone::before {
+    content: 'Update  🦊 Firefox to use Orbit';
+   // text-shadow: 0 0 2px red;
+    font-size: 18px;
+   // background-color: yellow;
+    padding: 10px;
+    text-align: center;
+  }
+
+
+}
+
+
 
 @container osector not style(--o-ellipse-x: 1) {
   /* Shown if ratio equals 1*/

diff --git a/src/scss/_utilities.scss b/src/scss/_utilities.scss
@@ -204,3 +204,14 @@ o-progress.rounded,o-label.rounded {
   --o-linecap: round;
 }
 
+.orbit.gooey-fx, [class*='orbit-'].gooey-fx{
+  filter: url('data:image/svg+xml,\
+  <svg xmlns="http://www.w3.org/2000/svg">\
+  <filter id="fancy-goo">\
+  <feGaussianBlur in="SourceGraphic" stdDeviation="10" result="blur" />\
+  <feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0  0 0 0 19 -9" result="goo" />\
+  <feComposite in="SourceGraphic" in2="goo" operator="atop" />\
+  </filter>\
+  </svg>#fancy-goo')
+}
+