plutonium 0.34.1 → 0.35.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (185) hide show
  1. checksums.yaml +4 -4
  2. data/.claude/skills/plutonium/skill.md +53 -0
  3. data/.claude/skills/{assets → plutonium-assets}/SKILL.md +13 -8
  4. data/.claude/skills/{connect-resource → plutonium-connect-resource}/SKILL.md +1 -1
  5. data/.claude/skills/{controller → plutonium-controller}/SKILL.md +27 -13
  6. data/.claude/skills/{create-resource → plutonium-create-resource}/SKILL.md +1 -1
  7. data/.claude/skills/{definition → plutonium-definition}/SKILL.md +10 -10
  8. data/.claude/skills/{definition-actions → plutonium-definition-actions}/SKILL.md +34 -9
  9. data/.claude/skills/{definition-fields → plutonium-definition-fields}/SKILL.md +38 -10
  10. data/.claude/skills/plutonium-definition-query/SKILL.md +356 -0
  11. data/.claude/skills/{forms → plutonium-forms}/SKILL.md +6 -6
  12. data/.claude/skills/{installation → plutonium-installation}/SKILL.md +9 -9
  13. data/.claude/skills/{interaction → plutonium-interaction}/SKILL.md +20 -19
  14. data/.claude/skills/{model → plutonium-model}/SKILL.md +3 -3
  15. data/.claude/skills/{model-features → plutonium-model-features}/SKILL.md +3 -3
  16. data/.claude/skills/{nested-resources → plutonium-nested-resources}/SKILL.md +5 -5
  17. data/.claude/skills/{package → plutonium-package}/SKILL.md +7 -8
  18. data/.claude/skills/{policy → plutonium-policy}/SKILL.md +26 -4
  19. data/.claude/skills/{portal → plutonium-portal}/SKILL.md +33 -31
  20. data/.claude/skills/{resource → plutonium-resource}/SKILL.md +27 -27
  21. data/.claude/skills/{rodauth → plutonium-rodauth}/SKILL.md +5 -5
  22. data/.claude/skills/plutonium-theming/SKILL.md +424 -0
  23. data/.claude/skills/{views → plutonium-views}/SKILL.md +7 -7
  24. data/CHANGELOG.md +52 -0
  25. data/CLAUDE.md +215 -0
  26. data/CONTRIBUTING.md +72 -18
  27. data/README.md +100 -19
  28. data/app/assets/plutonium.css +1 -11
  29. data/app/assets/plutonium.js +1685 -1146
  30. data/app/assets/plutonium.js.map +4 -4
  31. data/app/assets/plutonium.min.js +70 -70
  32. data/app/assets/plutonium.min.js.map +4 -4
  33. data/app/views/resource/interactive_bulk_action.html.erb +1 -5
  34. data/app/views/rodauth/_email_auth_request_form.html.erb +1 -1
  35. data/app/views/rodauth/_login_form.html.erb +15 -55
  36. data/app/views/rodauth/_login_form_footer.html.erb +2 -2
  37. data/app/views/rodauth/_password_visibility.html.erb +2 -8
  38. data/app/views/rodauth/add_recovery_codes.html.erb +2 -2
  39. data/app/views/rodauth/change_login.html.erb +36 -19
  40. data/app/views/rodauth/change_password.html.erb +34 -10
  41. data/app/views/rodauth/close_account.html.erb +12 -4
  42. data/app/views/rodauth/confirm_password.html.erb +19 -17
  43. data/app/views/rodauth/create_account.html.erb +30 -109
  44. data/app/views/rodauth/email_auth.html.erb +1 -1
  45. data/app/views/rodauth/logout.html.erb +4 -4
  46. data/app/views/rodauth/otp_auth.html.erb +13 -4
  47. data/app/views/rodauth/otp_disable.html.erb +12 -4
  48. data/app/views/rodauth/otp_setup.html.erb +29 -12
  49. data/app/views/rodauth/otp_unlock.html.erb +19 -10
  50. data/app/views/rodauth/otp_unlock_not_available.html.erb +7 -7
  51. data/app/views/rodauth/recovery_auth.html.erb +12 -4
  52. data/app/views/rodauth/recovery_codes.html.erb +12 -4
  53. data/app/views/rodauth/remember.html.erb +7 -7
  54. data/app/views/rodauth/reset_password.html.erb +23 -7
  55. data/app/views/rodauth/reset_password_request.html.erb +14 -10
  56. data/app/views/rodauth/sms_auth.html.erb +13 -4
  57. data/app/views/rodauth/sms_confirm.html.erb +13 -4
  58. data/app/views/rodauth/sms_disable.html.erb +12 -4
  59. data/app/views/rodauth/sms_request.html.erb +1 -1
  60. data/app/views/rodauth/sms_setup.html.erb +23 -7
  61. data/app/views/rodauth/two_factor_auth.html.erb +2 -2
  62. data/app/views/rodauth/two_factor_disable.html.erb +12 -4
  63. data/app/views/rodauth/two_factor_manage.html.erb +7 -7
  64. data/app/views/rodauth/unlock_account.html.erb +13 -5
  65. data/app/views/rodauth/unlock_account_request.html.erb +2 -2
  66. data/app/views/rodauth/verify_account.html.erb +25 -7
  67. data/app/views/rodauth/verify_account_resend.html.erb +14 -10
  68. data/app/views/rodauth/verify_login_change.html.erb +1 -1
  69. data/app/views/rodauth/webauthn_auth.html.erb +1 -1
  70. data/app/views/rodauth/webauthn_remove.html.erb +18 -8
  71. data/app/views/rodauth/webauthn_setup.html.erb +12 -4
  72. data/docs/.vitepress/config.ts +15 -26
  73. data/docs/.vitepress/theme/custom.css +388 -29
  74. data/docs/getting-started/index.md +1 -1
  75. data/docs/getting-started/tutorial/02-first-resource.md +9 -0
  76. data/docs/getting-started/tutorial/06-nested-resources.md +2 -2
  77. data/docs/getting-started/tutorial/07-author-portal.md +191 -0
  78. data/docs/getting-started/tutorial/{07-customizing-ui.md → 08-customizing-ui.md} +7 -7
  79. data/docs/getting-started/tutorial/index.md +5 -2
  80. data/docs/guides/authorization.md +33 -0
  81. data/docs/guides/creating-packages.md +12 -16
  82. data/docs/guides/custom-actions.md +36 -0
  83. data/docs/guides/search-filtering.md +121 -42
  84. data/docs/guides/theming.md +232 -36
  85. data/docs/index.md +203 -57
  86. data/docs/public/og-image.png +0 -0
  87. data/docs/reference/controller/index.md +14 -16
  88. data/docs/reference/definition/actions.md +38 -3
  89. data/docs/reference/definition/fields.md +3 -3
  90. data/docs/reference/definition/index.md +2 -2
  91. data/docs/reference/generators/index.md +0 -1
  92. data/docs/reference/interaction/index.md +14 -10
  93. data/docs/reference/model/index.md +0 -1
  94. data/docs/reference/portal/index.md +13 -27
  95. data/gemfiles/rails_7.gemfile.lock +1 -1
  96. data/gemfiles/rails_8.0.gemfile.lock +1 -1
  97. data/gemfiles/rails_8.1.gemfile.lock +1 -1
  98. data/lib/generators/pu/pkg/portal/portal_generator.rb +0 -2
  99. data/lib/generators/pu/pkg/portal/templates/app/views/package/dashboard/index.html.erb +28 -72
  100. data/lib/plutonium/action/interactive.rb +2 -2
  101. data/lib/plutonium/core/controller.rb +2 -1
  102. data/lib/plutonium/definition/actions.rb +2 -2
  103. data/lib/plutonium/lib/deep_freezer.rb +3 -7
  104. data/lib/plutonium/query/filter.rb +14 -0
  105. data/lib/plutonium/query/filters/association.rb +49 -0
  106. data/lib/plutonium/query/filters/boolean.rb +35 -0
  107. data/lib/plutonium/query/filters/date.rb +97 -0
  108. data/lib/plutonium/query/filters/date_range.rb +58 -0
  109. data/lib/plutonium/query/filters/select.rb +55 -0
  110. data/lib/plutonium/resource/controllers/crud_actions.rb +24 -6
  111. data/lib/plutonium/resource/controllers/interactive_actions.rb +76 -58
  112. data/lib/plutonium/resource/controllers/queryable.rb +4 -2
  113. data/lib/plutonium/resource/query_object.rb +1 -1
  114. data/lib/plutonium/ui/action_button.rb +23 -65
  115. data/lib/plutonium/ui/actions_dropdown.rb +103 -0
  116. data/lib/plutonium/ui/block.rb +1 -1
  117. data/lib/plutonium/ui/breadcrumbs.rb +12 -19
  118. data/lib/plutonium/ui/color_mode_selector.rb +1 -1
  119. data/lib/plutonium/ui/component/kit.rb +6 -0
  120. data/lib/plutonium/ui/component_classes.rb +102 -0
  121. data/lib/plutonium/ui/display/base.rb +15 -0
  122. data/lib/plutonium/ui/display/components/attachment.rb +6 -5
  123. data/lib/plutonium/ui/display/components/boolean.rb +23 -0
  124. data/lib/plutonium/ui/display/components/color.rb +23 -0
  125. data/lib/plutonium/ui/display/resource.rb +1 -1
  126. data/lib/plutonium/ui/display/theme.rb +29 -15
  127. data/lib/plutonium/ui/empty_card.rb +3 -3
  128. data/lib/plutonium/ui/form/base.rb +20 -0
  129. data/lib/plutonium/ui/form/components/key_value_store.rb +11 -11
  130. data/lib/plutonium/ui/form/components/resource_select.rb +31 -0
  131. data/lib/plutonium/ui/form/components/secure_association.rb +1 -2
  132. data/lib/plutonium/ui/form/components/uppy.rb +5 -4
  133. data/lib/plutonium/ui/form/concerns/renders_nested_resource_fields.rb +4 -4
  134. data/lib/plutonium/ui/form/interaction.rb +17 -1
  135. data/lib/plutonium/ui/form/query.rb +133 -80
  136. data/lib/plutonium/ui/form/theme.rb +50 -35
  137. data/lib/plutonium/ui/frame_navigator_panel.rb +2 -2
  138. data/lib/plutonium/ui/layout/base.rb +1 -1
  139. data/lib/plutonium/ui/layout/header.rb +4 -7
  140. data/lib/plutonium/ui/layout/rodauth_layout.rb +7 -7
  141. data/lib/plutonium/ui/layout/sidebar.rb +1 -1
  142. data/lib/plutonium/ui/nav_grid_menu.rb +7 -6
  143. data/lib/plutonium/ui/nav_user.rb +9 -8
  144. data/lib/plutonium/ui/page/interactive_action.rb +5 -5
  145. data/lib/plutonium/ui/page_header.rb +29 -10
  146. data/lib/plutonium/ui/panel.rb +4 -4
  147. data/lib/plutonium/ui/sidebar_menu.rb +8 -8
  148. data/lib/plutonium/ui/skeleton_table.rb +7 -8
  149. data/lib/plutonium/ui/tab_list.rb +5 -5
  150. data/lib/plutonium/ui/table/base.rb +3 -0
  151. data/lib/plutonium/ui/table/components/attachment.rb +4 -3
  152. data/lib/plutonium/ui/table/components/bulk_actions_toolbar.rb +82 -0
  153. data/lib/plutonium/ui/table/components/pagy_info.rb +2 -2
  154. data/lib/plutonium/ui/table/components/pagy_pagination.rb +13 -8
  155. data/lib/plutonium/ui/table/components/row_actions_dropdown.rb +101 -0
  156. data/lib/plutonium/ui/table/components/scopes_bar.rb +2 -2
  157. data/lib/plutonium/ui/table/components/selection_column.rb +100 -0
  158. data/lib/plutonium/ui/table/display_theme.rb +6 -6
  159. data/lib/plutonium/ui/table/resource.rb +93 -52
  160. data/lib/plutonium/ui/table/theme.rb +28 -15
  161. data/lib/plutonium/version.rb +1 -1
  162. data/package.json +2 -2
  163. data/plutonium.gemspec +5 -4
  164. data/src/css/components.css +471 -0
  165. data/src/css/intl_tel_input.css +2 -2
  166. data/src/css/plutonium.css +2 -0
  167. data/src/css/tokens.css +149 -0
  168. data/src/js/controllers/bulk_actions_controller.js +109 -0
  169. data/src/js/controllers/filter_panel_controller.js +35 -0
  170. data/src/js/controllers/register_controllers.js +5 -1
  171. data/src/js/controllers/resource_drop_down_controller.js +25 -1
  172. data/src/js/controllers/slim_select_controller.js +6 -2
  173. data/src/js/turbo/turbo_actions.js +1 -1
  174. metadata +52 -39
  175. data/.claude/skills/definition-query/SKILL.md +0 -334
  176. data/docs/concepts/architecture.md +0 -226
  177. data/docs/concepts/auto-detection.md +0 -254
  178. data/docs/concepts/index.md +0 -61
  179. data/docs/concepts/packages-portals.md +0 -304
  180. data/docs/concepts/resources.md +0 -224
  181. data/docs/cookbook/blog.md +0 -411
  182. data/docs/cookbook/index.md +0 -289
  183. data/docs/cookbook/saas.md +0 -481
  184. data/docs/public/CLAUDE.md +0 -578
  185. data/lib/generators/pu/pkg/portal/templates/app/controllers/resource_controller.rb.tt +0 -5
