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

diff --git a/app/assets/stylesheets/common.scss b/app/assets/stylesheets/common.scss
index c3f71438988c252f5f7ef160ef8ddd513e473f24..a7d07e74e92ed8179f8de323e427785a25efaa68 100644 (file)
--- a/app/assets/stylesheets/common.scss
+++ b/app/assets/stylesheets/common.scss
@@ -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 {

diff --git a/app/views/sessions/new.html.erb b/app/views/sessions/new.html.erb
index ffaad054af63f4b89f731415627b08a35e4ad03a..8231fe4e81119e92d8313e59dfe0574855a711e0 100644 (file)
--- a/app/views/sessions/new.html.erb
+++ b/app/views/sessions/new.html.erb
@@ -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| %>

diff --git a/app/views/users/blocked.html.erb b/app/views/users/blocked.html.erb
index f1239bc1ec5d9b54ec9badd4f22cea85f4f3644c..0decb13c0160448ca4e9339e75fcf2db5c16089d 100644 (file)
--- a/app/views/users/blocked.html.erb
+++ b/app/views/users/blocked.html.erb
@@ -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>

diff --git a/app/views/users/new.html.erb b/app/views/users/new.html.erb
index 27e98b45b3df544fea3f8fa7bfcc698a80d3a9e0..1b65ec506bf6aaaa7118d26bd16369cbc965ecaf 100644 (file)
--- a/app/views/users/new.html.erb
+++ b/app/views/users/new.html.erb
@@ -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? %>
-
-      <%= 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 %>
-
-      <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>
+  <%= 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.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.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>

diff --git a/config/locales/en.yml b/config/locales/en.yml
index 77002268b0e6b3c2f04c9995d5c70b39af6ac75c..7f6563a1a6c61b710e14919af6c27d115b2fff10 100644 (file)
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -2731,7 +2731,7 @@ en:
       please_contact_support_html: 'Please contact %{support_link} to arrange for an account to be created - we will try and deal with the request as quickly as possible.'
       support: support
       about:
-        header: Free and editable
+        header: Free and editable.
         paragraph_1: Unlike other maps, OpenStreetMap is completely created by people like you, and it's free for anyone to fix, update, download and use.
         paragraph_2: Sign up to get started contributing. We'll send an email to confirm your account.
       display name description: "Your publicly displayed username. You can change this later in the preferences."