bugfix(fe2): Coloring function disappears if parameter title is too l…

…ong (#2255)

* Add truncation to filter name

* Use shortened model name in scene explorer

* Revert "Use shortened model name in scene explorer"

This reverts commit b86e1d8.

* Remove gap

packages/frontend-2/components/viewer/explorer/Filters.vue

@@ -3,18 +3,18 @@
     <template #title>Filtering</template>
     <template #actions>
       <div class="flex justify-between items-center w-full">
-        <div class="-mt-1">
-          <FormButton
-            v-tippy="'Change Filter'"
-            text
-            size="xs"
-            :icon-right="showAllFilters ? ChevronUpIcon : ChevronDownIcon"
-            class="capitalize"
-            @click="showAllFilters = !showAllFilters"
-          >
+        <FormButton
+          v-tippy="'Change Filter'"
+          text
+          size="xs"
+          :icon-right="showAllFilters ? ChevronUpIcon : ChevronDownIcon"
+          class="capitalize"
+          @click="showAllFilters = !showAllFilters"
+        >
+          <span class="max-w-20 md:max-w-36 truncate">
             {{ title.split('.').reverse()[0] || title || 'No Title' }}
-          </FormButton>
-        </div>
+          </span>
+        </FormButton>
         <div class="flex gap-1 divide-x divide-outline-3">
           <FormButton
             v-if="title !== 'Object Type'"