Styles
You can customize the default styles of this component inside tailwind.config.js setting theme.extend.xtendui.link see css customization. Check xtendui/src/link.css.js for default styles.
Global Styles
Add to the body the class xt-links-default or xt-links-inverse to have link global styles.
Usage
Use a without classes or .xt-link to create a link.
| Syntax | Mixin | Description | |
|---|---|---|---|
| Component | .xt-link | xt-link | Link styles |
To have custom styles use Tailwind CSS, this styles are for automatically styling blank html tags, for example coming from cms or wysiwyg editors. Links
aare automatically styled when they don't have[class]. You can customize components check xtendui/src/link.css.js for default styles.
Links
awithtarget="_blank"needsrel="noopener"orrel="noreferrer"to avoid cross-origin issues.
Variant
Use component utility .xt-links-default and .xt-links-inverse on parent elements to style child links.
| Syntax | Mixin | Variants | Description | |
|---|---|---|---|---|
| Utility | .xt-links-default | xt-links-default | responsive | Default links colors |
| Utility | .xt-links-inverse | xt-links-inverse | responsive | Inverse links colors |
You can nest up to two time included the body to override links styles.