From 2eb5507feea95d0c473ae2687f635f179a7b6e4f Mon Sep 17 00:00:00 2001
From: Martin Muda <mud@mrecic.gov.ar>
Date: Wed, 7 Jun 2023 16:34:04 -0300
Subject: [PATCH] update

---
 examples/watch.html | 32 +++++++++++++++++++++++++++-----
 1 file changed, 27 insertions(+), 5 deletions(-)
diff --git a/examples/watch.html b/examples/watch.html
index db0508c..e815287 100644
--- a/examples/watch.html
+++ b/examples/watch.html
@@ -10,6 +10,15 @@
       body {
         font-family: 'Lucida Sans', Verdana, sans-serif;
       }
+      .hour {
+        stroke:crimson;
+      }
+      .minute {
+        stroke:darkmagenta;
+      }
+      .second {
+        stroke: orangered;
+      }
     </style>
   </head>
   <body>
@@ -43,14 +52,27 @@
         <div class="item xs ">10</div>
         <div class="item xs ">11</div>
       </div>
-        
-        <svg>
-          <circle class="percent hour" style="--r: 110px"/> 
-          <circle class="percent minute" style="--r: 70px"/> 
-          <circle class="percent second" style="--r: 50px; "/> 
+      <div class="ring-3 items-12 offset-270">
+        <svg class="z-svg">
+          <circle class="percent hour"/>   
+        </svg>
+      </div>
+      <div class="ring-3">
+        <svg class="z-svg">
           <circle class="markers"/> 
         </svg>
       </div>
+      <div class="ring-2">
+        <svg class="z-svg">
+          <circle class="percent minute" /> 
+        </svg>
+      </div>
+      <div class="ring-1">
+        <svg class="z-svg">
+          <circle class="percent second" /> 
+        </svg>
+      </div>
+      </div>
     </div>
     <script>
       function analogWatch() {
