Improved FlowStream components
We have improved declaring of FlowStream components. If you provide your own version of Total.js FlowStream Designer, please update it from GitHub.
New improvements
CSS
FlowStream designer compiler replaces all phrases CLASS for the component name in inline CSS <style> of the component. The old declaration will work too.
Old declaration:
.f-hdd footer { padding: 10px; font-size: 11px; }
.f-hdd footer > div > div { height: 16px; }
.f-hdd footer b { float: right; }
New declaration:
.CLASS footer { padding: 10px; font-size: 11px; }
.CLASS footer > div > div { height: 16px; }
.CLASS footer b { float: right; }
HTML
FlowStream designer compiler replaces all phrases CONFIG, STATUS, NAME, and ICON. So you don't need to declare complicated phrases, duplicate icons, or names. The old declaration will work too.
Code form has been updated too:
Old declaration:
<body>
<header>
<i class="fa fa-recycle"></i>File Watcher
</header>
<footer>
<div><i class="far fa-calendar mr5"></i><span data-bind="?.status.{0}.used__text__format:yyyy-MM-dd HH:mm:ss__empty"></span></div>
<div><i class="fa fa-calculator mr5"></i><span data-bind="?.status.{0}.size__text__helper:filesize__empty"></span></div>
<hr />
<div data-bind="?.config.{0}.path__text__empty"></div>
</footer>
</body>
New declaration:
<body>
<header>
<i class="ICON"></i>NAME
</header>
<footer>
<div><i class="far fa-calendar mr5"></i><span data-bind="STATUS.used__text__format:yyyy-MM-dd HH:mm:ss__empty"></span></div>
<div><i class="fa fa-calculator mr5"></i><span data-bind="STATUS.size__text__helper:filesize__empty"></span></div>
<hr />
<div data-bind="CONFIG.path__text__empty"></div>
</footer>
</body>