@@ -1,5 +1 @@
1
- <%= render_component :breadcrumbs, resource_class:, parent: current_parent, resource: resource_record! %>
2
-
3
- <%= render_component :dyna_frame_content do %>
4
- <%= render "interactive_action_form", interactive_action: current_interactive_action %>
5
- <% end %>
1
+ <%= render current_definition.interactive_action_page_class.new %>
@@ -1,5 +1,5 @@
1
1
  <%= form_with url: rodauth.email_auth_request_path, method: :post, data: { turbo: false }, class: "space-y-4" do |form| %>
2
2
  <%= form.hidden_field rodauth.login_param, value: params[rodauth.login_param] %>
3
3
 
4
- <%= form.submit rodauth.email_auth_request_button, class: "w-full text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none focus:ring-primary-300 font-semibold rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800" %>
4
+ <%= form.submit rodauth.email_auth_request_button, class: "w-full pu-btn pu-btn-md pu-btn-primary" %>
5
5
  <% end %>
@@ -1,9 +1,4 @@
1
- <h1
2
- class="
3
- text-lg font-bold leading-tight tracking-tight text-gray-900 md:text-xl
4
- dark:text-white
5
- "
6
- >
1
+ <h1 class="text-lg font-bold leading-tight tracking-tight text-[var(--pu-text)] md:text-xl">
7
2
  Sign in to your account
8
3
  </h1>
9
4
  <%= form_with url: rodauth.login_path,
@@ -11,72 +6,37 @@
11
6
  data: { turbo: false, controller: "password-visibility" },
12
7
  class: "space-y-4" do |form| %>
13
8
  <div>
14
- <%= form.label "login",
15
- rodauth.login_label,
16
- class:
17
- "block mb-2 text-sm font-semibold text-gray-900 dark:text-white" %>
9
+ <%= form.label "login", rodauth.login_label, class: "pu-label" %>
18
10
  <%= form.email_field rodauth.login_param,
19
11
  value: params[rodauth.login_param],
20
12
  id: "login",
21
13
  autocomplete: rodauth.login_field_autocomplete_value,
22
14
  required: true,
23
15
  placeholder: "jane@acme.inc",
24
- class:
25
- "bg-gray-50 border border-gray-300 text-gray-900 rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 #{rodauth.field_error(rodauth.login_param) ? "border-red-600 focus:ring-red-600 focus:border-red-600 dark:border-red-400 dark:focus:ring-red-400" : "border-gray-300 dark:border-gray-700 dark:focus:border-emerald-400 dark:focus:ring-emerald-400"}",
26
- aria:
27
- (
28
- if rodauth.field_error(rodauth.login_param)
29
- { invalid: true, describedby: "login_error_message" }
30
- end
31
- ) %>
16
+ class: "pu-input #{rodauth.field_error(rodauth.login_param) ? 'pu-input-invalid' : ''}",
17
+ aria: (rodauth.field_error(rodauth.login_param) ? { invalid: true, describedby: "login_error_message" } : nil) %>
32
18
  <% unless rodauth.skip_login_field_on_login? %>
33
- <%= if rodauth.field_error(rodauth.login_param)
34
- content_tag(
35
- :span,
36
- rodauth.field_error(rodauth.login_param),
37
- class: "block mt-1 text-red-600 text-sm dark:text-red-400",
38
- id: "login_error_message",
39
- )
40
- end %>
19
+ <% if rodauth.field_error(rodauth.login_param) %>
20
+ <span class="pu-error" id="login_error_message"><%= rodauth.field_error(rodauth.login_param) %></span>
21
+ <% end %>
41
22
  <% end %>
42
23
  </div>
43
24
  <% unless rodauth.skip_password_field_on_login? %>
44
25
  <div>
45
- <%= form.label "password",
46
- rodauth.password_label,
47
- class:
48
- "block mb-2 text-sm font-semibold text-gray-900 dark:text-white" %>
26
+ <%= form.label "password", rodauth.password_label, class: "pu-label" %>
49
27
  <%= form.password_field rodauth.password_param,
50
- data: {
51
- password_visibility_target: "password",
52
- },
28
+ data: { password_visibility_target: "password" },
53
29
  value: "",
54
30
  id: "password",
55
31
  autocomplete: rodauth.password_field_autocomplete_value,
56
32
  required: true,
57
- class:
58
- "bg-gray-50 border border-gray-300 text-gray-900 rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 #{rodauth.field_error(rodauth.password_param) ? "border-red-600 focus:ring-red-600 focus:border-red-600 dark:border-red-400 dark:focus:ring-red-400" : "border-gray-300 dark:border-gray-700 dark:focus:border-emerald-400 dark:focus:ring-emerald-400"}",
59
- aria:
60
- (
61
- if rodauth.field_error(rodauth.password_param)
62
- {
63
- invalid: true,
64
- describedby: "password_error_message",
65
- }
66
- end
67
- ) %>
68
- <%= if rodauth.field_error(rodauth.password_param)
69
- content_tag(
70
- :span,
71
- rodauth.field_error(rodauth.password_param),
72
- class: "block mt-1 text-red-600 text-sm dark:text-red-400",
73
- id: "password_error_message",
74
- )
75
- end %>
33
+ class: "pu-input #{rodauth.field_error(rodauth.password_param) ? 'pu-input-invalid' : ''}",
34
+ aria: (rodauth.field_error(rodauth.password_param) ? { invalid: true, describedby: "password_error_message" } : nil) %>
35
+ <% if rodauth.field_error(rodauth.password_param) %>
36
+ <span class="pu-error" id="password_error_message"><%= rodauth.field_error(rodauth.password_param) %></span>
37
+ <% end %>
76
38
  </div>
77
39
  <%= render "password_visibility" %>
78
40
  <% end %>
79
- <%= form.submit rodauth.login_button,
80
- class:
81
- "w-full text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none focus:ring-primary-300 font-semibold rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800" %>
41
+ <%= form.submit rodauth.login_button, class: "w-full pu-btn pu-btn-md pu-btn-primary" %>
82
42
  <% end %>
