vertical dashed connectors from main rail to project pins
This commit is contained in:
@@ -674,6 +674,14 @@
|
||||
position: absolute; top: 16px; bottom: 0;
|
||||
z-index: 2; cursor: crosshair; background: transparent;
|
||||
}
|
||||
.tl-connector {
|
||||
position: absolute;
|
||||
width: 0;
|
||||
border-left: 1px dashed rgba(232,220,196,.22);
|
||||
transform: translateX(-50%);
|
||||
pointer-events: none;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.project-events {
|
||||
margin-top:.8rem; padding-top:.8rem; border-top:1px solid var(--line);
|
||||
@@ -922,6 +930,13 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Vertical connectors: main rail → project pin -->
|
||||
<template x-for="line in projectConnectors()" :key="line.id">
|
||||
<div class="tl-connector"
|
||||
:style="`left:${line.pct}%;top:${line.top}px;height:${line.height}px`">
|
||||
</div>
|
||||
</template>
|
||||
|
||||
</div><!-- /.tl-wrap -->
|
||||
</div>
|
||||
|
||||
@@ -2131,6 +2146,26 @@
|
||||
return result.sort((a, b) => a.term.localeCompare(b.term))
|
||||
},
|
||||
|
||||
// Vertical connector lines from main-rail event dots down to project pins.
|
||||
// SUBLABEL_H ≈ 1rem margin-top + 10px text + 6px margin-bottom = 32px
|
||||
projectConnectors() {
|
||||
if (!this.game) return []
|
||||
const projs = this.projects()
|
||||
if (!projs.length) return []
|
||||
const SUBLABEL_H = 32, ROW_H = 36, PIN_LEVEL = 7
|
||||
return this.events()
|
||||
.filter(ev => ev.project_id)
|
||||
.map(ev => {
|
||||
const idx = projs.findIndex(p => p.id === ev.project_id)
|
||||
if (idx === -1) return null
|
||||
const pct = this.posPercent(ev.date)
|
||||
const topY = this.tlRailY()
|
||||
const pinY = this.tlHeight() + SUBLABEL_H + idx * ROW_H + PIN_LEVEL
|
||||
return { id: ev.id, pct, top: topY, height: Math.max(0, pinY - topY) }
|
||||
})
|
||||
.filter(Boolean)
|
||||
},
|
||||
|
||||
openAddEventToProject(project, clickEvent) {
|
||||
const env = this.randomEnv(project.discipline)
|
||||
this.activeForm = {
|
||||
|
||||
Reference in New Issue
Block a user