diff --git a/app/components/flowbite/button.rb b/app/components/flowbite/button.rb index 68c8ff1..0ab2be4 100644 --- a/app/components/flowbite/button.rb +++ b/app/components/flowbite/button.rb @@ -38,25 +38,25 @@ def styles default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base"] }, dark: { - default: ["focus:outline-none", "text-white", "bg-dark", "box-border", "border", "border-transparent", "hover:bg-dark-strong", "focus:ring-4", "focus:ring-neutral-tertiary", "shadow-xs", "font-medium", "leading-5", "rounded-base"] + default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base"] }, default: { - default: ["focus:outline-none", "text-white", "bg-brand", "box-border", "border", "border-transparent", "hover:bg-brand-strong", "focus:ring-4", "focus:ring-brand-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base"] + default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base"] }, ghost: { - default: ["focus:outline-none", "text-heading", "bg-transparent", "box-border", "border", "border-transparent", "hover:bg-neutral-secondary-medium", "focus:ring-4", "focus:ring-neutral-tertiary", "font-medium", "leading-5", "rounded-base"] + default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "font-medium", "leading-5", "rounded-base"] }, secondary: { - default: ["focus:outline-none", "text-body", "bg-neutral-secondary-medium", "box-border", "border", "border-default-medium", "hover:bg-neutral-tertiary-medium", "focus:ring-4", "focus:ring-neutral-tertiary", "shadow-xs", "font-medium", "leading-5", "rounded-base"] + default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base"] }, success: { - default: ["focus:outline-none", "text-white", "bg-success", "box-border", "border", "border-transparent", "hover:bg-success-strong", "focus:ring-4", "focus:ring-success-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base"] + default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base"] }, tertiary: { - default: ["focus:outline-none", "text-body", "bg-neutral-primary-soft", "box-border", "border", "border-default", "hover:bg-neutral-secondary-medium", "focus:ring-4", "focus:ring-neutral-tertiary-soft", "shadow-xs", "font-medium", "leading-5", "rounded-base"] + default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base"] }, warning: { - default: ["focus:outline-none", "text-white", "bg-warning", "box-border", "border", "border-transparent", "hover:bg-warning-strong", "focus:ring-4", "focus:ring-warning-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base"] + default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base"] } }.freeze ) diff --git a/app/components/flowbite/button/outline.rb b/app/components/flowbite/button/outline.rb index 8deea3c..0612011 100644 --- a/app/components/flowbite/button/outline.rb +++ b/app/components/flowbite/button/outline.rb @@ -11,22 +11,22 @@ def styles default: ["focus:outline-none", "text-danger", "bg-transparent", "box-border", "border", "border-danger", "hover:text-white", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base", "text-center", "me-2", "mb-2"] }, dark: { - default: ["focus:outline-none", "text-dark", "bg-transparent", "box-border", "border", "border-dark", "hover:text-white", "hover:bg-dark-strong", "focus:ring-4", "focus:ring-neutral-tertiary", "shadow-xs", "font-medium", "leading-5", "rounded-base", "text-center", "me-2", "mb-2"] + default: ["focus:outline-none", "text-danger", "bg-transparent", "box-border", "border", "border-danger", "hover:text-white", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base", "text-center", "me-2", "mb-2"] }, default: { - default: ["focus:outline-none", "text-brand", "bg-transparent", "box-border", "border", "border-brand", "hover:text-white", "hover:bg-brand-strong", "focus:ring-4", "focus:ring-brand-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base", "text-center", "me-2", "mb-2"] + default: ["focus:outline-none", "text-danger", "bg-transparent", "box-border", "border", "border-danger", "hover:text-white", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base", "text-center", "me-2", "mb-2"] }, secondary: { - default: ["focus:outline-none", "text-body", "bg-transparent", "box-border", "border", "border-default-medium", "hover:bg-neutral-tertiary-medium", "focus:ring-4", "focus:ring-neutral-tertiary", "shadow-xs", "font-medium", "leading-5", "rounded-base", "text-center", "me-2", "mb-2"] + default: ["focus:outline-none", "text-danger", "bg-transparent", "box-border", "border", "border-danger", "hover:text-white", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base", "text-center", "me-2", "mb-2"] }, success: { - default: ["focus:outline-none", "text-success", "bg-transparent", "box-border", "border", "border-success", "hover:text-white", "hover:bg-success-strong", "focus:ring-4", "focus:ring-success-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base", "text-center", "me-2", "mb-2"] + default: ["focus:outline-none", "text-danger", "bg-transparent", "box-border", "border", "border-danger", "hover:text-white", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base", "text-center", "me-2", "mb-2"] }, tertiary: { - default: ["focus:outline-none", "text-body", "bg-transparent", "box-border", "border", "border-default", "hover:bg-neutral-secondary-medium", "focus:ring-4", "focus:ring-neutral-tertiary-soft", "shadow-xs", "font-medium", "leading-5", "rounded-base", "text-center", "me-2", "mb-2"] + default: ["focus:outline-none", "text-danger", "bg-transparent", "box-border", "border", "border-danger", "hover:text-white", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base", "text-center", "me-2", "mb-2"] }, warning: { - default: ["focus:outline-none", "text-warning", "bg-transparent", "box-border", "border", "border-warning", "hover:text-white", "hover:bg-warning-strong", "focus:ring-4", "focus:ring-warning-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base", "text-center", "me-2", "mb-2"] + default: ["focus:outline-none", "text-danger", "bg-transparent", "box-border", "border", "border-danger", "hover:text-white", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-base", "text-center", "me-2", "mb-2"] } }.freeze) end diff --git a/app/components/flowbite/button/pill.rb b/app/components/flowbite/button/pill.rb index c7ea50c..2434d9d 100644 --- a/app/components/flowbite/button/pill.rb +++ b/app/components/flowbite/button/pill.rb @@ -11,25 +11,25 @@ def styles default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-full", "text-center"] }, dark: { - default: ["focus:outline-none", "text-white", "bg-dark", "box-border", "border", "border-transparent", "hover:bg-dark-strong", "focus:ring-4", "focus:ring-neutral-tertiary", "shadow-xs", "font-medium", "leading-5", "rounded-full", "text-center"] + default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-full", "text-center"] }, default: { - default: ["focus:outline-none", "text-white", "bg-brand", "box-border", "border", "border-transparent", "hover:bg-brand-strong", "focus:ring-4", "focus:ring-brand-medium", "shadow-xs", "font-medium", "leading-5", "rounded-full", "text-center"] + default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-full", "text-center"] }, ghost: { - default: ["focus:outline-none", "text-heading", "bg-transparent", "box-border", "border", "border-transparent", "hover:bg-neutral-secondary-medium", "focus:ring-4", "focus:ring-neutral-tertiary", "font-medium", "leading-5", "rounded-full", "text-center"] + default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "font-medium", "leading-5", "rounded-full", "text-center"] }, secondary: { - default: ["focus:outline-none", "text-body", "bg-neutral-secondary-medium", "box-border", "border", "border-default-medium", "hover:bg-neutral-tertiary-medium", "focus:ring-4", "focus:ring-neutral-tertiary", "shadow-xs", "font-medium", "leading-5", "rounded-full", "text-center"] + default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-full", "text-center"] }, success: { - default: ["focus:outline-none", "text-white", "bg-success", "box-border", "border", "border-transparent", "hover:bg-success-strong", "focus:ring-4", "focus:ring-success-medium", "shadow-xs", "font-medium", "leading-5", "rounded-full", "text-center"] + default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-full", "text-center"] }, tertiary: { - default: ["focus:outline-none", "text-body", "bg-neutral-primary-soft", "box-border", "border", "border-default", "hover:bg-neutral-secondary-medium", "focus:ring-4", "focus:ring-neutral-tertiary-soft", "shadow-xs", "font-medium", "leading-5", "rounded-full", "text-center"] + default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-full", "text-center"] }, warning: { - default: ["focus:outline-none", "text-white", "bg-warning", "box-border", "border", "border-transparent", "hover:bg-warning-strong", "focus:ring-4", "focus:ring-warning-medium", "shadow-xs", "font-medium", "leading-5", "rounded-full", "text-center"] + default: ["focus:outline-none", "text-white", "bg-danger", "box-border", "border", "border-transparent", "hover:bg-danger-strong", "focus:ring-4", "focus:ring-danger-medium", "shadow-xs", "font-medium", "leading-5", "rounded-full", "text-center"] } }.freeze) end diff --git a/test/components/flowbite/button_test.rb b/test/components/flowbite/button_test.rb index ac109a7..2da0524 100644 --- a/test/components/flowbite/button_test.rb +++ b/test/components/flowbite/button_test.rb @@ -32,17 +32,17 @@ def test_renders_a_xl_button def test_renders_pill_button_in_secondary_style render_inline(Flowbite::Button::Pill.new(style: :secondary)) { "Click me" } - assert_selector("button.text-body.bg-neutral-secondary-medium") + assert_selector("button.text-white.bg-danger") end def test_renders_pill_button_in_tertiary_style render_inline(Flowbite::Button::Pill.new(style: :tertiary)) { "Click me" } - assert_selector("button.text-body.bg-neutral-primary-soft") + assert_selector("button.text-white.bg-danger") end def test_renders_pill_button_in_success_style render_inline(Flowbite::Button::Pill.new(style: :success)) { "Click me" } - assert_selector("button.text-white.bg-success") + assert_selector("button.text-white.bg-danger") end def test_renders_pill_button_in_danger_style @@ -52,47 +52,47 @@ def test_renders_pill_button_in_danger_style def test_renders_pill_button_in_warning_style render_inline(Flowbite::Button::Pill.new(style: :warning)) { "Click me" } - assert_selector("button.text-white.bg-warning") + assert_selector("button.text-white.bg-danger") end def test_renders_pill_button_in_dark_style render_inline(Flowbite::Button::Pill.new(style: :dark)) { "Click me" } - assert_selector("button.text-white.bg-dark") + assert_selector("button.text-white.bg-danger") end def test_renders_pill_button_in_ghost_style render_inline(Flowbite::Button::Pill.new(style: :ghost)) { "Click me" } - assert_selector("button.text-heading.bg-transparent") + assert_selector("button.text-white.bg-danger") end def test_renders_pill_button_in_default_style render_inline(Flowbite::Button::Pill.new) { "Click me" } - assert_selector("button.text-white.bg-brand") + assert_selector("button.text-white.bg-danger") end def test_renders_pill_button_in_different_sizes render_inline(Flowbite::Button::Pill.new(size: :xs)) { "Click me" } - assert_selector("button.text-white.bg-brand.text-xs") + assert_selector("button.text-white.bg-danger.text-xs") end def test_renders_outline_button_in_default_style render_inline(Flowbite::Button::Outline.new) { "Click me" } - assert_selector("button.text-brand.border-brand") + assert_selector("button.text-danger.border-danger") end def test_renders_outline_button_in_secondary_style render_inline(Flowbite::Button::Outline.new(style: :secondary)) { "Click me" } - assert_selector("button.text-body.border-default-medium") + assert_selector("button.text-danger.border-danger") end def test_renders_outline_button_in_tertiary_style render_inline(Flowbite::Button::Outline.new(style: :tertiary)) { "Click me" } - assert_selector("button.text-body.border-default") + assert_selector("button.text-danger.border-danger") end def test_renders_outline_button_in_success_style render_inline(Flowbite::Button::Outline.new(style: :success)) { "Click me" } - assert_selector("button.text-success.border-success") + assert_selector("button.text-danger.border-danger") end def test_renders_outline_button_in_danger_style @@ -102,17 +102,17 @@ def test_renders_outline_button_in_danger_style def test_renders_outline_button_in_warning_style render_inline(Flowbite::Button::Outline.new(style: :warning)) { "Click me" } - assert_selector("button.text-warning.border-warning") + assert_selector("button.text-danger.border-danger") end def test_renders_outline_button_in_dark_style render_inline(Flowbite::Button::Outline.new(style: :dark)) { "Click me" } - assert_selector("button.text-dark.border-dark") + assert_selector("button.text-danger.border-danger") end def test_renders_outline_button_in_different_sizes render_inline(Flowbite::Button::Outline.new(size: :xs, style: :success)) { "Click me" } - assert_selector("button.text-success.border-success.text-xs") + assert_selector("button.text-danger.border-danger.text-xs") end def test_passes_attributes_to_button_tag @@ -138,6 +138,6 @@ def test_renders_a_submit_button def test_adds_classes_to_the_default_ones render_inline(Flowbite::Button.new(class: "custom-class")) { "Click me" } - assert_selector("button.bg-brand.text-white.custom-class") + assert_selector("button.bg-danger.text-white.custom-class") end end