carbon / codepen
Code alongside a live preview rendered by Fusion. You can configure it further to use Javascript to preview or inject JS and styles via Fusion
Installs: 1 320
Dependents: 1
Suggesters: 0
Security: 0
Stars: 0
Watchers: 2
Forks: 0
Open Issues: 5
Language:TypeScript
Type:neos-carbon
Requires
- neos/neos-ui: ^7.3 || ^8.0
- dev-main
- 0.2.12
- 0.2.11
- 0.2.10
- 0.2.9
- 0.2.8
- 0.2.7
- 0.2.6
- 0.2.5
- 0.2.4
- 0.2.3
- 0.2.2
- 0.2.1
- 0.2.0
- 0.1.0
- dev-dependabot/npm_and_yarn/Resources/Private/Plugin/micromatch-4.0.8
- dev-dependabot/npm_and_yarn/Tests/Integration/TestDistribution/micromatch-4.0.8
- dev-dependabot/npm_and_yarn/Resources/Private/Plugin/cross-spawn-7.0.6
- dev-dependabot/npm_and_yarn/Resources/Private/Plugin/nanoid-3.3.8
- dev-dependabot/npm_and_yarn/Tests/Integration/TestDistribution/nanoid-3.3.8
- dev-dependabot/npm_and_yarn/Tests/Integration/TestDistribution/braces-3.0.3
- dev-dependabot/npm_and_yarn/Resources/Private/Plugin/babel/traverse-7.23.2
This package is auto-updated.
Last update: 2024-12-18 11:10:36 UTC
README
Live (Fusion) Preview
Code alongside a live preview rendered by Fusion. You can configure it further to use Javascript to preview or inject JS and styles via Fusion
Tailwind CSS support
- Use Tailwind code completion & hover support and more
- Use your custom Tailwind config with plugins
- For the live preview, the styles are generated from the content
AFX support
- Based on HTML with code completion and hover documentation of configured Fusion objects.
CodePen Features
- Fullscreen (F11), Save (Strg+S) and close (Strg+Q)
- Toggle preview top/bottom or left/right
- Multiple configurable tabs
- Configure custom completion items for a tab. You can even use ClientEval and dynamically reference other node properties.
- Configure the language
FAQ
What is the use of Tailwind in this editor? How can I save my generated styles?
You can't use it unless you use NodeJS on the server and want to create a pipeline there. It is certainly possible to generate styles on the client, as shown in the live preview, but we don't know yet how we can wrap this into a nice API. If you want to help and have ideas about that, feel free to get in touch!