@@ -31,23 +31,22 @@ defmodule UneebeeWeb.Components.Button do
31
31
~H"""
32
32
< button
33
33
class = { [
34
- "flex justify -center items -center gap-2" ,
35
- "phx-submit-loading:opacity-75 rounded-lg py-2 px-3 focus:outline-offset-2" ,
34
+ "flex items -center justify -center gap-2" ,
35
+ "rounded-lg px-3 py-2 focus:outline-offset-2 phx-submit-loading:opacity-75 " ,
36
36
"text-sm font-semibold leading-6" ,
37
- "disabled:bg-gray-light2x disabled:cursor-not-allowed disabled:text-gray-light" ,
38
- @ color == :black && "bg-gray-dark shadow-b-gray active:shadow-b-gray-pressed text-white hover:bg-gray-dark2x focus:outline-gray-dark" ,
39
- @ color == :alert &&
40
- "bg-alert text-white shadow-b-alert-dark active:shadow-b-alert-dark-pressed hover:bg-alert-dark focus:outline-alert" ,
41
- @ color == :success && "bg-success text-white shadow-b-success-dark active:shadow-b-success-dark-pressed hover:bg-success-dark focus:outline-success" ,
42
- @ color == :info && "bg-info text-white shadow-b-info-dark active:shadow-b-info-dark-pressed hover:bg-info-dark focus:outline-info" ,
43
- @ color == :warning && "bg-warning text-white shadow-b-warning-dark active:shadow-b-warning-dark-pressed hover:bg-warning-dark focus:outline-warning" ,
44
- @ color == :black_light && "bg-gray-light3x text-gray-dark2x shadow-b-gray-light active:shadow-b-gray-light-pressed hover:bg-gray-light2x focus:outline-gray-light3x" ,
45
- @ color == :alert_light && "bg-alert-light3x text-alert-dark2x shadow-b-alert-light active:shadow-b-alert-light-pressed hover:bg-alert-light2x focus:outline-alert-light3x" ,
46
- @ color == :info_light && "bg-info-light3x text-info-dark2x shadow-b-info-light active:shadow-b-info-light-pressed hover:bg-info-light2x focus:outline-info-light3x" ,
37
+ "disabled:bg-gray-light2x disabled:text-gray-light disabled:cursor-not-allowed" ,
38
+ @ color == :black && "bg-gray-dark shadow-b-gray text-white hover:bg-gray-dark2x focus:outline-gray-dark active:shadow-b-gray-pressed" ,
39
+ @ color == :alert && "bg-alert shadow-b-alert-dark text-white hover:bg-alert-dark focus:outline-alert active:shadow-b-alert-dark-pressed" ,
40
+ @ color == :success && "bg-success shadow-b-success-dark text-white hover:bg-success-dark focus:outline-success active:shadow-b-success-dark-pressed" ,
41
+ @ color == :info && "bg-info shadow-b-info-dark text-white hover:bg-info-dark focus:outline-info active:shadow-b-info-dark-pressed" ,
42
+ @ color == :warning && "bg-warning shadow-b-warning-dark text-white hover:bg-warning-dark focus:outline-warning active:shadow-b-warning-dark-pressed" ,
43
+ @ color == :black_light && "bg-gray-light3x text-gray-dark2x shadow-b-gray-light hover:bg-gray-light2x focus:outline-gray-light3x active:shadow-b-gray-light-pressed" ,
44
+ @ color == :alert_light && "bg-alert-light3x text-alert-dark2x shadow-b-alert-light hover:bg-alert-light2x focus:outline-alert-light3x active:shadow-b-alert-light-pressed" ,
45
+ @ color == :info_light && "bg-info-light3x text-info-dark2x shadow-b-info-light hover:bg-info-light2x focus:outline-info-light3x active:shadow-b-info-light-pressed" ,
47
46
@ color == :success_light &&
48
- "bg-success-light3x text-success-dark2x shadow-b-success-light active:shadow-b-success-light-pressed hover:bg-success-light2x focus:outline-success-light3x" ,
47
+ "bg-success-light3x text-success-dark2x shadow-b-success-light hover:bg-success-light2x focus:outline-success-light3x active:shadow-b-success-light-pressed " ,
49
48
@ color == :warning_light &&
50
- "bg-warning-light3x text-warning-dark2x shadow-b-warning-light active:shadow-b-warning-light-pressed hover:bg-warning-light2x focus:outline-warning-light3x" ,
49
+ "bg-warning-light3x text-warning-dark2x shadow-b-warning-light hover:bg-warning-light2x focus:outline-warning-light3x active:shadow-b-warning-light-pressed " ,
51
50
@ class
52
51
] }
53
52
{ @ rest }
@@ -81,22 +80,21 @@ defmodule UneebeeWeb.Components.Button do
81
80
< button
82
81
class = { [
83
82
"flex items-center justify-center" ,
84
- "phx-submit-loading:opacity-75 rounded-lg py-2 px-3 focus:outline-offset-2" ,
83
+ "rounded-lg px-3 py-2 focus:outline-offset-2 phx-submit-loading:opacity-75 " ,
85
84
"text-sm font-semibold leading-6" ,
86
- "disabled:bg-gray-light2x disabled:cursor-not-allowed disabled:text-gray-light" ,
87
- @ color == :black && "bg-gray-dark shadow-b-gray active:shadow-b-gray-pressed text-white hover:bg-gray-dark2x focus:outline-gray-dark" ,
88
- @ color == :alert &&
89
- "bg-alert text-white shadow-b-alert-dark active:shadow-b-alert-dark-pressed hover:bg-alert-dark focus:outline-alert" ,
90
- @ color == :success && "bg-success text-white shadow-b-success-dark active:shadow-b-success-dark-pressed hover:bg-success-dark focus:outline-success" ,
91
- @ color == :info && "bg-info text-white shadow-b-info-dark active:shadow-b-info-dark-pressed hover:bg-info-dark focus:outline-info" ,
92
- @ color == :warning && "bg-warning text-white shadow-b-warning-dark active:shadow-b-warning-dark-pressed hover:bg-warning-dark focus:outline-warning" ,
93
- @ color == :black_light && "bg-gray-light3x text-gray-dark2x shadow-b-gray-light active:shadow-b-gray-light-pressed hover:bg-gray-light2x focus:outline-gray-light3x" ,
94
- @ color == :alert_light && "bg-alert-light3x text-alert-dark2x shadow-b-alert-light active:shadow-b-alert-light-pressed hover:bg-alert-light2x focus:outline-alert-light3x" ,
95
- @ color == :info_light && "bg-info-light3x text-info-dark2x shadow-b-info-light active:shadow-b-info-light-pressed hover:bg-info-light2x focus:outline-info-light3x" ,
85
+ "disabled:bg-gray-light2x disabled:text-gray-light disabled:cursor-not-allowed" ,
86
+ @ color == :black && "bg-gray-dark shadow-b-gray text-white hover:bg-gray-dark2x focus:outline-gray-dark active:shadow-b-gray-pressed" ,
87
+ @ color == :alert && "bg-alert shadow-b-alert-dark text-white hover:bg-alert-dark focus:outline-alert active:shadow-b-alert-dark-pressed" ,
88
+ @ color == :success && "bg-success shadow-b-success-dark text-white hover:bg-success-dark focus:outline-success active:shadow-b-success-dark-pressed" ,
89
+ @ color == :info && "bg-info shadow-b-info-dark text-white hover:bg-info-dark focus:outline-info active:shadow-b-info-dark-pressed" ,
90
+ @ color == :warning && "bg-warning shadow-b-warning-dark text-white hover:bg-warning-dark focus:outline-warning active:shadow-b-warning-dark-pressed" ,
91
+ @ color == :black_light && "bg-gray-light3x text-gray-dark2x shadow-b-gray-light hover:bg-gray-light2x focus:outline-gray-light3x active:shadow-b-gray-light-pressed" ,
92
+ @ color == :alert_light && "bg-alert-light3x text-alert-dark2x shadow-b-alert-light hover:bg-alert-light2x focus:outline-alert-light3x active:shadow-b-alert-light-pressed" ,
93
+ @ color == :info_light && "bg-info-light3x text-info-dark2x shadow-b-info-light hover:bg-info-light2x focus:outline-info-light3x active:shadow-b-info-light-pressed" ,
96
94
@ color == :success_light &&
97
- "bg-success-light3x text-success-dark2x shadow-b-success-light active:shadow-b-success-light-pressed hover:bg-success-light2x focus:outline-success-light3x" ,
95
+ "bg-success-light3x text-success-dark2x shadow-b-success-light hover:bg-success-light2x focus:outline-success-light3x active:shadow-b-success-light-pressed " ,
98
96
@ color == :warning_light &&
99
- "bg-warning-light3x text-warning-dark2x shadow-b-warning-light active:shadow-b-warning-light-pressed hover:bg-warning-light2x focus:outline-warning-light3x" ,
97
+ "bg-warning-light3x text-warning-dark2x shadow-b-warning-light hover:bg-warning-light2x focus:outline-warning-light3x active:shadow-b-warning-light-pressed " ,
100
98
@ size == :sm && "h-6 w-6" ,
101
99
@ size == :md && "h-8 w-8" ,
102
100
@ size == :lg && "h-10 w-10"
0 commit comments