offline docs
This commit is contained in:
105
offline-docs/daisyui/link.md
Normal file
105
offline-docs/daisyui/link.md
Normal file
@@ -0,0 +1,105 @@
|
||||
# daisyUI Documentation - Link Component
|
||||
|
||||
Link adds the missing underline style to links.
|
||||
|
||||
## Classes and Usage
|
||||
|
||||
### Core Classes:
|
||||
- **link** - Adds underline
|
||||
- **link-hover** - Only shows underline on hover
|
||||
- **link-neutral** - neutral color
|
||||
- **link-primary** - primary color
|
||||
- **link-secondary** - secondary color
|
||||
- **link-accent** - accent color
|
||||
- **link-success** - success color
|
||||
- **link-info** - info color
|
||||
- **link-warning** - warning color
|
||||
- **link-error** - error color
|
||||
|
||||
## Examples
|
||||
|
||||
### Basic Link
|
||||
|
||||
```html
|
||||
<a class="link">Click me</a>
|
||||
```
|
||||
|
||||
### Link with Tailwind Reset
|
||||
|
||||
Tailwind CSS resets the style of links by default.
|
||||
Add "link" class to make it look like a again.
|
||||
|
||||
```html
|
||||
<p>
|
||||
Tailwind CSS resets the style of links by default.
|
||||
<br />
|
||||
Add "link" class to make it look like a
|
||||
<a class="link">normal link</a>
|
||||
again.
|
||||
</p>
|
||||
```
|
||||
|
||||
### Link Colors
|
||||
|
||||
#### Primary color
|
||||
|
||||
```html
|
||||
<a class="link link-primary">Click me</a>
|
||||
```
|
||||
|
||||
#### Secondary color
|
||||
|
||||
```html
|
||||
<a class="link link-secondary">Click me</a>
|
||||
```
|
||||
|
||||
#### Accent color
|
||||
|
||||
```html
|
||||
<a class="link link-accent">Click me</a>
|
||||
```
|
||||
|
||||
#### Neutral color
|
||||
|
||||
```html
|
||||
<a class="link link-neutral">Click me</a>
|
||||
```
|
||||
|
||||
#### Success color
|
||||
|
||||
```html
|
||||
<a class="link link-success">Click me</a>
|
||||
```
|
||||
|
||||
#### Info color
|
||||
|
||||
```html
|
||||
<a class="link link-info">Click me</a>
|
||||
```
|
||||
|
||||
#### Warning color
|
||||
|
||||
```html
|
||||
<a class="link link-warning">Click me</a>
|
||||
```
|
||||
|
||||
#### Error color
|
||||
|
||||
```html
|
||||
<a class="link link-error">Click me</a>
|
||||
```
|
||||
|
||||
### Show Underline Only on Hover
|
||||
|
||||
```html
|
||||
<a class="link link-hover">Click me</a>
|
||||
```
|
||||
|
||||
## Features
|
||||
|
||||
- Adds underline style to links
|
||||
- Multiple color variants
|
||||
- Hover-only underline option
|
||||
- Works with Tailwind CSS reset styles
|
||||
|
||||
This component is useful for creating styled links that have proper underline styling and can be customized with different colors.
|
||||
Reference in New Issue
Block a user