Sub Steps Icon Inactive Pick & Delivery

You can change the default "Icon" used in the order substeps by setting "icon" parameter on each step. The "Icon" configuration are being set in the "substeps" attribute of the configuration object.

Implementation



Available parameters

Parameters libParameters webDescription
substeps.picking.iconInactivesubStepPickingIconInactiveString with an URL which will be used as display icon in the Picking order substep when substep is inactive
substeps.goingToDestination.iconInactivesubStepGoingToDestinationIconInactiveString with an URL which will be used as display icon in the Going To Destination order substep when substep is inactive
ssubsteps.delivered.iconInactivesubStepDeliveredIconString with an URL which will be used as display icon in the Delivered order substep when substep is inactive

Code

<!DOCTYPE html>
<head>
    <title>LSW v3 Embed</title>
</head>
<body>
    <div id="instaleap-lsw-v3"></div>
</body>

<script src="https://xandar-lsw-v3.instaleap.io/lib/status.js"></script>
<script>
    const params = {
        job: "myJob",
        token: "myToken",
        container: "#instaleap-lsw-v3",
        substeps: {
          picking: {
            iconInactive: 'url'
          },
          goingToDestination: {
            iconInactive: 'url'
          },
          delivered: {
            iconActive: 'url',
          },
        }
    }
    window.instaleap.status.render(params)
</script>
</html>
https://xandar-lsw-v3.instaleap.io/status?job=myJob&token=myToken&subStepPickingIconInactive=url&subStepGoingToDestinationIconInactive=url&subStepDeliveredIconInactive=url

Demo


🤓

NOTE: Please do not modify the Demo, this is a visual aid.