fix(ui): disabled interactive elements keep default cursor

front/src/components/ui/Button.vue

@@ -217,7 +217,10 @@ onMounted(() => {
     white-space: nowrap;
     justify-content: space-between;
     align-items: center;
-    cursor: pointer;
+
+    &:not([disabled]) {
+      cursor: pointer;
+    }
 
     padding: calc(var(--padding) / 2 - var(--shift-by)) var(--padding) calc(var(--padding) / 2 + var(--shift-by)) var(--padding);
     &.is-icon-only {

front/src/components/ui/Link.vue

@@ -128,7 +128,9 @@ onMounted(() => {
 
     // Decoration
 
-    cursor: pointer;
+    &:not([disabled]) {
+      cursor: pointer;
+    }
 
     transform: translateX(var(--fw-translate-x)) translateY(var(--fw-translate-y)) scale(var(--fw-scale));
     transition:background-color .2s, border-color .3s;

front/src/style/colors.scss

@@ -533,6 +533,9 @@
     &:hover {
       color:var(--link-hover-color);
     }
+    &[disabled] {
+      cursor: default;
+    }
   }
 
   // Fallback for `active` indicators (pressed)
@@ -570,9 +573,9 @@
     border: 1px solid var(--background-color);
 
     &.interactive {
-      &:hover:not(:has(.interactive:hover)) {
-        color:var(--hover-color, var(--color));
-        background-color:var(--hover-background-color);
+      &:hover:not(:has(.interactive:hover)):not([disabled]) {
+        color: var(--hover-color, var(--color));
+        background-color: var(--hover-background-color);
         border-color: var(--hover-background-color);
       }
       &[aria-pressed=true] {
@@ -599,7 +602,7 @@
     border: 1px solid transparent;
 
     &.interactive {
-      &:hover:not(:has(.interactive:hover)) {
+      &:hover:not(:has(.interactive:hover)):not([disabled]) {
         color: var(--hover-color, var(--color));
         background-color: var(--hover-background-color);
         border-color: var(--hover-background-color);
@@ -634,7 +637,7 @@
     border: 1px solid var(--border-color);
 
     &.interactive, button {
-      &:hover {
+      &:hover:not([disabled]) {
         color:var(--hover-color, var(--color));
         border-color: var(--hover-border-color);
       }

front/src/ui/components/Sidebar.vue

@@ -309,6 +309,7 @@ const isOpen = ref(false)
           thin-font
           icon="bi-heart"
           thick-when-active
+          :disabled="!store.state.auth.authenticated"
         >
           {{ t('components.Sidebar.link.favorites') }}
         </Link>