Redesign login page

This commit is contained in:
Steffen van Bergerem 2014-08-11 13:10:18 +02:00
parent 7f3ff6bacb
commit 0d064cbefe
7 changed files with 94 additions and 55 deletions

View file

@ -8,6 +8,7 @@
* Clarify explanations and defaults in diaspora.yml.example [#5088](https://github.com/diaspora/diaspora/pull/5088)
* Consistent header spacing on Bootstrap pages [#5108](https://github.com/diaspora/diaspora/pull/5108)
* Port settings pages (account, profile, privacy, services) to Bootstrap [#5039](https://github.com/diaspora/diaspora/pull/5039)
* Redesign login page [#5112](https://github.com/diaspora/diaspora/pull/5112)
## Bug fixes
* Fix hiding of poll publisher on close [#5029](https://github.com/diaspora/diaspora/issues/5029)

View file

@ -33,7 +33,6 @@ a { color : $link-blue }
}
}
#login,
#forgot_password,
#reset_password {
background-image : image_url("texture/light-bg.png");

View file

@ -86,14 +86,14 @@ form.block-form {
}
}
textarea, input[type=text] {
&:focus {
textarea, input[type=text], input[type=password] {
&:focus, &:invalid:focus {
border: 1px solid $border-dark-grey;
outline: none;
-webkit-box-shadow: none;
box-shadow: none;
}
}
}
/* buttons to be extracted? */
.new-btn {

View file

@ -1,4 +1,3 @@
#login,
#forgot_password,
#reset_password {
position : absolute;
@ -32,3 +31,51 @@
clear : all;
}
}
#login {
padding-top: 20px;
.branding-asterisk {
margin: auto;
width: 154px;
height: 154px;
}
.form-signin {
margin-bottom: 30px;
.form-control {
font-size: 16px;
height: auto;
padding: 10px;
padding-left: 40px;
}
fieldset {
margin-bottom: 20px;
}
.entypo {
position: relative;
display: inline-block;
width: 20px;
text-align: center;
top: -6px;
left: 12px;
color: $text-grey;
font-size: 20px;
}
input[type=text], input[type=password] {
&:focus {
border: 1px solid #ccc;
}
}
input[type=text] {
margin-bottom: -24px;
@include border-radius(5px, 5px, 0, 0);
}
input[type=password] {
margin-bottom: -23px;
@include border-radius(0, 0, 5px, 5px);
}
#forgot_password_link {
margin-top: 20px;
}
}
}

View file

@ -4,7 +4,7 @@
class SessionsController < Devise::SessionsController
layout "application", :only => [:new]
before_filter -> { @css_framework = :bootstrap }, only: [:new]
layout "with_header_with_footer", :only => [:new]
use_bootstrap_for :new
end

View file

@ -1,48 +0,0 @@
<% content_for :page_title do %>
<%= "#{AppConfig.settings.pod_name} / #{t('devise.sessions.new.sign_in')}" %>
<% end %>
<div id="login">
<h1 id="huge-text">
<%= AppConfig.settings.pod_name %>
</h1>
<%= form_for(resource, :as => resource_name, :url => session_path(resource_name), :html => {:class => "form-horizontal block-form"}, :autocomplete => 'off') do |f| %>
<fieldset>
<div class="control-group">
<label class="control-label" for="user_username" style="width: 40%; text-align: center; padding: 10px 0; overflow: hidden">
<%= t('registrations.new.username') %>
</label>
<div class="controls">
<%= f.text_field :username, :required => true, :pattern => "[A-Za-z0-9_.@\-]+", :autocapitalize => "off", :autocorrect => "off", :autofocus => true, :style => "width: 60%;" %>
</div>
</div>
<div class="control-group">
<label class="control-label" for="user_password" style="width: 40%; text-align: center; padding: 10px 0; overflow: hidden">
<%= t('registrations.new.password') %>
</label>
<div class="controls">
<%= f.password_field :password, :placeholder => "••••••••", :required => true, :style => "width: 60%;" %>
</div>
</div>
</fieldset>
<%= f.hidden_field :remember_me, :value => 1 %>
<%= f.submit t('devise.sessions.new.sign_in'), :class => "new-btn" %>
<% end %>
<% if display_password_reset_link? %>
<br/>
<%= link_to t('devise.shared.links.forgot_your_password'), new_password_path(resource_name), :id => "forgot_password_link" %>
<% end %>
<% if display_registration_link? %>
<br/>
<br/>
<br/>
<%= link_to t('devise.shared.links.sign_up'), new_registration_path(resource_name) %>
<% end %>
</div>

View file

@ -0,0 +1,40 @@
- content_for :page_title do
= AppConfig.settings.pod_name + " / " + t('devise.sessions.new.sign_in')
.container-fluid#login
.row-fluid
.span12.text-center
.branding-asterisk
%h1
= AppConfig.settings.pod_name
.row-fluid
.span4.offset4
= form_for resource, :as => resource_name, :url => session_path(resource_name), :html => {:class => 'form-signin'}, :autocomplete => 'off' do |f|
%fieldset
= f.text_field :username,
:placeholder => t('registrations.new.username'),
:class => 'input-block-level form-control',
:required => true,
:pattern => '[A-Za-z0-9_.@\-]+',
:autocapitalize => 'off',
:autocorrect => 'off',
:autofocus => true
%i.entypo.user
= f.password_field :password,
:placeholder => t('registrations.new.password'),
:class => 'input-block-level form-control',
:required => true
%i.entypo.lock
= f.hidden_field :remember_me, :value => 1
= f.submit t('devise.sessions.new.sign_in'), :class => 'btn btn-large btn-block green'
- if display_password_reset_link?
.text-center
= link_to t('devise.shared.links.forgot_your_password'), new_password_path(resource_name), :id => "forgot_password_link"
- if display_registration_link?
.text-center
= link_to t('devise.shared.links.sign_up'), new_registration_path(resource_name)