fix css

src/components/WebContentViewer.vue

@@ -55,8 +55,9 @@
                             </svg>
                         </div>
                     </template>
-                    <div class="w-4/6 flex items-center px-4 py-2 truncate cursor-pointer">
+                    <div class="w-4/6 flex items-center px-4 py-2  cursor-pointer">
-                        {{ file.name }}
+                        <div class="truncate max-sm:max-w-32 max-w-64">{{ file.name }}</div>
+                        
                     </div>
                     <div class="w-2/6 py-2 cursor-pointer">
                         {{ formatFileSize(file.size) }}

src/output.css

@@ -675,6 +675,18 @@ video {
   width: 100%;
 }
 
+.max-w-32 {
+  max-width: 8rem;
+}
+
+.max-w-48 {
+  max-width: 12rem;
+}
+
+.max-w-64 {
+  max-width: 16rem;
+}
+
 .transform {
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }