Benjamin Palko
f526f5c0aa
Some checks failed
Deploy / deploy (push) Failing after 39s
Co-authored-by: Benjamin Palko <benjaminpalko@hotmail.com> Reviewed-on: #5
57 lines
1.1 KiB
Markdown
57 lines
1.1 KiB
Markdown
### calendar
|
|
|
|
Calendar includes styles for different calendar libraries
|
|
|
|
[calendar docs](https://daisyui.com/components/calendar/)
|
|
|
|
#### Class names
|
|
|
|
- component
|
|
- `cally (for Cally web component)`
|
|
- `react-day-picker (for the DayPicker component)`
|
|
- `vc (for Vanilla Calendar Pro)`
|
|
|
|
#### Syntax
|
|
|
|
For Cally:
|
|
|
|
```html
|
|
<calendar-date class="cally">{CONTENT}</calendar-date>
|
|
```
|
|
|
|
For React Day Picker:
|
|
|
|
```html
|
|
<DayPicker className="react-day-picker"></DayPicker>
|
|
```
|
|
|
|
For Vanilla Calendar Pro:
|
|
|
|
```html
|
|
<div id="calendar" class="vc"></div>
|
|
```
|
|
|
|
```js
|
|
import { Calendar } from 'vanilla-calendar-pro';
|
|
|
|
const calendar = new Calendar('#calendar');
|
|
calendar.init();
|
|
```
|
|
|
|
Or using CDN:
|
|
|
|
```html
|
|
<script src="https://cdn.jsdelivr.net/npm/vanilla-calendar-pro/index.js" defer></script>
|
|
<div id="calendar" class="vc"></div>
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
const { Calendar } = window.VanillaCalendarPro;
|
|
const calendar = new Calendar('#calendar');
|
|
calendar.init();
|
|
});
|
|
</script>
|
|
```
|
|
|
|
#### Rules
|
|
|
|
- daisyUI supports Cally, React Day Picker and Vanilla Calendar Pro
|