Safe DOM style helper
Temporary safe styling cues for emphasis, inspection, and guided visible workflows.
Best for
Short-lived visual signals that help a human follow the run.
Load with
RTO_form_api.js first.
Works well with
RTO_DOM_highlight.js and examples.
Summary
Apply safe visual highlight styles to a selector inside a controlled tab.
- Exports:
RTOSetRemoteStyle - Depends on:
RTO_form_api.js - Auto-binds: elements with
data-rto-style+data-rto-selector - Uses data attributes:
data-rto-selector,data-rto-style,data-rto-tabKey(recommended),data-rto-tabkey(legacy),data-rto-key(legacy)
Only safe visual style properties are supported: outline, border, box shadow, and background color. Layout-changing, hiding, clickable, and text-disguising properties are intentionally rejected by the v8.5.0 safety model.
What it is
Apply safe visual highlight styles to an element inside a controlled tab. It can bind buttons with a JSON style payload.
Download
Download RTO_DOM_style.jsExample
<button
data-rto-tabKey="app"
data-rto-selector="#submit"
data-rto-style='{"outline":"3px solid red"}'
>
Outline submit button
</button>
<script src="../RTO_helpers/RTO_form_api.js"></script>
<script src="../RTO_helpers/RTO_DOM_style.js"></script>Data attributes
data-rto-selector: selector in the remote tabdata-rto-style: JSON object of inline stylesdata-rto-tabKey: tabKey (recommended)data-rto-tabkey: legacy alias (accepted)data-rto-key: legacy alias (accepted)