소스 검색

Fix: truncate long model tags with a character limit

Long model tags on the Models page in the workspace section were not truncated consistently, which could cause layout issues.

This change implements a hard character limit of 32 characters on the model tags. Tags longer than 32 characters are truncated with an ellipsis (...) directly in the code. The full tag name remains available in the tooltip.
silentoplayz 2 주 전
부모
커밋
ac6292b812
1개의 변경된 파일12개의 추가작업 그리고 10개의 파일을 삭제
  1. 12 10
      src/lib/components/workspace/Models.svelte

+ 12 - 10
src/lib/components/workspace/Models.svelte

@@ -305,16 +305,18 @@
 				</button>
 
 				{#each tags as tag}
-					<button
-						class="min-w-fit outline-none p-1.5 {selectedTag === tag
-							? ''
-							: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition capitalize"
-						on:click={() => {
-							selectedTag = tag;
-						}}
-					>
-						{tag}
-					</button>
+					<Tooltip content={tag}>
+						<button
+							class="min-w-fit outline-none p-1.5 {selectedTag === tag
+								? ''
+								: 'text-gray-300 dark:text-gray-600 hover:text-gray-700 dark:hover:text-white'} transition capitalize"
+							on:click={() => {
+								selectedTag = tag;
+							}}
+						>
+							{tag.length > 32 ? `${tag.slice(0, 32)}...` : tag}
+						</button>
+					</Tooltip>
 				{/each}
 			</div>
 		</div>