@phoenix-plugin-registry/brackets-css-shapes-editor
v1.1.0
Published
Adds an interactive editor for CSS Shapes values in Live Preview mode.
Downloads
1
Readme
CSS Shapes Editor for Brackets
Extension for Brackets and Adobe Edge Code.
Adds an on-screen interactive editor for CSS Shapes values when in Live Preview mode.
How to Install
Simple:
- Open Brackets, and go to File > Extension Manager
- Search for "CSS Shapes Editor for Brackets"
- Click Install
From source
- Open Brackets, and go to File > Extension Manager
- Click Install from URL...
- Enter this URL:
https://github.com/adobe-webplatform/brackets-css-shapes-editor
- Click Install
- Reload Brackets.
How to enable CSS Shapes
UPDATE September 2014: CSS Shapes are enabled since Google Chrome 37. If you're using Chrome 37+, this section is no longer relevant.
If you're using an older version of Chrome, here's how to enable the feature manually:
Before you use the shapes editor, you need to enable support for CSS Shapes in the LivePreview browser window. You need to do this even if you have already enabled CSS Shapes in another Google Chrome browser on your system.
To enable CSS Shapes:
- Turn on LivePreview
- Navigate to
chrome://flags
- Find the Enable experimental Web Platform features flag
- Click Enable
- Reload LivePreview.
Changelog
v1.1.0
- sync with shapes editor library v0.8.0
- fixes various bugs related to reference boxes and percentage-based coordinates;
- adds on-screen controls for polygon edit / transform modes;
- uses minified version of library;
- removes keyboard shortcut (T key) to toggle polygon transform mode.
- removes handling & feature detection of
shape-inside
(obsolete from CSS Shapes Level 1)
License
MIT-licensed -- see main.js
for details.