feat(Slideover): preset support (#68)

Co-authored-by: Benjamin Canac <canacb1@gmail.com>

src/runtime/presets/default.ts

@@ -239,6 +239,7 @@ export default (variantColors: string[]) => {
   const modal = {
     base: 'relative inline-block align-bottom text-left overflow-hidden transform transition-all sm:my-8 sm:align-middle w-full',
     background: 'u-bg-white',
+    overlay: 'bg-gray-500/75 dark:bg-gray-600/75',
     border: '',
     ring: '',
     rounded: 'rounded-lg',
@@ -372,6 +373,17 @@ export default (variantColors: string[]) => {
     }
   }
 
+  const slideover = {
+    overlay: 'bg-gray-500/75 dark:bg-gray-600/75',
+    base: 'relative flex-1 flex flex-col w-full focus:outline-none',
+    background: 'u-bg-white',
+    width: 'max-w-md',
+    header: {
+      wrapper: 'border-b u-border-gray-200',
+      base: 'flex items-center justify-between px-4 sm:px-6 h-16'
+    }
+  }
+
   return {
     card,
     modal,
@@ -391,6 +403,7 @@ export default (variantColors: string[]) => {
     dropdown,
     tabs,
     pills,
-    avatar
+    avatar,
+    slideover
   }
 }