diff --git a/apps/ai-game-creator-shell/src/styles.css b/apps/ai-game-creator-shell/src/styles.css index 0c9984c75..3d0cdbc39 100644 --- a/apps/ai-game-creator-shell/src/styles.css +++ b/apps/ai-game-creator-shell/src/styles.css @@ -5457,6 +5457,31 @@ iframe.preview-frame { visibility: visible; } +.game-resource-card-type-badge { + position: absolute; + top: 8px; + right: 8px; + z-index: 2; + display: inline-flex; + max-width: calc(100% - 16px); + align-items: center; + min-width: 0; + padding: 4px 8px; + overflow: hidden; + border: 1px solid rgb(255 255 255 / 72%); + border-radius: 999px; + background: rgb(75 48 38 / 84%); + color: #fff; + font-size: 10px; + font-weight: 900; + line-height: 1; + letter-spacing: 0.02em; + pointer-events: none; + text-overflow: ellipsis; + white-space: nowrap; + box-shadow: 0 8px 18px rgb(96 62 47 / 20%); +} + .game-resource-card-open { position: absolute; z-index: 1; diff --git a/apps/ai-game-creator-shell/src/view/project-development/index.tsx b/apps/ai-game-creator-shell/src/view/project-development/index.tsx index 272916fa5..0c05b1f79 100644 --- a/apps/ai-game-creator-shell/src/view/project-development/index.tsx +++ b/apps/ai-game-creator-shell/src/view/project-development/index.tsx @@ -86,6 +86,7 @@ import { RESOURCE_CANVAS_SECTION_MIN_HEIGHT, RESOURCE_CANVAS_SECTION_MIN_WIDTH, RESOURCE_CANVAS_SECTION_ORDER, + RESOURCE_CANVAS_VISIBLE_SECTION_ORDER, type ResourceCanvasCardSize, resourceCanvasCardSize, resourceCanvasContentBounds, @@ -123,6 +124,7 @@ import { type ProjectResource, type ProjectResourceCategory, projectResourcesFromReadModels, + projectResourceTypeLabel, } from './resourceProjectionModel'; import { clampProjectResourceSectionZoom, @@ -393,6 +395,7 @@ export type ProjectDevelopmentViewProps = { }; const categoryOrder = RESOURCE_CANVAS_SECTION_ORDER; +const visibleCategoryOrder = RESOURCE_CANVAS_VISIBLE_SECTION_ORDER; const categoryLabels: Record = { code: '游戏代码', @@ -592,6 +595,7 @@ const ResourceCard = memo(function ResourceCard({ const [decodedIdentity, setDecodedIdentity] = useState(null); const Icon = categoryIcons[resource.category]; const kind = projectResourceCardPreviewKind(resource); + const resourceTypeLabel = projectResourceTypeLabel(resource); const isMedia = kind === 'video' || kind === 'audio'; const mediaActive = activeMediaIdentity === previewIdentity; const sourceUrl = @@ -797,6 +801,13 @@ const ResourceCard = memo(function ResourceCard({ + + {resourceTypeLabel} +