Add graphical zone editor and update documentation

- Implemented visual zone editor (Super+Shift+E)
- Draw zones with mouse click-and-drag
- Ctrl+S to save, Ctrl+C to cancel, Delete to remove last zone
- Updated README with zone editor documentation
- Added CSS styles for editor interface
- Custom layouts are now created without code editing

README.md

@@ -5,7 +5,8 @@ A window tiling manager extension for Linux Mint's Cinnamon Desktop, inspired by
 ## Features
 
 - **Multiple Zone Layouts**: Pre-configured layouts including 2x2 grid, 3 columns, and focus layouts
-- **Visual Overlay**: See your zones while dragging windows
+- **Graphical Zone Editor**: Draw custom zones visually with your mouse - no code editing required!
+- **Visual Overlay**: See your zones while dragging windows (hold Shift)
 - **Keyboard Shortcuts**: Quick snap to zones using hotkeys
 - **Layout Cycling**: Switch between different zone layouts on the fly
 
@@ -29,6 +30,7 @@ A window tiling manager extension for Linux Mint's Cinnamon Desktop, inspired by
 
 - **Super + Z**: Toggle zone overlay (show/hide zones)
 - **Super + Shift + Z**: Cycle through different layouts
+- **Super + Shift + E**: Open graphical zone editor
 - **Super + Numpad 1-9**: Snap focused window to zone 1-9
 
 ### Mouse Usage
@@ -37,6 +39,19 @@ A window tiling manager extension for Linux Mint's Cinnamon Desktop, inspired by
 2. Drop the window over a zone to snap it there
 3. Release Shift or move outside zones to cancel
 
+### Graphical Zone Editor
+
+Create custom layouts visually by drawing zones with your mouse:
+
+1. Press **Super + Shift + E** to open the zone editor
+2. **Click and drag** to draw rectangular zones
+3. Draw as many zones as you need
+4. **Ctrl + S** to save your custom layout
+5. **Ctrl + C** or **Escape** to cancel
+6. **Delete/Backspace** to remove the last zone
+
+Your custom layout will be added to the layout rotation and can be accessed with Super + Shift + Z.
+
 ## Available Layouts
 
 1. **2x2 Grid**: Four equal quadrants
@@ -45,7 +60,16 @@ A window tiling manager extension for Linux Mint's Cinnamon Desktop, inspired by
 
 ## Customization
 
-To add your own layouts, edit the `DEFAULT_LAYOUTS` object in `extension.js`:
+### Easy Way: Use the Graphical Editor
+
+1. Press **Super + Shift + E** to open the zone editor
+2. Draw zones by clicking and dragging
+3. Press **Ctrl + S** to save your custom layout
+4. Your layout is immediately available in the layout rotation!
+
+### Advanced Way: Edit the Code
+
+To add your own layouts manually, edit the `DEFAULT_LAYOUTS` object in `extension.js`:
 
 ```javascript
 const DEFAULT_LAYOUTS = {
@@ -107,13 +131,14 @@ tail -f ~/.cinnamon/glass.log
 
 ## Future Enhancements
 
-- [ ] Custom layout editor GUI
+- [x] Custom layout editor GUI
 - [ ] Per-monitor zone configurations
-- [ ] Save window positions and restore on login
+- [ ] Save custom layouts permanently to file
+- [ ] Edit existing custom layouts in the graphical editor
 - [ ] Zone layout import/export
 - [ ] More pre-configured layouts
 - [ ] Animation effects
-- [ ] Settings panel for configuration
+- [ ] Settings panel for keybinding customization
 
 ## Contributing