chore(UI): effect disabled automatically on buttons that have the too…

…ltip

components/interactables/Button/Button.html

@@ -1,7 +1,8 @@
 <button 
   :class="`button is-button is-${size} is-${type} ${outlined ? 'is-outlined' : ''} is-${fullWidth ? 'full-width' : 'normal-width'} ${inactive ? 'is-inactive' : ''}`"
-  v-on:click="action" :disabled="loading">
-  <UiGlowingCursorArea :class="`${!glow ? 'hide' : ''}`">
+  v-on:click="action" :disabled="loading" ref="button">
+  <!-- {{$attrs['data-tooltip']}} -->
+  <UiGlowingCursorArea :hide="$attrs['data-tooltip'] ? true : false">
   <!-- If the button is in the loading state -->
   <div v-if="loading">
     <!-- Loading Spinner -->

components/interactables/Button/Button.vue

@@ -80,12 +80,6 @@ export default Vue.extend({
      */
     fullWidth: Boolean,
     inactive: Boolean,
-
-    //glowing effetc
-    glow: {
-      type: Boolean,
-      default: false,
-    },
   },
 })
 </script>

components/tailored/core/sidebar/Sidebar.html

@@ -31,7 +31,6 @@
           :icon="{ style: 'far', name: 'user-friends' }"
           :action="() => $router.push('/friends/list')"
           :text="$t('global.friends')"
-          :glow="true"
         />
         <span :class="$route.path.includes('/friends/list') ? 'label tag-inverted' : 'label'">
           14
@@ -45,7 +44,6 @@
         :action="() => $router.push('/files/browse')"
         :icon="{ style: 'far', name: 'folder' }"
         :text="$t('global.files')"
-        :glow="true"
       />
     </div>
 
@@ -57,7 +55,6 @@
         :icon="{ style: 'far', name: 'comment-alt-lines' }"
         :text="$t('global.messages')"
         :action="() => $store.commit('showSidebarUsers', true)"
-        :glow="true"
       />
       <InteractablesButton
         full-width
@@ -66,7 +63,6 @@
         :icon="{ style: 'far', name: 'users' }"
         :text="$t('global.groups')"
         :action="() => $store.commit('showSidebarUsers', false)"
-        :glow="true"
       />
     </div>
     <div

components/ui/GlowingCursorArea/GlowingCursorArea.html

@@ -1,4 +1,4 @@
 <div id="custom-cursor-area" @mousemove="moveCursor" @mouseover="hideCursor = false" @mouseleave="hideCursor = true">
-    <div v-if="!hideCursor" id="custom-cursor" ref="point" :style="cursorPoint"></div>
+    <div v-if="!hideCursor && !hide" id="custom-cursor" ref="point" :style="cursorPoint"></div>
     <slot />
 </div>

components/ui/GlowingCursorArea/GlowingCursorArea.less

@@ -4,11 +4,11 @@
   > * {
     pointer-events: none;
   }
-  &.hide {
-    #custom-cursor {
-      display: none;
-    }
-  }
+  // &.hide {
+  //   #custom-cursor {
+  //     display: none;
+  //   }
+  // }
 }
 
 #custom-cursor {

components/ui/GlowingCursorArea/GlowingCursorArea.vue

@@ -3,6 +3,13 @@
 import Vue from 'vue'
 
 export default Vue.extend({
+  props: {
+    hide: {
+      type: Boolean,
+      default: false,
+      required: false,
+    },
+  },
   data() {
     return { xChild: 0, yChild: 0, hideCursor: true }
   },
@@ -21,9 +28,6 @@ export default Vue.extend({
       this.yChild = e.clientY - bounds.top
     },
   },
-  mounted() {
-    // document.addEventListener('mousemove', this.moveCursor)
-  },
 })
 </script>
 <style scoped lang="less" src="./GlowingCursorArea.less"></style>

layouts/chat.vue

@@ -24,10 +24,6 @@ export default Vue.extend({
     this.$Sounds.changeLevels(this.$store.state.audio.volume / 100)
     this.$store.commit('setTypingUser', this.$mock.users[0])
   },
-  updated() {
-    // this.scrollToBottom()
-    console.log(this.$store.state.ui)
-  },
   methods: {
     toggleModal() {
       this.$store.commit('toggleModal', {