feat: revamp collections ui

components/smart/ChangeLanguage.vue

@@ -2,6 +2,7 @@
   <span>
     <tippy
       ref="language"
+      interactive
       tabindex="-1"
       trigger="click"
       theme="popover"

components/smart/Tabs.vue

@@ -1,6 +1,6 @@
 <template>
-  <div class="flex flex-col flex-nowrap relative flex-1">
-    <div class="tabs hide-scrollbar" :class="styles">
+  <div class="flex flex-col flex-nowrap flex-1">
+    <div class="tabs hide-scrollbar relative" :class="styles">
       <div class="flex w-0">
         <div class="inline-flex">
           <button

components/smart/Toggle.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="inline-block cursor-pointer" @click="toggle()">
+  <div class="inline-block cursor-pointer" @click="$emit('change')">
     <label ref="toggle" class="toggle" :class="{ on: on }">
       <span class="handle"></span>
     </label>
@@ -17,13 +17,6 @@ export default {
       default: false,
     },
   },
-
-  methods: {
-    toggle() {
-      const containsOnClass = this.$refs.toggle.classList.toggle("on")
-      this.$emit("change", containsOnClass)
-    },
-  },
 }
 </script>