JosLe/reaktor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: wire connections + hint system with star penalty

Browse Source 
- Replace elementFromPoint with bounding rect distance search for port
  detection. The SVG wire overlay was intercepting pointer events,
  requiring users to wait for animations before connecting. Now finds
  the closest port-dot within 18px radius regardless of z-index.
- Add hint system: concept text hidden behind "Mostrar Pista" button.
  Using the hint permanently caps the level at 2 stars max. Reiniciar
  resets the penalty. Visual feedback in objectives and completion screen.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Jose Luis
2026-03-21 02:15:07 +01:00
parent 08206e996e
commit e077e7f553
4 changed files with 146 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
src/index.css
View File

@@ -421,6 +421,54 @@ html, body, #root {
.gm-obj.failed .gm-obj-name { color: var(--text2); }
.gm-obj-check { color: var(--green); font-weight: 700; }
.gm-obj-x { color: var(--red); font-weight: 700; }
.gm-obj.capped .gm-obj-name { color: var(--text2); text-decoration: line-through; }
.gm-obj-locked { color: var(--text2); font-size: 10px; }
.gm-hint-warning {
margin-top: 8px; padding: 6px 8px; background: rgba(255,204,0,0.08);
border-radius: 4px; font-size: 10px; color: var(--yellow); line-height: 1.4;
}
/* Hint panel */
.gm-hint-panel { }
.gm-hint-btn {
width: 100%; display: flex; align-items: center; gap: 8px;
padding: 10px 12px; border: 1px dashed var(--yellow); border-radius: 8px;
background: rgba(255,204,0,0.04); cursor: pointer;
font-family: inherit; transition: all 0.15s;
}
.gm-hint-btn:hover { background: rgba(255,204,0,0.1); border-style: solid; }
.gm-hint-icon { font-size: 16px; }
.gm-hint-label { font-size: 12px; font-weight: 600; color: var(--yellow); flex: 1; text-align: left; }
.gm-hint-penalty {
font-size: 9px; color: var(--red); background: rgba(255,68,102,0.15);
padding: 2px 6px; border-radius: 3px; font-weight: 700;
}
.gm-hint-revealed {
background: var(--surface); border: 1px solid var(--yellow); border-radius: 8px;
overflow: hidden;
}
.gm-hint-header {
padding: 8px 12px; display: flex; justify-content: space-between; align-items: center;
font-size: 12px; font-weight: 600; color: var(--yellow);
background: rgba(255,204,0,0.06);
}
.gm-hint-penalty-tag {
font-size: 9px; color: var(--red); background: rgba(255,68,102,0.15);
padding: 2px 6px; border-radius: 3px; font-weight: 700;
}
.gm-hint-text {
padding: 8px 12px 12px; font-size: 11px; color: var(--text); line-height: 1.5;
}
.gm-hint-penalty-msg {
font-size: 11px; color: var(--yellow); margin-bottom: 16px;
}
.gm-big-star.locked {
color: var(--border); font-size: 36px;
}
/* Module palette (game) */
.gm-module-palette {