{"title":"Atoms\/Link","parameters":{"componentSubtitle":"Bootstrap Link Component","docs":{"description":{"component":"Link with Bootstrap Link helpers and utility classes."},"story":{"inline":true}}},"argTypes":{"url":{"name":"URL Link","description":"URL link","defaultValue":"","control":"text"},"content":{"name":"Content","description":"Link Content","control":"text","defaultValue":"Button"},"color":{"name":"Link Color","description":"Bootstrap includes several predefined link colors to colorize links. these classes have a :hover and :focus state. Some of the link styles use a relatively light foreground color, and should only be used on a dark background in order to have sufficient contrast.","defaultValue":"","control":"select","options":{"'- none -'":"","Primary":"primary","Secondary":"secondary","Success":"success","Danger":"danger","Warning":"warning","Info":"info","Light":"light","Dark":"dark","'Body emphasis'":"body-emphasis"}},"opacity":{"name":"Link opacity","description":"Change the alpha opacity of the link rgba() color value with utilities. Please be aware that changes to a color\u2019s opacity can lead to links with insufficient contrast.","defaultValue":"","control":"select","options":{"'- none -'":"","'Link opacity 10'":"10","'Link opacity 25'":"25","'Link opacity 50'":"50","'Link opacity 75'":"75","'Link opacity 100'":"100"}},"underline_color":{"name":"Underline color","description":"Change the underline\u2019s color independent of the link text color.","defaultValue":"","control":"select","options":{"'- none -'":"","Primary":"primary","Secondary":"secondary","Success":"success","Danger":"danger","Warning":"warning","Info":"info","Light":"light","Dark":"dark"}},"underline_offset":{"name":"Underline offset","description":"Change the underline\u2019s distance from your text. Offset is set in em units to automatically scale with the element\u2019s current font-size.","defaultValue":"","control":"select","options":{"'- none -'":"","'Offset 1'":"1","'Offset 2'":"2","'Offset 3'":"3"}},"underline_opacity":{"name":"Underline opacity","description":"Change the underline\u2019s opacity. Requires adding .link-underline to first set an rgba() color we use to then modify the alpha opacity.","defaultValue":"","control":"select","options":{"'- none -'":"","'Underline opacity 0'":"10","'Underline opacity 10'":"10","'Underline opacity 25'":"25","'Underline opacity 50'":"50","'Underline opacity 75'":"75","'Underline opacity 100'":"100"}},"link_utility_classes":{"name":"Utility Classes","description":"An array of utility classes that can be used to add extra Bootstrap utility classes or custom classes to this component.","control":"object","defaultValue":[]},"attributes":{"name":"Attributes","description":"HTML attributes for the containing element.","control":"object","defaultValue":[]}},"stories":[{"name":"Link","args":{"url":"#","content":"Link Text","color":"","opacity":"","underline_color":"","underline_offset":"","underline_opacity":"","link_utility_classes":[]},"parameters":{"server":{"id":"eyJwYXRoIjoidGhlbWVzXC9jb250cmliXC92YXJ0aGVtZV9iczVcL2NvbXBvbmVudHNcL2F0b21zXC9saW5rXC9saW5rLnN0b3JpZXMudHdpZyIsImlkIjoiTGluayJ9"}}},{"name":"Read more","args":{"url":"#","content":"Read more ...","color":"","opacity":"","underline_color":"dark","underline_offset":"3","underline_opacity":"50","link_utility_classes":[]},"parameters":{"server":{"id":"eyJwYXRoIjoidGhlbWVzXC9jb250cmliXC92YXJ0aGVtZV9iczVcL2NvbXBvbmVudHNcL2F0b21zXC9saW5rXC9saW5rLnN0b3JpZXMudHdpZyIsImlkIjoiUmVhZE1vcmUifQ%3D%3D"}}}]}