@@ -1,7 +1,7 @@
1
1
  <% unless rodauth.login_form_footer_links.empty? %>
2
- <ul>
2
+ <ul class="space-y-1">
3
3
  <% rodauth.login_form_footer_links.sort.each do |_, link, text| %>
4
- <li><%= link_to text, link, class: "text-primary-600 rounded-sm text-sm hover:underline hover:text-primary-800 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-600 dark:text-primary-300 dark:hover:text-primary-400 dark:focus-visible:ring-2 dark:focus-visible:ring-primary-300" %></li>
4
+ <li><%= link_to text, link, class: "text-sm font-medium text-secondary-600 dark:text-secondary-400 hover:underline transition-colors" %></li>
5
5
  <% end %>
6
6
  </ul>
7
7
  <% end %>
@@ -3,17 +3,11 @@
3
3
  type="checkbox"
4
4
  name="reveal-password"
5
5
  id="reveal-password"
6
- class="
7
- text-primary-500 rounded transition-colors duration-200 checked:bg-primary-500
8
- hover:bg-primary-200 focus:ring-primary-500
9
- "
6
+ class="pu-checkbox"
10
7
  data-password-visibility-target="checkbox"
11
8
  data-action="password-visibility#toggle"
12
9
  >
13
- <label
14
- for="reveal-password"
15
- class="block text-sm font-semibold text-gray-900 dark:text-white"
16
- >
10
+ <label for="reveal-password" class="text-sm font-medium text-[var(--pu-text)]">
17
11
  Show Password
18
12
  </label>
19
13
  </div>
@@ -1,7 +1,7 @@
1
1
  <div>
2
- <h4 class="text-2xl font-bold dark:text-white mb-4">Recovery Codes</h4>
2
+ <h4 class="text-2xl font-bold text-[var(--pu-text)] mb-4">Recovery Codes</h4>
3
3
 
4
- <div class="mb-4 text-sm grid grid-cols-1 gap-y-2 gap-x-4 dark:bg-gray-900 dark:text-gray-200">
4
+ <div class="mb-4 text-sm grid grid-cols-1 gap-y-2 gap-x-4 text-[var(--pu-text-muted)]">
5
5
  <% if rodauth.recovery_codes.any? %>
6
6
  <% rodauth.recovery_codes.each do |code| %>
7
7
  <div class="font-mono"><%= code %></div>
@@ -1,34 +1,51 @@
1
1
  <%= form_with url: rodauth.change_login_path, method: :post, data: { turbo: false }, class: "space-y-4" do |form| %>
2
2
  <div>
3
- <%= form.label "login", rodauth.login_label, class: "block mb-2 text-sm font-semibold text-gray-900 dark:text-white" %>
4
- <%= form.email_field rodauth.login_param, value: params[rodauth.login_param],
5
- id: "login",
6
- autocomplete: "email",
7
- required: true,
8
- placeholder: "jane@acme.inc",
9
- class: "bg-gray-50 border border-gray-300 text-gray-900 rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 #{rodauth.field_error(rodauth.login_param) ? "border-red-600 focus:ring-red-600 focus:border-red-600 dark:border-red-400 dark:focus:ring-red-400" : "border-gray-300 dark:border-gray-700 dark:focus:border-emerald-400 dark:focus:ring-emerald-400" }", aria: ({ invalid: true, describedby: "login_error_message" } if rodauth.field_error(rodauth.login_param)) %>
10
- <%= content_tag(:span, rodauth.field_error(rodauth.login_param), class: "block mt-1 text-red-600 text-xs dark:text-red-400", id: "login_error_message") if rodauth.field_error(rodauth.login_param) %>
3
+ <%= form.label "login", rodauth.login_label, class: "pu-label" %>
4
+ <%= form.email_field rodauth.login_param,
5
+ value: params[rodauth.login_param],
6
+ id: "login",
7
+ autocomplete: "email",
8
+ required: true,
9
+ placeholder: "jane@acme.inc",
10
+ class: "pu-input #{rodauth.field_error(rodauth.login_param) ? 'pu-input-invalid' : ''}",
11
+ aria: (rodauth.field_error(rodauth.login_param) ? { invalid: true, describedby: "login_error_message" } : nil) %>
12
+ <% if rodauth.field_error(rodauth.login_param) %>
13
+ <span class="pu-error" id="login_error_message"><%= rodauth.field_error(rodauth.login_param) %></span>
14
+ <% end %>
11
15
  </div>
12
16
 
13
17
  <% if rodauth.require_login_confirmation? %>
14
18
  <div>
15
- <%= form.label "login-confirm", rodauth.login_confirm_label, class: "block mb-2 text-sm font-semibold text-gray-900 dark:text-white" %>
16
- <%= form.email_field rodauth.login_confirm_param, value: params[rodauth.login_confirm_param],
17
- id: "login-confirm", autocomplete: "email",
18
- required: true,
19
- placeholder: "jane@acme.inc",
20
- class: "bg-gray-50 border border-gray-300 text-gray-900 rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 #{rodauth.field_error(rodauth.login_confirm_param) ? "border-red-600 focus:ring-red-600 focus:border-red-600 dark:border-red-400 dark:focus:ring-red-400" : "border-gray-300 dark:border-gray-700 dark:focus:border-emerald-400 dark:focus:ring-emerald-400" }", aria: ({ invalid: true, describedby: "login-confirm_error_message" } if rodauth.field_error(rodauth.login_confirm_param)) %>
21
- <%= content_tag(:span, rodauth.field_error(rodauth.login_confirm_param), class: "block mt-1 text-red-600 text-xs dark:text-red-400", id: "login-confirm_error_message") if rodauth.field_error(rodauth.login_confirm_param) %>
19
+ <%= form.label "login-confirm", rodauth.login_confirm_label, class: "pu-label" %>
20
+ <%= form.email_field rodauth.login_confirm_param,
21
+ value: params[rodauth.login_confirm_param],
22
+ id: "login-confirm",
23
+ autocomplete: "email",
24
+ required: true,
25
+ placeholder: "jane@acme.inc",
26
+ class: "pu-input #{rodauth.field_error(rodauth.login_confirm_param) ? 'pu-input-invalid' : ''}",
27
+ aria: (rodauth.field_error(rodauth.login_confirm_param) ? { invalid: true, describedby: "login-confirm_error_message" } : nil) %>
28
+ <% if rodauth.field_error(rodauth.login_confirm_param) %>
29
+ <span class="pu-error" id="login-confirm_error_message"><%= rodauth.field_error(rodauth.login_confirm_param) %></span>
30
+ <% end %>
22
31
  </div>
