[refs #230] add red borders to invalid attributes

2012-02-29 17:38:13 +06:00 · 2012-02-29 17:38:13 +06:00 · 75a0069f72
parent 80b594b986
commit 75a0069f72
5 changed files with 261 additions and 54 deletions
--- a/app/assets/stylesheets/registration.scss
+++ b/app/assets/stylesheets/registration.scss
@ -0,0 +1,211 @@
+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: 380px;
+  height: 254px;
+  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, 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; }
+
+article div {
+  &.left {
+    float: left;
+    font-size: 12px;
+    color: #FFF;
+    margin-left: 15px;
+    margin-top: 16px; }
+  &.right {
+    float: right;
+    margin-right: 15px;
+    padding-bottom: 2px; } }
+
+.first {
+  padding-top: 5px; }
+
+input.button {
+  padding: 3px 27px 8px 27px;
+  height: 25px;
+  width: auto; }
+
+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, &.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.in {
+  float: right;
+  margin-right: 15px;
+  margin-top: 12px; }
+
+div.error {
+  background: image-url("error-message.png");
+  width: 237px;
+  height: 35px;
+  font-size: 12px;
+  position: absolute;
+  margin-top: -159px;
+  margin-left: 645px;
+  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; } } } } }
--- a/app/views/devise/registrations/new.html.haml
+++ b/app/views/devise/registrations/new.html.haml
@ -1,52 +1,40 @@
-#block-signup.block
-  %h2= title t("devise.registrations.sign_up_header")
-  .content
+.wrap
+  / Top block
+  %header
+    .logo
+  / Page
+  - uname_error = name_error = email_error = password_error = password_confirm_error = nil
+  - if resource.errors.present? # Trash
+    .flash
+    - resource.errors.each do |attr, array|
+      -uname_error = array if attr == :uname
+      -name_error = array if attr == :name
+      -email_error = array if attr == :email
+      -password_error = array if attr == :password
+      -password_confirm_error = array if attr == :password_confirmation
+  %article
    = form_for(resource, :as => resource_name, :url => registration_path(resource_name), :html => { :class => "form" }) do |f|
      = hidden_field_tag :invitation_token, @invitation_token
-      - if resource.errors.present?
-        .flash
-          .message.error= resource.errors.full_messages.map { |msg| content_tag(:p, msg) }.join.html_safe
-
-      .group.wat-cf
-        .left
-          = f.label :uname, :class => "label"
-        .right
-          = f.text_field :uname, :class => "text_field"
-
-      .group.wat-cf
-        .left
-          = f.label :email, :class => "label"
-        .right
-          = f.text_field :email, :class => "text_field", :readonly => 'readonly'
-
-      .group.wat-cf
-        .left
-          = f.label :name, :class => "label"
-        .right
-          = f.text_field :name, :class => "text_field"
-
-      - if resource.authentications.blank?
-        .group.wat-cf
-          .left
-            = f.label :password, :class => "label"
-          .right
-            = f.password_field :password, :class => "text_field"
-
-        .group.wat-cf
-          .left
-            = f.label :password_confirmation, :class => "label"
-          .right
-            = f.password_field :password_confirmation, :class => "text_field"
-
-      .group.wat-cf
-        .left
-          = f.label :language, :class => "label"
-        .right
-          = f.select :language, User::LANGUAGES_FOR_SELECT
-
-      .group.navform.wat-cf
-        %button.button{:type => "submit"}
-          = image_tag("choose.png", :alt => t("devise.registrations.sign_up_header"))
-          = t("devise.registrations.sign_up_header")
-        %span.text_button_padding
-        = render :partial => "devise/shared/links"
+      .left.first=t('activerecord.attributes.user.uname')
+      .right.first
+        = f.text_field :uname, :id => 'login', :class => "registartion-input #{uname_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();"
+      .both
+      .left=t('activerecord.attributes.user.name')
+      .right
+        = f.text_field :name, :id => 'name',  :class => "registartion-input #{name_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();"
+      .both
+      .left=t('activerecord.attributes.user.email')
+      .right
+        = f.text_field :email, :id => 'email', :readonly => 'readonly',  :class => "registartion-input #{email_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();"
+      .both
+      .left=t('activerecord.attributes.user.password')
+      .right
+        = f.text_field :password, :id => 'pass',  :class => "registartion-input #{password_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();"
+      .both
+      .left=t('activerecord.attributes.user.password_confirm')
+      .right
+        = f.text_field :password_confirmation, :id => 'pass2',  :class => "registartion-input #{password_confirm_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();"
+      .both
+      .in
+        =f.submit t("layout.devise.shared_links.sign_up"), :class => 'button', :id => 'btnLogin'
+      .both
--- a/app/views/layouts/sessions.html.haml
+++ b/app/views/layouts/sessions.html.haml
@ -3,11 +3,15 @@
  %head
    %meta{:content => "text/html; charset=utf-8", "http-equiv" => "content-type"}
    = display_meta_tags :site => APP_CONFIG['project_name']
-    = stylesheet_link_tag "login"
-    = javascript_include_tag "login"
+    - if controller_name == 'sessions' && action_name == 'new'
+      = stylesheet_link_tag "login"
+      = javascript_include_tag "login"
+    - elsif controller_name == 'registrations' && ['new', 'create'].include?(action_name)
+      = stylesheet_link_tag "registration"
    = csrf_meta_tag
  %body
    -# render :partial => "layouts/flashes"
    = yield

    = render 'layouts/counters' unless current_user.try(:admin?)
+  %footer= render "layouts/menu/bottom"
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@ -766,6 +766,8 @@ en:
        updated_at: Updated
        role: System role
        language: Language
+        password: Password
+        password_confirm: Confirmation

      product_build_list:
        id: Id
--- a/config/locales/ru.yml
+++ b/config/locales/ru.yml
@ -54,7 +54,7 @@ ru:
    devise:
      shared_links:
        sign_in: Войти
-        sign_up: Зарегистрироваться
+        sign_up: Регистрация
        forgot_password: Забыли пароль?
        confirm_again: Не получили инструкции по подтверждению?
        unlock: Не получили инструкции по разблокировке?
@ -637,7 +637,7 @@ ru:
        name: Имя
        login: Псевдоним или Email
        email: Email
-        uname: Псевдоним
+        uname: Никнейм
        ssh_key: SSH ключ
        current_password: Текущий пароль
        role: Роль
@ -645,6 +645,8 @@ ru:
        updated_at: Обновлен
        role: Роль в системе
        language: Язык
+        password: Пароль
+        password_confirm: Повторите пароль

      product_build_list:
        id: Id