You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/07-Pro Features/01-live-preview-edit.md
+6-6Lines changed: 6 additions & 6 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -63,26 +63,26 @@ The Tool Box displays different options depending on the selected element type.
63
63
*This button appears only when a valid parent exists (it is not shown when the parent is `body`, `html`, or a JavaScript-rendered element).*
64
64
65
65
-**Edit Text***(pencil icon)*: Opens inline text editing for the selected element. You can edit text directly in the Live Preview, and Phoenix Code automatically updates the source code.
66
+
*This button appears only for elements that can contain text (it is not available for `<img>`, `<video>`, `<br>`, etc.).*
66
67
See the [Inline Text Editing](#inline-text-editing) section for more details.
67
-
*This button appears only for elements that can contain text (it is not available for `<img>`, `<video>`, `<br>`, etc.).*
68
68
69
69
-**Edit Hyperlink***(link icon)*: Opens a floating input box that lets you edit the element's `href` attribute.
70
+
*This button appears only for `<a>` elements.*
70
71
See the [Edit Hyperlink](#edit-hyperlink) section for more details.
71
-
*This button appears only for `<a>` elements.*
72
72
73
73
-**Image Gallery***(image icon)*: Opens an image gallery at the bottom of the Live Preview, where you can browse and select an image. You can also choose an image from your computer. Phoenix Code automatically saves the image to your project folder and updates the src attribute of the element.
74
+
*This button appears only for `<img>` elements.*
74
75
See [Image Gallery](./02-image-gallery.md) for more details.
75
-
*This button appears only for `<img>` elements.*
76
76
77
77
-**Duplicate***(copy icon)*: Copies the selected element and places it below. You can also duplicate elements using `Ctrl/Cmd + D` after clicking an element.
78
78
*This option is available for all elements.*
79
79
80
80
-**Delete***(trash icon)*: Deletes the selected element. You can also delete elements using the `Delete` key after clicking an element.
81
81
*This option is available for all elements.*
82
82
83
-
-**More Options***(three-dots icon)*: Opens a menu with additional actions.
84
-
See [Cut, Copy, and Paste](#cut-copy-and-paste)for more details. You can also open this menu by right-clicking anywhere in the live preview, but only in Edit Mode.
85
-
*This option is available for all elements.*
83
+
-**More Options***(three-dots icon)*: Opens a menu with additional actions. You can also open this menu by right-clicking anywhere in the live preview, but only in Edit Mode.
84
+
*This option is available for all elements.*
85
+
See [Cut, Copy, and Paste](#cut-copy-and-paste)for more details.
86
86
87
87
> The Tool Box is never shown for non-editable elements that are dynamically created by JavaScript.
0 commit comments