23
32
  <% end %>
24
33
 
25
34
  <% if rodauth.change_login_requires_password? %>
26
35
  <div>
27
- <%= form.label "password", rodauth.password_label, class: "block mb-2 text-sm font-semibold text-gray-900 dark:text-white" %>
28
- <%= form.password_field rodauth.password_param, value: "", id: "password", autocomplete: rodauth.password_field_autocomplete_value, required: true, class: "bg-gray-50 border border-gray-300 text-gray-900 rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 #{rodauth.field_error(rodauth.password_param) ? "border-red-600 focus:ring-red-600 focus:border-red-600 dark:border-red-400 dark:focus:ring-red-400" : "border-gray-300 dark:border-gray-700 dark:focus:border-emerald-400 dark:focus:ring-emerald-400" }", aria: ({ invalid: true, describedby: "password_error_message" } if rodauth.field_error(rodauth.password_param)) %>
29
- <%= content_tag(:span, rodauth.field_error(rodauth.password_param), class: "block mt-1 text-red-600 text-xs dark:text-red-400", id: "password_error_message") if rodauth.field_error(rodauth.password_param) %>
36
+ <%= form.label "password", rodauth.password_label, class: "pu-label" %>
37
+ <%= form.password_field rodauth.password_param,
38
+ value: "",
39
+ id: "password",
40
+ autocomplete: rodauth.password_field_autocomplete_value,
41
+ required: true,
42
+ class: "pu-input #{rodauth.field_error(rodauth.password_param) ? 'pu-input-invalid' : ''}",
43
+ aria: (rodauth.field_error(rodauth.password_param) ? { invalid: true, describedby: "password_error_message" } : nil) %>
44
+ <% if rodauth.field_error(rodauth.password_param) %>
45
+ <span class="pu-error" id="password_error_message"><%= rodauth.field_error(rodauth.password_param) %></span>
46
+ <% end %>
30
47
  </div>
31
48
  <% end %>
32
49
 
33
- <%= form.submit rodauth.change_login_button, class: "w-full text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none focus:ring-primary-300 font-semibold rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800" %>
50
+ <%= form.submit rodauth.change_login_button, class: "w-full pu-btn pu-btn-md pu-btn-primary" %>
34
51
  <% end %>
@@ -1,25 +1,49 @@
1
1
  <%= form_with url: rodauth.change_password_path, method: :post, data: { turbo: false }, class: "space-y-4" do |form| %>
2
2
  <% if rodauth.change_password_requires_password? %>
3
3
  <div>
4
- <%= form.label "password", rodauth.password_label, class: "block mb-2 text-sm font-semibold text-gray-900 dark:text-white" %>
5
- <%= form.password_field rodauth.password_param, value: "", id: "password", autocomplete: rodauth.password_field_autocomplete_value, required: true, class: "bg-gray-50 border border-gray-300 text-gray-900 rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 #{rodauth.field_error(rodauth.password_param) ? "border-red-600 focus:ring-red-600 focus:border-red-600 dark:border-red-400 dark:focus:ring-red-400" : "border-gray-300 dark:border-gray-700 dark:focus:border-emerald-400 dark:focus:ring-emerald-400" }", aria: ({ invalid: true, describedby: "password_error_message" } if rodauth.field_error(rodauth.password_param)) %>
6
- <%= content_tag(:span, rodauth.field_error(rodauth.password_param), class: "block mt-1 text-red-600 text-xs dark:text-red-400", id: "password_error_message") if rodauth.field_error(rodauth.password_param) %>
4
+ <%= form.label "password", rodauth.password_label, class: "pu-label" %>
5
+ <%= form.password_field rodauth.password_param,
6
+ value: "",
7
+ id: "password",
8
+ autocomplete: rodauth.password_field_autocomplete_value,
9
+ required: true,
10
+ class: "pu-input #{rodauth.field_error(rodauth.password_param) ? 'pu-input-invalid' : ''}",
11
+ aria: (rodauth.field_error(rodauth.password_param) ? { invalid: true, describedby: "password_error_message" } : nil) %>
12
+ <% if rodauth.field_error(rodauth.password_param) %>
13
+ <span class="pu-error" id="password_error_message"><%= rodauth.field_error(rodauth.password_param) %></span>
14
+ <% end %>
7
15
  </div>
8
16
  <% end %>
9
17
 
10
18
  <div>
11
- <%= form.label "new-password", rodauth.new_password_label, class: "block mb-2 text-sm font-semibold text-gray-900 dark:text-white" %>
12
- <%= form.password_field rodauth.new_password_param, value: "", id: "new-password", autocomplete: "new-password", required: true, class: "bg-gray-50 border border-gray-300 text-gray-900 rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 #{rodauth.field_error(rodauth.new_password_param) ? "border-red-600 focus:ring-red-600 focus:border-red-600 dark:border-red-400 dark:focus:ring-red-400" : "border-gray-300 dark:border-gray-700 dark:focus:border-emerald-400 dark:focus:ring-emerald-400" }", aria: ({ invalid: true, describedby: "new-password_error_message" } if rodauth.field_error(rodauth.new_password_param)) %>
13
- <%= content_tag(:span, rodauth.field_error(rodauth.new_password_param), class: "block mt-1 text-red-600 text-xs dark:text-red-400", id: "new-password_error_message") if rodauth.field_error(rodauth.new_password_param) %>
19
+ <%= form.label "new-password", rodauth.new_password_label, class: "pu-label" %>
20
+ <%= form.password_field rodauth.new_password_param,
21
+ value: "",
22
+ id: "new-password",
23
+ autocomplete: "new-password",
24
+ required: true,
25
+ class: "pu-input #{rodauth.field_error(rodauth.new_password_param) ? 'pu-input-invalid' : ''}",
26
+ aria: (rodauth.field_error(rodauth.new_password_param) ? { invalid: true, describedby: "new-password_error_message" } : nil) %>
27
+ <% if rodauth.field_error(rodauth.new_password_param) %>
28
+ <span class="pu-error" id="new-password_error_message"><%= rodauth.field_error(rodauth.new_password_param) %></span>
29
+ <% end %>
14
30
  </div>
15
31
 
16
32
  <% if rodauth.require_password_confirmation? %>
17
33
  <div>
