adjust padding and truncate app bar subtitle text if too long

liamcottle · Nov 22, 2024 · 34bdc81 · 34bdc81
1 parent 3d996aa
commit 34bdc81
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/src/components/AppBar.vue b/src/components/AppBar.vue
@@ -16,13 +16,13 @@
         </div>
 
         <!-- title and subtitle -->
-        <div class="my-auto mr-auto">
+        <div class="my-auto mr-auto overflow-hidden">
             <div class="font-bold">{{ title }}</div>
-            <div v-if="subtitle != null" class="text-sm">{{ subtitle }}</div>
+            <div v-if="subtitle != null" class="text-sm truncate">{{ subtitle }}</div>
         </div>
 
         <!-- optional: trailing -->
-        <div class="flex my-auto mr-2">
+        <div class="flex my-auto mx-2">
             <slot name="trailing"/>
         </div>
 

diff --git a/src/components/pages/NodeTraceRoutesPage.vue b/src/components/pages/NodeTraceRoutesPage.vue
@@ -8,7 +8,7 @@
             </template>
             <template v-slot:trailing>
                 <RouterLink v-if="node" :to="{ name: 'node.traceroutes.run', params: { nodeId: node.num }}">
-                    <IconButton  class="mx-2 bg-transparent text-gray-700">
+                    <IconButton class="bg-transparent text-gray-700">
                         <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
                             <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
                         </svg>