Tags - Done

description tags are small, reusable ui components designed to visually represent labels, statuses, or categories they are styled differently based on their context (e g , “success,” “warning,” “danger”) and are designed to be consistent and easily customizable across applications html structure the tag container wraps multiple tag elements each tag represents a distinct label or category container class tag container acts as a wrapper to contain a one or more tags and space them evenly on a page tag class tag used for the individual tags modifier classes success , warning , danger , info – applied to differentiate tag styles standard success warning danger info how to use 1\ adding a tag add a new \<div> element inside the tag container with the tag class use modifier classes for contextual styles as needed new tag 2\ (optional) add a modifier tag use the pre defined modifier classes (success, warning, danger, info) to style the tags appropriately success indicates success, typically styled with a green background warning indicates caution or attention, typically styled with a yellow/orange background danger indicates errors or critical issues, typically styled with a red background info provides informational context, typically styled with a blue background new tag 3\ customizing content change the text inside the tag element to reflect the label or category custom label adding a tooltip to tags to add a tooltip to a tag, use the data tippy content attribute with the desired tooltip text you can also control the tooltip’s placement using the data placement attribute example structure with tooltips standard success warning danger info