18
- <%= form.label "password-confirm", rodauth.password_confirm_label, class: "block mb-2 text-sm font-semibold text-gray-900 dark:text-white" %>
19
- <%= form.password_field rodauth.password_confirm_param, value: "", id: "password-confirm", autocomplete: "new-password", required: true, class: "bg-gray-50 border border-gray-300 text-gray-900 rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 #{rodauth.field_error(rodauth.password_confirm_param) ? "border-red-600 focus:ring-red-600 focus:border-red-600 dark:border-red-400 dark:focus:ring-red-400" : "border-gray-300 dark:border-gray-700 dark:focus:border-emerald-400 dark:focus:ring-emerald-400" }", aria: ({ invalid: true, describedby: "password-confirm_error_message" } if rodauth.field_error(rodauth.password_confirm_param)) %>
20
- <%= content_tag(:span, rodauth.field_error(rodauth.password_confirm_param), class: "block mt-1 text-red-600 text-xs dark:text-red-400", id: "password-confirm_error_message") if rodauth.field_error(rodauth.password_confirm_param) %>
34
+ <%= form.label "password-confirm", rodauth.password_confirm_label, class: "pu-label" %>
35
+ <%= form.password_field rodauth.password_confirm_param,
36
+ value: "",
37
+ id: "password-confirm",
38
+ autocomplete: "new-password",
39
+ required: true,
40
+ class: "pu-input #{rodauth.field_error(rodauth.password_confirm_param) ? 'pu-input-invalid' : ''}",
41
+ aria: (rodauth.field_error(rodauth.password_confirm_param) ? { invalid: true, describedby: "password-confirm_error_message" } : nil) %>
42
+ <% if rodauth.field_error(rodauth.password_confirm_param) %>
43
+ <span class="pu-error" id="password-confirm_error_message"><%= rodauth.field_error(rodauth.password_confirm_param) %></span>
44
+ <% end %>
21
45
  </div>
22
46
  <% end %>
23
47
 
24
- <%= form.submit rodauth.change_password_button, class: "w-full text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none focus:ring-primary-300 font-semibold rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800" %>
48
+ <%= form.submit rodauth.change_password_button, class: "w-full pu-btn pu-btn-md pu-btn-primary" %>
25
49
  <% end %>
@@ -1,11 +1,19 @@
1
1
  <%= form_with url: rodauth.close_account_path, method: :post, data: { turbo: false }, class: "space-y-4" do |form| %>
2
2
  <% if rodauth.close_account_requires_password? %>
3
3
  <div>
4
- <%= form.label "password", rodauth.password_label, class: "block mb-2 text-sm font-semibold text-gray-900 dark:text-white" %>
5
- <%= form.password_field rodauth.password_param, value: "", id: "password", autocomplete: rodauth.password_field_autocomplete_value, required: true, class: "bg-gray-50 border border-gray-300 text-gray-900 rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 #{rodauth.field_error(rodauth.password_param) ? "border-red-600 focus:ring-red-600 focus:border-red-600 dark:border-red-400 dark:focus:ring-red-400" : "border-gray-300 dark:border-gray-700 dark:focus:border-emerald-400 dark:focus:ring-emerald-400" }", aria: ({ invalid: true, describedby: "password_error_message" } if rodauth.field_error(rodauth.password_param)) %>
6
- <%= content_tag(:span, rodauth.field_error(rodauth.password_param), class: "block mt-1 text-red-600 text-xs dark:text-red-400", id: "password_error_message") if rodauth.field_error(rodauth.password_param) %>
4
+ <%= form.label "password", rodauth.password_label, class: "pu-label" %>
5
+ <%= form.password_field rodauth.password_param,
6
+ value: "",
7
+ id: "password",
8
+ autocomplete: rodauth.password_field_autocomplete_value,
9
+ required: true,
10
+ class: "pu-input #{rodauth.field_error(rodauth.password_param) ? 'pu-input-invalid' : ''}",
11
+ aria: (rodauth.field_error(rodauth.password_param) ? { invalid: true, describedby: "password_error_message" } : nil) %>
12
+ <% if rodauth.field_error(rodauth.password_param) %>
13
+ <span class="pu-error" id="password_error_message"><%= rodauth.field_error(rodauth.password_param) %></span>
14
+ <% end %>
7
15
  </div>
8
16
  <% end %>
9
17
 
10
- <%= form.submit rodauth.close_account_button, class: "w-full px-8 py-3 cursor-pointer font-semibold text-sm rounded-md text-white bg-red-600 hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-600 dark:bg-red-400 dark:hover:bg-red-500 dark:text-gray-900 dark:focus:ring-red-400 dark:focus:ring-offset-current" %>
18
+ <%= form.submit rodauth.close_account_button, class: "w-full pu-btn pu-btn-md pu-btn-danger" %>
11
19
  <% end %>
@@ -1,19 +1,21 @@
1
- <%= form_with url: rodauth.confirm_password_path, method: :post, data: { turbo: false } do |form| %>
2
- <div class="dark:bg-gray-900 flex items-center justify-center h-screen">
3
- <div class="max-w-sm">
4
- <h2 class="mb-3 text-3xl font-semibold text-center dark:text-gray-100">
5
- <%= rodauth.confirm_password_page_title %>
6
- </h2>
7
- <div class="mx-4">
8
- <div class="py-2">
9
- <%= form.label "password", rodauth.password_label, class: "text-sm text-gray-400" %>
10
- <%= form.password_field rodauth.password_param, value: "", id: "password", autocomplete: rodauth.password_field_autocomplete_value, required: true, class: "w-full px-3 py-2 border rounded-md border-gray-400 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-100 focus:dark:border-emerald-400 focus:dark:bg-gray-700 invalid:border-red-500 invalid:text-red-600 focus:invalid:border-red-500 focus:invalid:ring-red-500 valid:border-green-500 #{"border rounded-md border-red-500" if rodauth.field_error(rodauth.password_param)}", aria: ({ invalid: true, describedby: "password_error_message" } if rodauth.field_error(rodauth.password_param)) %>
11
- <%= content_tag(:span, rodauth.field_error(rodauth.password_param), class: "text-red-800 text-xs mt-1 ml-1", id: "password_error_message") if rodauth.field_error(rodauth.password_param) %>
12
- </div>
13
- </div>
14
- <div class="py-2">
15
- <%= form.submit rodauth.confirm_password_button, class: "w-full px-8 py-2 font-semibold rounded-md w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 dark:bg-emerald-400 dark:text-gray-900" %>
16
- </div>
17
- </div>
1
+ <%= form_with url: rodauth.confirm_password_path, method: :post, data: { turbo: false }, class: "space-y-4" do |form| %>
2
+ <h2 class="text-xl font-semibold text-center text-[var(--pu-text)]">
3
+ <%= rodauth.confirm_password_page_title %>
4
+ </h2>
5
+
6
+ <div>
7
+ <%= form.label "password", rodauth.password_label, class: "pu-label" %>
8
+ <%= form.password_field rodauth.password_param,
9
+ value: "",
10
+ id: "password",
11
+ autocomplete: rodauth.password_field_autocomplete_value,
12
+ required: true,
13
+ class: "pu-input #{rodauth.field_error(rodauth.password_param) ? 'pu-input-invalid' : ''}",
14
+ aria: (rodauth.field_error(rodauth.password_param) ? { invalid: true, describedby: "password_error_message" } : nil) %>
15
+ <% if rodauth.field_error(rodauth.password_param) %>
16
+ <span class="pu-error" id="password_error_message"><%= rodauth.field_error(rodauth.password_param) %></span>
17
+ <% end %>
18
18
  </div>
