item.json

{
    "name": "Progress - Bar Multiple",
    "url": "https:\/\/getbootstrap.com\/docs\/4.0\/components\/progress\/",
    "type": "0fe0ad4d-99b3-4f68-bf6e-5c71a621d8c3",
    "heading": "multiple progress-bar",
    "library": "6f6650a5-ebff-4783-8508-f0285c0e98a6",
    "guid": "ba880df9-57ef-42f4-be16-fe2a10f73356",
    "contributor_email": "sales@mwweb.host",
    "contributor_name": "Steve Voorhees",
    "contributor_website": "https:\/\/mostwantedwebhosting.com",
    "contributor_company": "Most Wanted Web Services, Inc.",
    "snippet": "<div class=\"progress\">\r\n  <div class=\"progress-bar\" role=\"progressbar\" style=\"width: 15%\" aria-valuenow=\"15\" aria-valuemin=\"0\" aria-valuemax=\"100\"><\/div>\r\n  <div class=\"progress-bar bg-success\" role=\"progressbar\" style=\"width: 30%\" aria-valuenow=\"30\" aria-valuemin=\"0\" aria-valuemax=\"100\"><\/div>\r\n  <div class=\"progress-bar bg-info\" role=\"progressbar\" style=\"width: 20%\" aria-valuenow=\"20\" aria-valuemin=\"0\" aria-valuemax=\"100\"><\/div>\r\n<\/div>",
    "usage": "Include multiple progress bars in a progress component if you need.",
    "description": "Progress components are built with two HTML elements, some CSS to set the width, and a few attributes. We don\u2019t use the HTML5  element, ensuring you can stack progress bars, animate them, and place text labels over them.\r\n\r\n    We use the .progress as a wrapper to indicate the max value of the progress bar.\r\n    We use the inner .progress-bar to indicate the progress so far.\r\n    The .progress-bar requires an inline style, utility class, or custom CSS to set their width.\r\n    The .progress-bar also requires some role and aria attributes to make it accessible.\r\n",
    "@dependencies": [
        {
            "key": "guid",
            "value": "0fe0ad4d-99b3-4f68-bf6e-5c71a621d8c3",
            "entity": "snippet_type",
            "table": "#__componentbuilder_snippet_type",
            "direction": "out"
        },
        {
            "key": "guid",
            "value": "6f6650a5-ebff-4783-8508-f0285c0e98a6",
            "entity": "library",
            "table": "#__componentbuilder_library",
            "direction": "out"
        }
    ]
}