cst1/openstreetmap-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add globe on top of login screen, narrow login/signup screens

Browse source
This commit is contained in:
Milan Cvetkovic 2024-03-18 10:14:23 +00:00 • committed by Tom Hughes
parent b66881b45a
commit 64083f0264
5 changed files with 47 additions and 52 deletions
Download patch file Download diff file Expand all files Collapse all files

16
app/assets/stylesheets/common.scss
View file

@ -726,6 +726,7 @@ tr.turn {
&.new-user-main {
background-image: image-url("sign-up-illustration.png");
background-position-x: 50px;
}
&.confirm-main {
@ -735,17 +736,6 @@ tr.turn {
&.new-user-terms {
background-image: image-url("terms-illustration.png");
}
&.new-user-arm {
height: 110px;
width: 130px;
left: 280px;
top: 180px;
background-image: image-url("sign-up-illustration-arm.png");
position: absolute;
z-index: 100;
pointer-events: none;
}
}
[dir=rtl] .header-illustration {
@ -1018,6 +1008,10 @@ div.secondary-actions {
}
}
.auth-container {
max-width: 600px;
}
/* Rules for tabs inside secondary background sections */
.bg-body-secondary .nav-tabs {

8
app/views/sessions/new.html.erb
View file

@ -2,11 +2,15 @@
<%= javascript_include_tag "login" %>
<% end %>
<% content_for :heading_class, "p-0 mw-100" %>
<% content_for :heading do %>
<h1><%= t ".heading" %></h1>
<div class="header-illustration new-user-main auth-container mx-auto">
<h1 class="pt-3"><%= t ".heading" %></h1>
<div>
<% end %>
<div id="login_login">
<div id="login_login" class="auth-container mx-auto my-0">
<p class='text-muted'><%= t ".no account" %> <%= link_to t(".register now"), user_new_path(:referer => params[:referer]) %></p>
<%= bootstrap_form_tag(:action => "login", :html => { :id => "login_form" }) do |f| %>

6
app/views/users/blocked.html.erb
View file

@ -1,11 +1,11 @@
<% content_for :heading_class, "pb-0" %>
<% content_for :heading_class, "p-0 mw-100" %>
<% content_for :heading do %>
<div class='header-illustration new-user-main'>
<div class="header-illustration new-user-main auth-container mx-auto">
<h1><%= t "users.new.title" %></h1>
</div>
<% end %>
<div class="mx-auto my-0">
<div class="auth-container mx-auto my-0">
<p><strong><%= t "users.new.no_auto_account_create" %></strong></p>
<p><%= t "users.new.please_contact_support_html", :support_link => mail_to(Settings.support_email, t("users.new.support")) %></p>
</div>

67
app/views/users/new.html.erb
View file

@ -2,51 +2,48 @@
<%= javascript_include_tag "user" %>
<% end %>
<% content_for :heading_class, "pb-0" %>
<% content_for :heading_class, "p-0 mw-100" %>
<% content_for :heading do %>
<div class='header-illustration new-user-main'>
<h1><%= t ".title" %></h1>
<div class="header-illustration new-user-main auth-container mx-auto">
<h1 class="pt-3"><%= t ".title" %></h1>
</div>
<div class='header-illustration new-user-arm d-none d-md-block'></div>
<% end %>
<div class="row">
<div class='text-muted col-sm order-sm-2'>
<h4><%= t ".about.header" %></h4>
<p><%= t ".about.paragraph_1" %></p>
<div class="auth-container mx-auto my-0">
<div class="text-muted fs-6">
<p><strong><%= t ".about.header" %></strong> <%= t ".about.paragraph_1" %></p>
<p><%= t ".about.paragraph_2" %></p>
</div>
<div class="col-sm">
<%= bootstrap_form_for current_user, :url => { :action => "create" } do |f| %>
<%= hidden_field_tag("referer", h(@referer)) unless @referer.nil? %>
<%= bootstrap_form_for current_user, :url => { :action => "create" } do |f| %>
<%= hidden_field_tag("referer", h(@referer)) unless @referer.nil? %>
<%= f.email_field :email, :tabindex => 1 %>
<%= f.email_field :email_confirmation, :help => t(".email_confirmation_help_html",
:privacy_policy_link => link_to(t(".privacy_policy"),
t(".privacy_policy_url"),
:title => t(".privacy_policy_title"))),
:tabindex => 2 %>
<%= f.email_field :email, :tabindex => 1 %>
<%= f.email_field :email_confirmation, :help => t(".email_confirmation_help_html",
:privacy_policy_link => link_to(t(".privacy_policy"),
t(".privacy_policy_url"),
:title => t(".privacy_policy_title"))),
:tabindex => 2 %>
<%= f.text_field :display_name, :help => t(".display name description"), :tabindex => 3 %>
<%= f.text_field :display_name, :help => t(".display name description"), :tabindex => 3 %>
<fieldset class="mb-3" id="auth_field">
<label for="user_auth_provider" class="form-label"><%= t(".external auth") %></label>
<div class="row">
<%= f.select(:auth_provider, Auth.providers, :default => "", :hide_label => true, :wrapper => { :class => "col-auto mb-0" }, :tabindex => 4) %>
<%= f.text_field(:auth_uid, :hide_label => true, :wrapper => { :class => "col mb-0" }, :tabindex => 5) %>
</div>
<small class="form-text text-muted"><%= t ".auth no password" %></small>
</fieldset>
<%= f.password_field :pass_crypt, :tabindex => 6 %>
<%= f.password_field :pass_crypt_confirmation, :tabindex => 7 %>
<div id="auth_prompt">
<p><%= link_to t(".use external auth"), "#", :id => "auth_enable" %></p>
<fieldset class="mb-3" id="auth_field">
<label for="user_auth_provider" class="form-label"><%= t(".external auth") %></label>
<div class="row">
<%= f.select(:auth_provider, Auth.providers, :default => "", :hide_label => true, :wrapper => { :class => "col-auto mb-0" }, :tabindex => 4) %>
<%= f.text_field(:auth_uid, :hide_label => true, :wrapper => { :class => "col mb-0" }, :tabindex => 5) %>
</div>
<small class="form-text text-muted"><%= t ".auth no password" %></small>
</fieldset>
<%= f.primary t(".continue"), :tabindex => 8 %>
<% end %>
</div>
<%= f.password_field :pass_crypt, :tabindex => 6 %>
<%= f.password_field :pass_crypt_confirmation, :tabindex => 7 %>
<div id="auth_prompt">
<p><%= link_to t(".use external auth"), "#", :id => "auth_enable" %></p>
</div>
<%= f.primary t(".continue"), :tabindex => 8 %>
<% end %>
</div>