19
+
20
+ <%= form.submit rodauth.confirm_password_button, class: "w-full pu-btn pu-btn-md pu-btn-primary" %>
19
21
  <% end %>
@@ -1,157 +1,78 @@
1
- <h1
2
- class="
3
- text-lg font-bold leading-tight tracking-tight text-gray-900 md:text-xl
4
- dark:text-white
5
- "
6
- >
1
+ <h1 class="text-lg font-bold leading-tight tracking-tight text-[var(--pu-text)] md:text-xl">
7
2
  Create an account
8
3
  </h1>
9
4
  <%= form_with url: rodauth.create_account_path, method: :post, data: { turbo: false, controller: "password-visibility" }, class: "space-y-4" do |form| %>
10
5
  <div>
11
- <%= form.label "login",
12
- rodauth.login_label,
13
- class:
14
- "block mb-2 text-sm font-semibold text-gray-900 dark:text-white" %>
6
+ <%= form.label "login", rodauth.login_label, class: "pu-label" %>
15
7
  <%= form.email_field rodauth.login_param,
16
8
  value: params[rodauth.login_param],
17
9
  id: "login",
18
10
  autocomplete: "email",
19
11
  required: true,
20
12
  placeholder: "jane@acme.inc",
21
- class:
22
- "bg-gray-50 border border-gray-300 text-gray-900 rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 #{rodauth.field_error(rodauth.login_param) ? "border-red-600 focus:ring-red-600 focus:border-red-600 dark:border-red-400 dark:focus:ring-red-400" : "border-gray-300 dark:border-gray-700 dark:focus:border-emerald-400 dark:focus:ring-emerald-400"}",
23
- aria:
24
- (
25
- if rodauth.field_error(rodauth.login_param)
26
- { invalid: true, describedby: "login_error_message" }
27
- end
28
- ) %>
29
- <%= if rodauth.field_error(rodauth.login_param)
30
- content_tag(
31
- :span,
32
- rodauth.field_error(rodauth.login_param),
33
- class: "block mt-1 text-red-600 text-sm dark:text-red-400",
34
- id: "login_error_message",
35
- )
36
- end %>
13
+ class: "pu-input #{rodauth.field_error(rodauth.login_param) ? 'pu-input-invalid' : ''}",
14
+ aria: (rodauth.field_error(rodauth.login_param) ? { invalid: true, describedby: "login_error_message" } : nil) %>
15
+ <% if rodauth.field_error(rodauth.login_param) %>
16
+ <span class="pu-error" id="login_error_message"><%= rodauth.field_error(rodauth.login_param) %></span>
17
+ <% end %>
37
18
  </div>
38
19
 
39
20
  <% if rodauth.require_login_confirmation? %>
40
21
  <div>
41
- <%= form.label "login-confirm",
42
- rodauth.login_confirm_label,
43
- class:
44
- "block mb-2 text-sm font-semibold text-gray-900 dark:text-white" %>
22
+ <%= form.label "login-confirm", rodauth.login_confirm_label, class: "pu-label" %>
45
23
  <%= form.email_field rodauth.login_confirm_param,
46
24
  value: params[rodauth.login_confirm_param],
47
25
  id: "login-confirm",
48
26
  autocomplete: "email",
49
27
  required: true,
50
28
  placeholder: "jane@acme.inc",
51
- class:
52
- "bg-gray-50 border border-gray-300 text-gray-900 rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 #{rodauth.field_error(rodauth.login_confirm_param) ? "border-red-600 focus:ring-red-600 focus:border-red-600 dark:border-red-400 dark:focus:ring-red-400" : "border-gray-300 dark:border-gray-700 dark:focus:border-emerald-400 dark:focus:ring-emerald-400"}",
53
- aria:
54
- (
55
- if rodauth.field_error(rodauth.login_confirm_param)
56
- {
57
- invalid: true,
58
- describedby: "login-confirm_error_message",
59
- }
60
- end
61
- ) %>
62
- <%= if rodauth.field_error(rodauth.login_confirm_param)
63
- content_tag(
64
- :span,
65
- rodauth.field_error(rodauth.login_confirm_param),
66
- class: "block mt-1 text-red-600 text-sm dark:text-red-400",
67
- id: "login-confirm_error_message",
68
- )
69
- end %>
29
+ class: "pu-input #{rodauth.field_error(rodauth.login_confirm_param) ? 'pu-input-invalid' : ''}",
30
+ aria: (rodauth.field_error(rodauth.login_confirm_param) ? { invalid: true, describedby: "login-confirm_error_message" } : nil) %>
31
+ <% if rodauth.field_error(rodauth.login_confirm_param) %>
32
+ <span class="pu-error" id="login-confirm_error_message"><%= rodauth.field_error(rodauth.login_confirm_param) %></span>
33
+ <% end %>
70
34
  </div>
71
35
  <% end %>
72
36
 
73
37
  <% if rodauth.create_account_set_password? %>
74
38
  <div>
75
- <%= form.label "password",
76
- rodauth.password_label,
77
- class:
78
- "block mb-2 text-sm font-semibold text-gray-900 dark:text-white" %>
39
+ <%= form.label "password", rodauth.password_label, class: "pu-label" %>
79
40
  <%= form.password_field rodauth.password_param,
80
- data: {
81
- password_visibility_target: "password",
82
- },
41
+ data: { password_visibility_target: "password" },
83
42
  value: "",
84
43
  id: "password",
85
44
  autocomplete: rodauth.password_field_autocomplete_value,
86
45
  required: true,
87
- class:
88
- "bg-gray-50 border border-gray-300 text-gray-900 rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 #{rodauth.field_error(rodauth.password_param) ? "border-red-600 focus:ring-red-600 focus:border-red-600 dark:border-red-400 dark:focus:ring-red-400" : "border-gray-300 dark:border-gray-700 dark:focus:border-emerald-400 dark:focus:ring-emerald-400"}",
89
- aria:
90
- (
91
- if rodauth.field_error(rodauth.password_param)
92
- {
93
- invalid: true,
94
- describedby: "password_error_message",
95
- }
96
- end
97
- ) %>
98
- <%= if rodauth.field_error(rodauth.password_param)
99
- content_tag(
100
- :span,
101
- rodauth.field_error(rodauth.password_param),
102
- class: "block mt-1 text-red-600 text-sm dark:text-red-400",
103
- id: "password_error_message",
104
- )
105
- end %>
46
+ class: "pu-input #{rodauth.field_error(rodauth.password_param) ? 'pu-input-invalid' : ''}",
47
+ aria: (rodauth.field_error(rodauth.password_param) ? { invalid: true, describedby: "password_error_message" } : nil) %>
48
+ <% if rodauth.field_error(rodauth.password_param) %>
49
+ <span class="pu-error" id="password_error_message"><%= rodauth.field_error(rodauth.password_param) %></span>
50
+ <% end %>
106
51
  </div>
107
52
 
108
53
  <% if rodauth.require_password_confirmation? %>
109
54
  <div>
110
- <%= form.label "password-confirm",
111
- rodauth.password_confirm_label,
112
- class:
113
- "block mb-2 text-sm font-semibold text-gray-900 dark:text-white" %>
55
+ <%= form.label "password-confirm", rodauth.password_confirm_label, class: "pu-label" %>
114
56
  <%= form.password_field rodauth.password_confirm_param,
115
- data: {
116
- password_visibility_target: "password",
117
- },
57
+ data: { password_visibility_target: "password" },
118
58
  value: "",
119
59
  id: "password-confirm",
120
60
  autocomplete: "new-password",
121
61
  required: true,
122
- class:
123
- "bg-gray-50 border border-gray-300 text-gray-900 rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500 #{rodauth.field_error(rodauth.password_confirm_param) ? "border-red-600 focus:ring-red-600 focus:border-red-600 dark:border-red-400 dark:focus:ring-red-400" : "border-gray-300 dark:border-gray-700 dark:focus:border-emerald-400 dark:focus:ring-emerald-400"}",
124
- aria:
125
- (
126
- if rodauth.field_error(rodauth.password_confirm_param)
127
- {
128
- invalid: true,
129
- describedby: "password-confirm_error_message",
130
- }
131
- end
132
- ) %>
133
- <%= if rodauth.field_error(rodauth.password_confirm_param)
134
- content_tag(
135
- :span,
136
- rodauth.field_error(rodauth.password_confirm_param),
137
- class: "block mt-1 text-red-600 text-sm dark:text-red-400",
138
- id: "password-confirm_error_message",
139
- )
140
- end %>
62
+ class: "pu-input #{rodauth.field_error(rodauth.password_confirm_param) ? 'pu-input-invalid' : ''}",
63
+ aria: (rodauth.field_error(rodauth.password_confirm_param) ? { invalid: true, describedby: "password-confirm_error_message" } : nil) %>
64
+ <% if rodauth.field_error(rodauth.password_confirm_param) %>
65
+ <span class="pu-error" id="password-confirm_error_message"><%= rodauth.field_error(rodauth.password_confirm_param) %></span>
66
+ <% end %>
141
67
  </div>
142
68
  <% end %>
143
69
  <%= render "password_visibility" %>
144
70
  <% end %>
145
71
 
146
- <%= form.submit rodauth.create_account_button,
147
- class:
148
- "w-full text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800" %>
72
+ <%= form.submit rodauth.create_account_button, class: "w-full pu-btn pu-btn-md pu-btn-primary" %>
149
73
  <% end %>
150
74
 
151
- <p class="text-sm font-medium text-gray-500 dark:text-gray-400">
75
+ <p class="text-sm font-medium text-[var(--pu-text-muted)]">
152
76
  Already have an account?
153
- <%= link_to "Login",
154
- rodauth.login_path,
155
- class:
156
- "text-primary-600 rounded-sm text-sm hover:underline hover:text-primary-800 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-600 dark:text-primary-300 dark:hover:text-primary-400 dark:focus-visible:ring-2 dark:focus-visible:ring-primary-300" %>
77
+ <%= link_to "Login", rodauth.login_path, class: "font-medium text-secondary-600 dark:text-secondary-400 hover:underline transition-colors" %>
157
78
  </p>
@@ -1,3 +1,3 @@
1
1
  <%= form_with url: rodauth.email_auth_path, method: :post, data: { turbo: false }, class: "space-y-4" do |form| %>
2
- <%= form.submit rodauth.login_button, class: "w-full text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none focus:ring-primary-300 font-semibold rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800" %>
2
+ <%= form.submit rodauth.login_button, class: "w-full pu-btn pu-btn-md pu-btn-primary" %>
3
3
  <% end %>
@@ -1,13 +1,13 @@
1
- <h1 class="text-lg font-bold leading-tight tracking-tight text-gray-900 md:text-xl dark:text-white">
1
+ <h1 class="text-lg font-bold leading-tight tracking-tight text-[var(--pu-text)] md:text-xl">
2
2
  Log out of your session
3
3
  </h1>
4
4
  <%= form_with url: rodauth.logout_path, method: :post, data: { turbo: false }, class: "space-y-4" do |form| %>
5
5
  <% if rodauth.features.include?(:active_sessions) %>
6
6
  <div class="mb-6 flex items-center space-x-2">
7
- <%= form.check_box rodauth.global_logout_param, id: "global-logout", class: "w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600", include_hidden: false %>
8
- <%= form.label "global-logout", rodauth.global_logout_label, class: "ms-2 text-sm font-medium text-gray-900 dark:text-gray-300" %>
7
+ <%= form.check_box rodauth.global_logout_param, id: "global-logout", class: "pu-checkbox", include_hidden: false %>
8
+ <%= form.label "global-logout", rodauth.global_logout_label, class: "ms-2 text-sm font-medium text-[var(--pu-text)]" %>
9
9
  </div>
10
10
  <% end %>
11
11
 
12
- <%= form.submit rodauth.logout_button, class: "w-full text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800" %>
12
+ <%= form.submit rodauth.logout_button, class: "w-full pu-btn pu-btn-md pu-btn-primary" %>
13
13
  <% end %>