[refs #228] sign_in page

This commit is contained in:
Alexander Machehin 2012-02-29 02:43:17 +06:00
parent 7992bb60d9
commit a1bfe66791
6 changed files with 384 additions and 27 deletions

View File

@ -0,0 +1,75 @@
//= require jquery
//= require jquery_ujs
$(document).ready(function() {
function logIn() {
$('#new_user').submit();
//~ $("#hint").fadeIn("slow");
//~ document.getElementById("user_login").className="registartion-input-error";
//~ document.getElementById("user_password").className="registartion-input-error";
}
});
function disError(elem) {
$("#hint").fadeOut("fast");
if (document.getElementById("user_login").className=="registartion-input-error") {
if (this.id=="user_login") {
document.getElementById("user_login").className="registartion-input-focus";
} else {
document.getElementById("user_login").className="registartion-input-no-focus";
}
}
if (document.getElementById("user_password").className=="registartion-input-error") {
if (this.id=="user_password") {
document.getElementById("user_password").className="registartion-input-focus";
} else {
document.getElementById("user_password").className="registartion-input-no-focus";
}
}
buttonCheck();
}
function buttonCheck() {
if ((document.getElementById("user_login").value!="")&&(document.getElementById("user_login").value!="Логин или email")&&(document.getElementById("user_password").value!="")&&(document.getElementById("user_password").value!="Пароль")) {
document.getElementById("btnLogin").className = "button";
} else {
document.getElementById("btnLogin").className = "button disabled";
}
}
function changeCheck(el)
{
var el = el,
input = el.getElementsByTagName("input")[0];
if(input.checked)
{
el.style.backgroundPosition="0 0";
input.checked=false;
}
else
{
el.style.backgroundPosition="0 -17px";
input.checked=true;
}
return true;
}
function startChangeCheck(el)
{
var el = el,
input = el.getElementsByTagName("input")[0];
if(input.checked)
{
el.style.backgroundPosition="0 -17px";
}
return true;
}
function startCheck()
{
startChangeCheck(document.getElementById("niceCheckbox1"));
}

View File

@ -0,0 +1,274 @@
html, body {
margin: 0;
padding: 0;
font-family: Tahoma, Geneva, Helvetica, sans-serif;
color: #565667;
background: #1f60a1 image-url("bg.png") repeat-x;
min-width: 940px;
min-height: 300px;
text-align: center;
height: 100%; }
header, section, footer, aside, nav, article, menu {
display: block; }
input {
&[type="text"]:focus, &[type="password"]:focus, &:focus {
outline: none; } }
select:focus {
outline: none; }
a img {
border: none; }
.wrap {
width: 940px;
margin: 0 auto;
text-align: center;
min-height: 95%; }
.both {
clear: both; }
/* Header */
header div {
&.logo {
background: image-url("logo.png") no-repeat 50% 100%;
height: 89px;
width: 233px;
margin: 0 auto;
text-align: center;
padding-top: 12%; }
&.text {
color: #FFF;
font-size: 28px;
width: 800px;
text-align: left;
margin-left: 90px;
margin-top: 50px;
font-family: Arial;
text-shadow: 0px 1px 1px #000000;
filter: dropshadow(color = black, offx = 0, offy = 1);
padding-left: 0px; } }
.niceCheck {
width: 17px;
height: 17px;
display: inline-block;
cursor: pointer;
background: image-url("checkbox.png");
input {
display: none; } }
/* Content */
article {
width: 257px;
height: 227px;
background: #1c394c image-url("bg-signup.png") repeat-x;
border-radius: 5px;
border: 1px solid #38658c;
margin: 0 auto;
text-align: center;
margin-top: 75px;
-webkit-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.5);
box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, 0.5); }
a.button {
background: #125687;
background: image-url("button-green-normal.png");
border-radius: 3px;
color: #FFF;
font-family: Tahoma;
font-size: 12px;
-webkit-font-smoothing: antialiased;
font-weight: normal;
padding: 5px 25px;
text-align: center;
border: none;
height: 25px;
width: 106px;
text-decoration: none; }
input.button {
background: #125687;
background: image-url("button-green-normal.png");
border-radius: 3px;
color: #FFF;
font-family: Tahoma;
font-size: 12px;
-webkit-font-smoothing: antialiased;
font-weight: normal;
padding: 5px 25px;
text-align: center;
border: none;
height: 25px;
width: 106px;
text-decoration: none;
padding: 5px 27px 8px 27px;
height: 28px;
width: 110px; }
a.button:hover, input.button:hover {
background: #1874b6;
background: image-url("button-green-hover.png");
cursor: pointer; }
a.button:active, input.button:active {
background: image-url("button-green-press.png"); }
a.button {
&:disabled, &.disabled {
background: #125687;
background: image-url("button-green-disabled.png");
cursor: default; } }
input.button:disabled {
background: #125687;
background: image-url("button-green-disabled.png");
cursor: default; }
article h1 {
color: #FFF;
font-size: 18px;
font-weight: normal;
font-family: Tahoma;
margin-bottom: 5px; }
.registartion-input, .registartion-input-focus, .registartion-input-error, .registartion-input-no-focus {
height: 24px;
width: 217px;
border: 1px solid #8199a9;
border-radius: 2px;
color: #cfcfcf;
font-family: Tahoma;
font-size: 12px;
padding-left: 10px;
margin-top: 10px; }
.registartion-input-focus, .registartion-input-focus-signup {
color: #575756;
-webkit-box-shadow: 0px 0px 7px 2px rgba(126, 183, 237, 0.75);
-moz-box-shadow: 0px 0px 7px 2px rgba(126, 183, 237, 0.75);
box-shadow: 0px 0px 7px 2px rgba(126, 183, 237, 0.75); }
.registartion-input-no-focus, .registartion-input-no-focus-signup {
color: #575756; }
.registartion-input-error, .registartion-input-error-signup {
border: 1px solid #bd4d40;
outline: 1px solid #bd4d40;
outline-offset: -2px; }
div {
&.registration div {
&.remember {
color: #FFF;
font-size: 12px;
float: left;
padding-left: 15px;
padding-top: 5px;
div {
&.check {
float: left;
margin-top: 15px;
margin-right: 4px; }
&.text {
float: left;
margin-top: 15px; } } }
&.in {
float: right;
padding-right: 15px;
padding-top: 15px; } }
&.hr {
margin-top: 10px;
height: 1px;
width: 100%;
border-bottom: 1px solid #264862;
border-top: 1px solid #264862; } }
article div.other div {
&.left {
float: left;
font-size: 12px;
color: #FFFFFF;
margin-top: 6px;
margin-left: 15px; }
&.right {
float: right;
margin-right: 15px;
margin-top: 13px; } }
div {
&.forgot {
width: 257px;
text-align: center;
margin: 0 auto; }
&.password {
float: right;
padding-top: 4px;
p {
margin: 0;
padding: 0; }
a {
color: #FFF;
font-size: 12px;
text-decoration: none;
&:hover {
text-decoration: underline; } } } }
nav {
width: 96px;
height: 47px;
background: image-url("registration.png") no-repeat;
float: right;
cursor: pointer;
p {
font-size: 14px;
color: #FFF;
margin: 0;
padding: 0;
padding-top: 10px; } }
div.error {
background: image-url("error-message.png");
width: 237px;
height: 35px;
font-size: 12px;
position: absolute;
margin-top: -159px;
margin-left: 582px;
display: none;
p {
margin: 0;
padding: 0;
padding-top: 7px;
text-align: center; } }
/* Footer */
footer {
height: 32px;
padding-left: 15px;
width: 900px;
margin: 0 auto;
text-align: center;
ul {
margin: 0;
padding: 0;
list-style: none;
font-size: 12px;
color: #FFF;
padding-top: 10px;
text-align: center;
li {
display: inline;
a {
font-size: 12px;
color: #FFF;
text-decoration: none;
&:hover {
text-decoration: underline; } } } } }

View File

@ -1,22 +1,30 @@
#block-login.block
%h2= title t("layout.sessions.sign_in_header")
.content.login
- if flash.present?
.flash
- flash.each do |key, value|
.message{ :title => key.to_s.humanize, :class => (key == :alert ? "error" : key) }
%p= value
.wrap
%nav
%p= link_to t("layout.devise.shared_links.sign_up"), new_register_request_path
/ Top block
%header
.logo
/ Page
%article
- is_error = flash.first.first == :alert # Trash
= form_for(resource, :as => resource_name, :url => session_path(resource_name), :html => { :class => "form login" }) do |f|
.group.wat-cf
.left= f.label :login, :class => "label right"
.right= f.text_field :login, :class => "text_field"
.group.wat-cf
.left= f.label :password, :class => "label right"
.right= f.password_field :password, :class => "text_field"
.group.navform.wat-cf
.right
%button.button{:type => "submit"}
= image_tag 'code.png', :alt => "Save"
= t("layout.login")
%span.text_button_padding
= render :partial => "devise/shared/links"
%h1= title t("layout.sessions.sign_in_header")
= f.text_field :login, :class => "registartion-input #{is_error ? "registartion-input-error" : ''}", :onClick => "this.className='registartion-input-focus';disError(this);", :onblur => "if(this.value==''){this.value='Логин или email';this.className='registartion-input';}else{this.className='registartion-input-no-focus';};buttonCheck();", :onfocus => "if(this.value=='Логин или email'){this.value='';this.className='registartion-input-focus';};", :onkeydown => "buttonCheck();", :type => "text", :value => "Логин или email"
%br/
= f.password_field :password, :class => "registartion-input #{is_error ? "registartion-input-error" : ''}", :onClick => "this.className='registartion-input-focus';disError(this);", :onblur => "if(this.value==''){this.value='Пароль';this.className='registartion-input';}else{this.className='registartion-input-no-focus';};buttonCheck();", :onfocus => "if(this.value=='Пароль'){this.value='';this.className='registartion-input-focus';};", :onkeydown => "buttonCheck();", :type => "password", :value => "Пароль"
%br/
.registration
.remember
.check
%span#niceCheckbox1.niceCheck{:onclick => "changeCheck(this)"}
= f.check_box :remember_me
.text=t('devise.sessions.remember_me')
.in=f.submit t('layout.devise.shared_links.sign_in'), :class => 'button disabled', :id => 'btnLogin'
%div{:style => "clear: both;"}
.hr
.both
#hint.error{:style => is_error ? 'display: block;' : ''}
%p=t('devise.failure.invalid')
.forgot
.password
%p= link_to t("layout.devise.shared_links.forgot_password"), new_password_path(resource_name)

View File

@ -3,13 +3,11 @@
%head
%meta{:content => "text/html; charset=utf-8", "http-equiv" => "content-type"}
= display_meta_tags :site => APP_CONFIG['project_name']
= stylesheet_link_tag "application"
= javascript_include_tag "application"
= stylesheet_link_tag "login"
= javascript_include_tag "login"
= csrf_meta_tag
%body
#container
#box
= render :partial => "layouts/flashes"
= yield
-# render :partial => "layouts/flashes"
= yield
= render 'layouts/counters' unless current_user.try(:admin?)

View File

@ -22,6 +22,7 @@ en:
sessions:
signed_in: 'Signed in successfully.'
signed_out: 'Signed out successfully.'
remember_me: 'Remember me'
passwords:
send_instructions: 'You will receive an email with instructions about how to reset your password in a few minutes.'
updated: 'Your password was changed successfully. You are now signed in.'

View File

@ -24,6 +24,7 @@ ru:
sessions:
signed_in: "Вход в систему выполнен."
signed_out: "Выход из системы выполнен."
remember_me: 'Запомнить меня'
passwords:
send_instructions: "В течение нескольких минут вы получите e-mail с инструкциями по восстановлению вашего пароля."
updated: "Ваш пароль изменён. Теперь вы вошли в систему."