update to v1

Author: tinchox5

astro.config.mjs

@@ -30,8 +30,8 @@ export default defineConfig({
       themes: ['github-light'],
       useStarlightDarkModeSwitch: false
     },
-    title: 'Orbit CSS Radial Framework',
-    description: 'Get started building an amazing cool radial UI with Orbit CSS Radial Framework',
+    title: 'Orbit CSS radial UI composer',
+    description: 'Get started building an amazing cool radial UI with Orbit CSS composer',
 
     disable404Route: true,
     logo: {
@@ -63,7 +63,7 @@ export default defineConfig({
     }, {
       label: 'Guide',
       items: [{
-        label: 'How does Orbit work?',
+        label: 'Steps to create a knob',
         link: '/guide/'
       }]
     }, {
@@ -99,7 +99,8 @@ export default defineConfig({
       }, {
         label: 'capsule',
         link: '/elements/capsule/'
-      }]
+      },
+    ]
     },{
       label: 'Tools',
       items: [{
@@ -109,11 +110,51 @@ export default defineConfig({
       },{
         label: 'Auto resize',
         link: '/tools/orbit-resize/',
-       
-      }]
+      },{
+        label: 'Colors',
+        link: '/tools/colors/'
+      }
+    ]
     }, {
       label: 'Examples',
-      link: '/examples/',
+      items: [{
+        label: 'Progress bars',
+        link: '/examples/progress/',
+      
+      },{
+        label: 'Charts',
+        link: '/examples/charts/',
+      },{
+        label: 'Gauges',
+        link: '/examples/gauges/'
+      },{
+        label: 'Knobs',
+        link: '/examples/knobs/'
+      },{
+        label: 'Pie menues',
+        link: '/examples/piemenu/'
+      },{
+        label: 'Watch faces',
+        link: '/examples/watches/'
+      },{
+        label: 'Scifi',
+        link: '/examples/scifi/'
+      },{
+        label: 'Chemical structures',
+        link: '/examples/chemical_structures/'
+      },{
+        label: 'Calendars & time planners',
+        link: '/examples/calendar/'
+      },{
+        label: 'Mandalas',
+        link: '/examples/mandalas/'
+      },{
+        label: 'Dashboards',
+        link: '/examples/dashboard/'
+      },{
+        label: 'Abstract orbital map',
+        link: '/examples/abstract_map/'
+      }]
 
     }]
   }), 

src/assets/knob.css

@@ -0,0 +1,25 @@
+[class*=orbit] {
+    border:none
+}
+.gradient-1 {
+box-shadow: inset 0px 0px 3px 2px #00000082;
+background: linear-gradient(0deg, rgb(158 155 155) 0%, rgb(236 236 236) 98%);
+}
+.gradient-2 {
+background: linear-gradient(180deg, rgb(161 161 161) 0%, rgb(255 255 255) 100%);
+}
+.indicator {
+height: 5px;
+border: none;
+background: var(--o-cyan);
+box-shadow: inset 0px 0px 0px 1px var(--o-gray-dark); 
+}
+.led-off {
+border: none;
+box-shadow: inset 0px 0px 0px 1px #00000075;
+}
+.led-on {
+border: none;
+background: radial-gradient(circle, rgba(246,246,246,1) 4%, rgba(52,228,249,1) 28%, rgba(0,0,0,1) 82%, rgba(0,0,0,1) 96%);
+box-shadow: inset 0px 0px 0px 1px var(--o-gray-dark);
+}