Canvas Design System
Main Site Tokens

Results Overlay

Animated results panel for displaying operation outcomes. Available as a full overlay or inline results block.

Overlay Variant

Covers the parent container with a success state. Used inside modals after operations complete.

This content is behind the overlay.

<?= ws_results_overlay([
    'id' => 'cleanupResults',
    'variant' => 'overlay',
    'title' => 'Cleanup Complete',
    'icon' => 'check_circle',
    'buttonText' => 'Done',
    'buttonId' => 'cleanupDoneBtn',
]) ?>

Inline Variant

Appears inline below other content. No button, no overlay positioning.

Cleanup Complete
  • Rounded 3 activity durations
  • Added 1 break after 90 minutes
  • Fixed 2 title formatting issues
<?= ws_results_overlay([
    'id' => 'inlineResults',
    'variant' => 'inline',
    'title' => 'Cleanup Complete',
    'icon' => 'check_circle',
]) ?>

API

ParamTypeDefaultDescription
idstringElement ID (required)
variantstringoverlayoverlay|inline
titlestring"Complete"Results title
iconstringcheck_circleIcon name
buttonTextstring"Done"Action button text (overlay only)
buttonIdstring"{id}-done"Action button ID (overlay only)
listIdstring"{id}-list"Results list UL ID