offline docs

offline-docs/daisyui/kbd.md

@@ -0,0 +1,131 @@
+# daisyUI Documentation - Kbd Component
+
+Kbd is used to display keyboard shortcuts.
+
+## Classes and Usage
+
+### Core Classes:
+- **kbd** - The main kbd element
+- **kbd-xs** - Extra small size
+- **kbd-sm** - Small size
+- **kbd-md** - Medium size [Default]
+- **kbd-lg** - Large size
+- **kbd-xl** - Extra large size
+
+## Examples
+
+### Basic Kbd
+
+`K`
+
+```html
+<kbd class="kbd">K</kbd>
+```
+
+### Kbd Sizes
+
+`Xsmall` `Small` `Medium` `Large` `Xlarge`
+
+```html
+<kbd class="kbd kbd-xs">Xsmall</kbd>
+<kbd class="kbd kbd-sm">Small</kbd>
+<kbd class="kbd kbd-md">Medium</kbd>
+<kbd class="kbd kbd-lg">Large</kbd>
+<kbd class="kbd kbd-xl">Xlarge</kbd>
+```
+
+### In Text
+
+Press `F` to pay respects.
+
+```html
+Press
+<kbd class="kbd kbd-sm">F</kbd>
+to pay respects.
+```
+
+### Key Combination
+
+`ctrl` + `shift` + `del`
+
+```html
+<kbd class="kbd">ctrl</kbd>
++
+<kbd class="kbd">shift</kbd>
++
+<kbd class="kbd">del</kbd>
+```
+
+### Function Keys
+
+`⌘` `⌥` `⇧` `⌃`
+
+```html
+<kbd class="kbd">⌘</kbd>
+<kbd class="kbd">⌥</kbd>
+<kbd class="kbd">⇧</kbd>
+<kbd class="kbd">⌃</kbd>
+```
+
+### A Full Keyboard
+
+```html
+<div class="my-1 flex w-full justify-center gap-1">
+  <kbd class="kbd">q</kbd>
+  <kbd class="kbd">w</kbd>
+  <kbd class="kbd">e</kbd>
+  <kbd class="kbd">r</kbd>
+  <kbd class="kbd">t</kbd>
+  <kbd class="kbd">y</kbd>
+  <kbd class="kbd">u</kbd>
+  <kbd class="kbd">i</kbd>
+  <kbd class="kbd">o</kbd>
+  <kbd class="kbd">p</kbd>
+</div>
+<div class="my-1 flex w-full justify-center gap-1">
+  <kbd class="kbd">a</kbd>
+  <kbd class="kbd">s</kbd>
+  <kbd class="kbd">d</kbd>
+  <kbd class="kbd">f</kbd>
+  <kbd class="kbd">g</kbd>
+  <kbd class="kbd">h</kbd>
+  <kbd class="kbd">j</kbd>
+  <kbd class="kbd">k</kbd>
+  <kbd class="kbd">l</kbd>
+</div>
+<div class="my-1 flex w-full justify-center gap-1">
+  <kbd class="kbd">z</kbd>
+  <kbd class="kbd">x</kbd>
+  <kbd class="kbd">c</kbd>
+  <kbd class="kbd">v</kbd>
+  <kbd class="kbd">b</kbd>
+  <kbd class="kbd">n</kbd>
+  <kbd class="kbd">m</kbd>
+  <kbd class="kbd">/</kbd>
+</div>
+```
+
+### Arrow Keys
+
+```html
+<div class="flex w-full justify-center">
+  <kbd class="kbd">▲</kbd>
+</div>
+<div class="flex w-full justify-center gap-12">
+  <kbd class="kbd">◀︎</kbd>
+  <kbd class="kbd">▶︎</kbd>
+</div>
+<div class="flex w-full justify-center">
+  <kbd class="kbd">▼</kbd>
+</div>
+```
+
+## Features
+
+- Displays keyboard shortcuts and key combinations
+- Multiple size options (xs, sm, md, lg, xl)
+- Works with individual keys or combinations
+- Can be styled to look like physical keyboard keys
+- Responsive design
+
+This component is useful for documenting keyboard shortcuts in applications or guides.