style: strengthen flow lines and tighten modal demo parity
This commit is contained in:
@@ -87,6 +87,12 @@ const statusColors: Record<string, string> = {
|
|||||||
idle: 'var(--st-idle)',
|
idle: 'var(--st-idle)',
|
||||||
block: 'var(--st-block)',
|
block: 'var(--st-block)',
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function avatarLabel() {
|
||||||
|
if (props.agent.id === 'iris') return 'IR'
|
||||||
|
if (props.agent.name === 'Full-Stack Developer') return '</>'
|
||||||
|
return props.agent.name.slice(0, 2).toUpperCase()
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@@ -99,7 +105,7 @@ const statusColors: Record<string, string> = {
|
|||||||
<!-- Header -->
|
<!-- Header -->
|
||||||
<div class="m-head">
|
<div class="m-head">
|
||||||
<div :class="['m-av', { iris: agent.id === 'iris' }]">
|
<div :class="['m-av', { iris: agent.id === 'iris' }]">
|
||||||
{{ agent.id === 'iris' ? 'IR' : agent.name.slice(0, 2).toUpperCase() }}
|
{{ avatarLabel() }}
|
||||||
</div>
|
</div>
|
||||||
<div style="flex:1; min-width:0">
|
<div style="flex:1; min-width:0">
|
||||||
<div class="m-name">{{ agent.name }}</div>
|
<div class="m-name">{{ agent.name }}</div>
|
||||||
|
|||||||
@@ -114,8 +114,8 @@ function renderEdges() {
|
|||||||
} else {
|
} else {
|
||||||
// Orchestration (Iris → Agent)
|
// Orchestration (Iris → Agent)
|
||||||
const targetAgent = props.agents.find(a => a.id === e.b)
|
const targetAgent = props.agents.find(a => a.id === e.b)
|
||||||
const op = targetAgent && isActive(targetAgent.status) ? 0.45 : 0.18
|
const op = targetAgent && isActive(targetAgent.status) ? 0.52 : 0.34
|
||||||
paths += `<path d="${d}" fill="none" stroke="#7c6cff" stroke-width="1.2" stroke-dasharray="2 6" opacity="${op}"/>`
|
paths += `<path d="${d}" fill="none" stroke="#8b7cff" stroke-width="1.45" stroke-dasharray="2 6" opacity="${op}"/>`
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user