Planer: Phys/Mag-Badge bei Boss-Mechaniken im Gantt-Diagramm

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

css/planner.css

@@ -920,6 +920,9 @@
   position:      absolute;
   top:           8px;
   transform:     translateX(-50%);
+  display:       inline-flex;
+  align-items:   center;
+  gap:           4px;
   max-width:     150px;
   padding:       5px 8px;
   border:        1px solid rgba(224,92,92,.35);
@@ -929,8 +932,6 @@
   font-size:     12px;
   cursor:        pointer;
   overflow:      hidden;
-  text-overflow: ellipsis;
-  white-space:   nowrap;
   z-index:       3;
 }
 
@@ -950,6 +951,15 @@
   background:   rgba(177,112,255,.28);
 }
 
+.timeline-boss-action-name {
+  overflow:      hidden;
+  text-overflow: ellipsis;
+  white-space:   nowrap;
+}
+.timeline-boss-action .dmg-type-badge {
+  flex-shrink: 0;
+}
+
 .timeline-mitigation {
   position:      absolute;
   top:           6px;

js/planner.js

@@ -1258,7 +1258,7 @@ function renderTimelineHtml(plan) {
                 style="left:${left}%;top:${8 + lane * 30}px"
                 data-mechanic-id="${escHtml(m.id)}"
                 title="${escHtml(fmtTimestamp(m.timestamp))} · ${escHtml(m.name)} · ${m.isHeavyTankbuster ? 'Tankbuster' : 'AoE'}">
-            ${escHtml(m.name)}
+            <span class="timeline-boss-action-name">${escHtml(m.name)}</span>${dmgTypeBadge(m.abilityType)}
         </button>
     `).join('');