Open
Description
Redesign the Property Grid to improve usability, aesthetics, and functionality, drawing inspiration from GrapeJS and EditorX. This will provide an intuitive interface for editing properties, including advanced units, margins, and borders.
Key Features:
- Modernized UI & UX – Improve the layout and styling for better readability and usability.
- Unit Editor – Allow users to easily switch between px, %, em, rem, vh, etc. for compatible properties.
- Specialized Property Editors:
- Margin & Padding Editor – Visual representation for adjusting spacing.
- Border Editor – Graphical controls for setting border width, style, and color.
- Color Picker – Enhance color selection with transparency and preset options.
- Shadow Editor – Simplify editing of box-shadow and text-shadow.
- Dynamic Descriptions:
- Web Components Manifest Support – If the selected element has a manifest, display property descriptions from the webcomponents.json.
- MDN Integration – For standard HTML and CSS properties, fetch and display relevant descriptions from MDN.
- Support Editing Property of css classes and virtual attributes (like hover, ...)
- Icons for many property grid properties
Sample from GrapeJS:
