mirror of
https://github.com/we-promise/sure.git
synced 2026-06-06 03:09:02 +00:00
The Google button used Google's prebuilt `gsi-material-button` (its own CSS file + hardcoded hex colors), leaving it the odd one out: capped at 400px (its `max-width` overrode `w-full`) so it sat narrower than the OpenID/GitHub buttons, and rendered as a glaring white block in dark mode with no theming. Render every SSO provider through one `DS::Button(variant: :outline, full_width: true)` so the stack is consistent and reads as secondary to the primary email "Log in" CTA. Google keeps its official multi-color "G" mark and "Sign in with Google" wording (brand-compliant) via a new `google-icon.svg` asset and an additive `icon_custom:` flag on the button (defaults false — no change to any existing button). Delete `google-sign-in.css` and its import.
86 lines
3.2 KiB
Plaintext
86 lines
3.2 KiB
Plaintext
<% if @prefill_demo_credentials %>
|
|
<div class="mb-4 rounded-lg border bg-blue-50 text-blue-700 border-blue-200 theme-dark:bg-blue-900/20 theme-dark:text-blue-400 theme-dark:border-blue-800 p-4" role="status" aria-live="polite">
|
|
<div class="flex items-start gap-3">
|
|
<div class="shrink-0">
|
|
<%= icon "info", size: "sm", color: "blue-600" %>
|
|
</div>
|
|
<div class="flex-1 text-sm">
|
|
<h3 class="font-semibold mb-1">
|
|
<%= t(".demo_banner_title") %>
|
|
</h3>
|
|
<p>
|
|
<%= t(".demo_banner_message") %>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
|
|
<% if AuthConfig.local_login_form_visible? %>
|
|
<%= styled_form_with url: sessions_path, class: "space-y-4", data: { turbo: false } do |form| %>
|
|
<%= form.email_field :email,
|
|
label: t(".email"),
|
|
autofocus: false,
|
|
autocomplete: "email",
|
|
required: "required",
|
|
placeholder: t(".email_placeholder"),
|
|
value: @email %>
|
|
|
|
<%= form.password_field :password,
|
|
label: t(".password"),
|
|
required: "required",
|
|
placeholder: t(".password_placeholder"),
|
|
value: @password %>
|
|
|
|
<%= form.submit t(".submit") %>
|
|
<% end %>
|
|
|
|
<% unless AuthConfig.local_login_enabled? %>
|
|
<p class="mt-2 text-xs text-secondary text-center">
|
|
<%= t(".local_login_admin_only") %>
|
|
</p>
|
|
<% end %>
|
|
|
|
<% if AuthConfig.password_features_enabled? %>
|
|
<div class="mt-6 text-center">
|
|
<%= link_to t(".forgot_password"), new_password_reset_path, class: "font-medium text-sm text-primary hover:underline transition" %>
|
|
</div>
|
|
<% end %>
|
|
<% end %>
|
|
|
|
<% providers = AuthConfig.sso_providers %>
|
|
|
|
<% if providers.any? %>
|
|
<div class="mt-6 space-y-3">
|
|
<% providers.each do |provider| %>
|
|
<% provider_id = provider[:id].to_s %>
|
|
<% provider_name = provider[:name].to_s %>
|
|
<% is_google = provider_id == "google" || provider[:strategy].to_s == "google_oauth2" %>
|
|
<% default_label = is_google ? t(".google_auth_connect") : t(".#{provider_id}", default: provider[:name].to_s.titleize) %>
|
|
|
|
<%#
|
|
SSO buttons use the design-system outline button so they stay consistent
|
|
with each other and read as secondary to the primary email "Log in" CTA.
|
|
Google keeps its official multi-color "G" mark + "Sign in with Google"
|
|
wording (brand-compliant) via the custom-icon asset, so no bespoke CSS.
|
|
%>
|
|
<%= render DS::Button.new(
|
|
href: "/auth/#{provider_name}",
|
|
method: :post,
|
|
variant: :outline,
|
|
size: :md,
|
|
full_width: true,
|
|
icon: is_google ? "google-icon" : provider[:icon].presence,
|
|
icon_custom: is_google,
|
|
text: provider[:label].presence || default_label,
|
|
class: "gap-2",
|
|
form: { data: { turbo: false } }
|
|
) %>
|
|
<% end %>
|
|
</div>
|
|
<% elsif !AuthConfig.local_login_form_visible? %>
|
|
<div class="mt-6 rounded-lg border border-amber-200 bg-amber-50 p-4 text-sm text-amber-800">
|
|
<%= t(".no_auth_methods_enabled") %>
|
|
</div>
|
|
<% end %>
|