Fireblade
Search…
Fireblade
Introduction
Changelog
Know Issues
Tutorial
Getting Started
Setup
Preview
Responsive Alignment
Form Elements
FEATURES
Auto-align
Marked for Export
Powered By GitBook
Preview

Actions in the artboard element panel

Select an artboard and execute de preview action located in artboard element panel.
Actions in artboard element panel.

Live preview tool

The preview action creates html and css format files in a temporary folder on the user's machine. For security, the Adobe XD API does not allow that the plugin open the browser to display local content. For this reason, we created the Fireblade live preview tool.
This limitation only affects the preview action. It does not affect the export action, because the Fireblade plugin in the export action only generates content in a folder previously selected by the user and does not attempt to open the browser to display this generated content.
After performing the preview action, if the Fireblade live preview tool is not active, a window with information on how to download will appear.
Live preview download window.
If you already have the Fireblade live preview tool installed, just run, otherwise install and run to make the preview action work.
Fireblade live preview tool started.

Preview action result

With the Fireblade live preview tool running, return to the Fireblade plugin, click on the preview action and check de result on Fireblade live preview tool.
Preview action result.
The background color of the artboard and login form has been changed so that you can see the artboard boundaries in the generated content. This will make it easier to see responsiveness actions in the next steps.
When using the preview action, Fireblade's live preview tool will always try to be active after the Fireblade server activity has finished.
Tutorial - Previous
Setup
Next - Tutorial
Responsive Alignment
Last modified 1yr ago
Copy link
Contents
Actions in the artboard element panel
Live preview tool
Preview action result