fix: Button color blue theme (themesberg#1024)

fix: fix Button color blue theme
transkripid · Oct 7, 2023 · 786f695 · 786f695
1 parent 6ac8113
commit 786f695
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/app/docs/components/button/button.mdx b/app/docs/components/button/button.mdx
@@ -24,6 +24,7 @@ Use this example to create a default button by using the `<Button>` component fr
 
 <CodePreview title="Default buttons" className="flex flex-wrap gap-2">
   <Button>Default</Button>
+  <Button color="blue">Blue</Button>
   <Button color="gray">Gray</Button>
   <Button color="dark">Dark</Button>
   <Button color="light">Light</Button>
@@ -38,6 +39,10 @@ Use this example to create a default button by using the `<Button>` component fr
 Add the `pill` property to the `<Button>` component to create a button with rounded corners.
 
 <CodePreview title="Button pills" className="flex flex-wrap gap-2">
+  <Button pill>Default</Button>
+  <Button color="blue" pill>
+    Blue
+  </Button>
   <Button color="gray" pill>
     Gray
   </Button>

diff --git a/src/components/Button/theme.ts b/src/components/Button/theme.ts
@@ -18,7 +18,7 @@ export const buttonTheme: FlowbiteButtonTheme = {
       'text-white bg-green-700 border border-transparent enabled:hover:bg-green-800 focus:ring-4 focus:ring-green-300 dark:bg-green-600 dark:enabled:hover:bg-green-700 dark:focus:ring-green-800',
     warning:
       'text-white bg-yellow-400 border border-transparent enabled:hover:bg-yellow-500 focus:ring-4 focus:ring-yellow-300 dark:focus:ring-yellow-900',
-    blue: 'text-cyan-900 bg-white border border-cyan-300 enabled:hover:bg-cyan-100 focus:ring-4 focus:ring-cyan-300 :bg-cyan-600 dark:text-white dark:border-cyan-600 dark:enabled:hover:bg-cyan-700 dark:enabled:hover:border-cyan-700 dark:focus:ring-cyan-700',
+    blue: 'text-white bg-blue-700 border border-transparent enabled:hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800',
     cyan: 'text-cyan-900 bg-white border border-cyan-300 enabled:hover:bg-cyan-100 focus:ring-4 focus:ring-cyan-300 :bg-cyan-600 dark:text-white dark:border-cyan-600 dark:enabled:hover:bg-cyan-700 dark:enabled:hover:border-cyan-700 dark:focus:ring-cyan-700',
     green:
       'text-green-900 bg-white border border-green-300 enabled:hover:bg-green-100 focus:ring-4 focus:ring-green-300 :bg-green-600 dark:text-white dark:border-green-600 dark:enabled:hover:bg-green-700 dark:enabled:hover:border-green-700 dark:focus:ring-green-700',