feat: add gradient(monochrome, duotone), outline colored button. prefix and suffix slots button

docs/guide/button/examples/ButtonPillExample.vue

@@ -0,0 +1,15 @@
+<template>
+  <div class="inline-flex align-center gap-2 flex-wrap">
+    <Button color="default" pill>Default</Button>
+    <Button color="alternative" pill>Alternative</Button>
+    <Button color="dark" pill>Dark</Button>
+    <Button color="light" pill>Light</Button>
+    <Button color="green" pill>Green</Button>
+    <Button color="red" pill>Red</Button>
+    <Button color="yellow" pill>Yellow</Button>
+    <Button color="purple" pill>Purple</Button>
+  </div>
+</template>
+<script setup>
+import { Button } from '../../../../src/index'
+</script>