Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

UX: updated account activation page design (#17730)

This commit is contained in:
Meghna 2022-07-29 22:33:11 +05:30 committed by GitHub
parent c97bfa1c44
commit b5ea6e746c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 49 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
app/assets/stylesheets/common/base/activation.scss
View File

@ -26,3 +26,30 @@
}
}
}
.activate-account {
.activate-title {
text-align: center;
.waving-hand {
height: 32px;
margin-bottom: 13px;
}
}
#activate-account-button {
margin-top: 20px;
margin-left: auto;
margin-right: auto;
display: block;
}
.perform-activation {
border-top: 6px solid var(--tertiary);
box-shadow: 0 1px 10px 1px rgba(var(--primary-low-rgb), 1.25);
border-radius: 10px;
padding: 1em 2.5em 1em 2.5em;
.image {
width: 150px;
margin: auto;
padding-bottom: 1em;
}
}
}

4
app/views/users/activate_account.html.erb
View File

@ -1,5 +1,6 @@
<div id='simple-container'>
<h2><%= t 'activation.welcome_to', site_name: SiteSetting.title %></h2>
<div class='activate-account'>
<h1 class="activate-title"><%= t 'activation.welcome_to', site_name: SiteSetting.title %> <img src="<%= Emoji.url_for("wave") %>" alt="" class="waving-hand"></h1>
<br/>
<button class='btn btn-primary' id='activate-account-button'><%= t 'activation.action' %></button>
@ -7,6 +8,7 @@
<%= hidden_field_tag 'password_confirmation' %>
<%= hidden_field_tag 'challenge' %>
<% end %>
</div>
</div>
<%- content_for(:no_ember_head) do %>

33
app/views/users/perform_account_activation.html.erb
View File

@ -1,22 +1,27 @@
<div id='simple-container'>
<%if flash[:error]%>
<div class='alert alert-error'>
<%=flash[:error]%>
</div>
<%else%>
<h2><%= t 'activation.welcome_to', site_name: SiteSetting.title %></h2>
<br>
<% if @needs_approval %>
<p><%= t 'activation.approval_required' %></p>
<% else %>
<p><%= t('activation.please_continue') %></p>
<p><a class="btn" href="<%= path "/" %>"><%= t('activation.continue_button', site_name: SiteSetting.title) -%></a></p>
<%- content_for(:no_ember_head) do %>
<%= tag.meta id: 'data-auto-redirect', data: { path: path('/') } %>
<%- end %>
<%= preload_script 'auto-redirect' %>
<% end %>
<div class='activate-account'>
<h1 class="activate-title"><%= t 'activation.welcome_to', site_name: SiteSetting.title %> <img src="<%= Emoji.url_for("wave") %>" alt="" class="waving-hand"></h1>
<br>
<div class='perform-activation'>
<div class="image">
<img src="/images/wizard/tada.svg" alt="" class="waving-hand">
</div>
<% if @needs_approval %>
<p><%= t 'activation.approval_required' %></p>
<% else %>
<p><%= t('activation.please_continue') %></p>
<p><a class="btn" href="<%= path "/" %>"><%= t('activation.continue_button', site_name: SiteSetting.title) -%></a></p>
<%- content_for(:no_ember_head) do %>
<%= tag.meta id: 'data-auto-redirect', data: { path: path('/') } %>
<%- end %>
<%= preload_script 'auto-redirect' %>
<% end %>
</div>
</div>
<%end%>
</div>