Show empty-canvas hint on a page with no components yet
.empty-canvas-hint existed in editor.css but was never rendered anywhere. Wire it up in Canvas.tsx: an EmptyCanvasHint component reads Craft's ROOT node via useEditor and shows the hint once ROOT exists with zero children, hiding again the instant something is dropped in or while a drag is in progress. It's absolutely positioned over the Frame with pointer-events: none so it never intercepts clicks/drops meant for the underlying (empty) canvas -- scoped to regular page editing only, not the header/footer editing mode. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -1225,6 +1225,8 @@ body {
|
||||
Empty Canvas State
|
||||
-------------------------------------------------------------------------- */
|
||||
.empty-canvas-hint {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
@@ -1234,6 +1236,9 @@ body {
|
||||
font-size: 13px;
|
||||
text-align: center;
|
||||
gap: 12px;
|
||||
/* Overlays the drop area without intercepting drags/clicks meant for the
|
||||
underlying (empty) canvas root -- see Canvas.tsx. */
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.empty-canvas-hint i {
|
||||
|
||||
Reference in New Issue
Block a user