diff --git a/others/toggles b/others/toggles
deleted file mode 100644
index 8f36c52..0000000
--- a/others/toggles
+++ /dev/null
@@ -1,33 +0,0 @@
-<!-- Toggle A -->
-        <div class="flex items-center justify-center w-full mb-12">
-          <label for="toogleA" class="flex items-center cursor-pointer">
-            <!-- toggle -->
-            <div class="relative">
-              <!-- input -->
-              <input id="toogleA" type="checkbox" class="sr-only" />
-              <!-- line -->
-              <div class="w-10 h-4 bg-gray-400 rounded-full shadow-inner" />
-              <!-- dot -->
-              <div class="dot absolute w-6 h-6 bg-white rounded-full shadow -left-1 -top-1 transition" />
-            </div>
-            <!-- label -->
-            <div class="ml-3 text-gray-700 font-medium">Toggle Me!</div>
-          </label>
-        </div>
-
-        <!-- Toggle B -->
-        <div class="flex items-center justify-center w-full mb-12">
-          <label for="toggleB" class="flex items-center cursor-pointer">
-            <!-- toggle -->
-            <div class="relative">
-              <!-- input -->
-              <input type="checkbox" id="toggleB" class="sr-only" />
-              <!-- line -->
-              <div class="block bg-gray-600 w-14 h-8 rounded-full" />
-              <!-- dot -->
-              <div class="dot absolute left-1 top-1 bg-white w-6 h-6 rounded-full transition" />
-            </div>
-            <!-- label -->
-            <div class="ml-3 text-gray-700 font-medium">Toggle Me!</div>
-          </label>
-        </div>
\ No newline at end of file
diff --git a/others/toggles.svelte b/others/toggles.svelte
new file mode 100644
index 0000000..7dae2b3
--- /dev/null
+++ b/others/toggles.svelte
@@ -0,0 +1,37 @@
+<!-- Toggle A -->
+<div class="flex items-center justify-center w-full mb-12">
+  <label for="toogleA" class="flex items-center cursor-pointer">
+    <!-- toggle -->
+    <div class="relative">
+      <!-- input -->
+      <input id="toogleA" type="checkbox" class="sr-only" />
+      <!-- line -->
+      <div class="w-10 h-4 bg-gray-400 rounded-full shadow-inner" />
+      <!-- dot -->
+      <div
+        class="dot absolute w-6 h-6 bg-white rounded-full shadow -left-1 -top-1 transition"
+      />
+    </div>
+    <!-- label -->
+    <div class="ml-3 text-gray-700 font-medium">Toggle Me!</div>
+  </label>
+</div>
+
+<!-- Toggle B -->
+<div class="flex items-center justify-center w-full mb-12">
+  <label for="toggleB" class="flex items-center cursor-pointer">
+    <!-- toggle -->
+    <div class="relative">
+      <!-- input -->
+      <input type="checkbox" id="toggleB" class="sr-only" />
+      <!-- line -->
+      <div class="block bg-gray-600 w-14 h-8 rounded-full" />
+      <!-- dot -->
+      <div
+        class="dot absolute left-1 top-1 bg-white w-6 h-6 rounded-full transition"
+      />
+    </div>
+    <!-- label -->
+    <div class="ml-3 text-gray-700 font-medium">Toggle Me!</div>
+  </label>
+</div>
diff --git a/src/App.svelte b/src/App.svelte
index bfbb5f7..9800b5e 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -6,10 +6,12 @@
 
 <script>
   import { onMount } from "svelte";
-  //роутер ==========================================
   import { Route, router, active } from "tinro";
   router.mode.hash(); // enables hash navigation method
   //router.mode.memory(); // enables in-memory navigation method
+  //import Chart from "svelte-frappe-charts";
+
+  //import components
   import Card from "./widgets/Card.svelte";
   import Input from "./widgets/Input.svelte";
   import Toggle from "./widgets/Toggle.svelte";