Browse code

Stylovanie login stranky

Cinan Rakosnik authored on 24/02/2013 at 14:54:38
Showing 9 changed files
... ...
@@ -1,6 +1,6 @@
1 1
 source 'https://rubygems.org'
2 2
 
3
-gem 'rails', '3.2.11'
3
+gem 'rails', '~> 3.2.11'
4 4
 
5 5
 # Bundle edge Rails instead:
6 6
 # gem 'rails', :git => 'git://github.com/rails/rails.git'
... ...
@@ -12,13 +12,13 @@ gem "mongoid", "~> 3.0.20"
12 12
 group :assets do
13 13
   gem 'sass-rails',   '~> 3.2.3'
14 14
   gem 'coffee-rails', '~> 3.2.1'
15
+  gem 'normalize-rails'
16
+  gem 'compass-rails'
15 17
 
16 18
   # See https://github.com/sstephenson/execjs#readme for more supported runtimes
17 19
   # gem 'therubyracer', :platforms => :ruby
18 20
 
19 21
   gem 'uglifier', '>= 1.0.3'
20
-  gem "compass", "~> 0.12.2"
21
-
22 22
 end
23 23
 
24 24
 group :development, :test do
... ...
@@ -1,38 +1,38 @@
1 1
 GEM
2 2
   remote: https://rubygems.org/
3 3
   specs:
4
-    actionmailer (3.2.11)
5
-      actionpack (= 3.2.11)
4
+    actionmailer (3.2.12)
5
+      actionpack (= 3.2.12)
6 6
       mail (~> 2.4.4)
7
-    actionpack (3.2.11)
8
-      activemodel (= 3.2.11)
9
-      activesupport (= 3.2.11)
7
+    actionpack (3.2.12)
8
+      activemodel (= 3.2.12)
9
+      activesupport (= 3.2.12)
10 10
       builder (~> 3.0.0)
11 11
       erubis (~> 2.7.0)
12 12
       journey (~> 1.0.4)
13
-      rack (~> 1.4.0)
13
+      rack (~> 1.4.5)
14 14
       rack-cache (~> 1.2)
15 15
       rack-test (~> 0.6.1)
16 16
       sprockets (~> 2.2.1)
17
-    activemodel (3.2.11)
18
-      activesupport (= 3.2.11)
17
+    activemodel (3.2.12)
18
+      activesupport (= 3.2.12)
19 19
       builder (~> 3.0.0)
20
-    activerecord (3.2.11)
21
-      activemodel (= 3.2.11)
22
-      activesupport (= 3.2.11)
20
+    activerecord (3.2.12)
21
+      activemodel (= 3.2.12)
22
+      activesupport (= 3.2.12)
23 23
       arel (~> 3.0.2)
24 24
       tzinfo (~> 0.3.29)
25
-    activeresource (3.2.11)
26
-      activemodel (= 3.2.11)
27
-      activesupport (= 3.2.11)
28
-    activesupport (3.2.11)
25
+    activeresource (3.2.12)
26
+      activemodel (= 3.2.12)
27
+      activesupport (= 3.2.12)
28
+    activesupport (3.2.12)
29 29
       i18n (~> 0.6)
30 30
       multi_json (~> 1.0)
31 31
     addressable (2.3.2)
32 32
     ansi (1.4.3)
33 33
     arel (3.0.2)
34 34
     builder (3.0.4)
35
-    capistrano (2.14.1)
35
+    capistrano (2.14.2)
36 36
       highline
37 37
       net-scp (>= 1.0.0)
38 38
       net-sftp (>= 2.0.0)
... ...
@@ -45,8 +45,8 @@ GEM
45 45
       rack-test (>= 0.5.4)
46 46
       selenium-webdriver (~> 2.0)
47 47
       xpath (~> 1.0.0)
48
-    childprocess (0.3.7)
49
-      ffi (~> 1.0, >= 1.0.6)
48
+    childprocess (0.3.8)
49
+      ffi (~> 1.0, >= 1.0.11)
50 50
     chunky_png (1.2.7)
51 51
     coffee-rails (3.2.2)
52 52
       coffee-script (>= 2.2.0)
... ...
@@ -59,13 +59,15 @@ GEM
59 59
       chunky_png (~> 1.2)
60 60
       fssm (>= 0.2.7)
61 61
       sass (~> 3.1)
62
+    compass-rails (1.0.3)
63
+      compass (>= 0.12.2, < 0.14)
62 64
     diff-lcs (1.1.3)
63 65
     erubis (2.7.0)
64 66
     execjs (1.4.0)
65 67
       multi_json (~> 1.0)
66 68
     factory_girl (4.2.0)
67 69
       activesupport (>= 3.0.0)
68
-    factory_girl_rails (4.2.0)
70
+    factory_girl_rails (4.2.1)
69 71
       factory_girl (~> 4.2.0)
70 72
       railties (>= 3.0.0)
71 73
     ffi (1.3.1)
... ...
@@ -81,67 +83,68 @@ GEM
81 81
     hike (1.2.1)
82 82
     i18n (0.6.1)
83 83
     journey (1.0.4)
84
-    jquery-rails (2.2.0)
84
+    jquery-rails (2.2.1)
85 85
       railties (>= 3.0, < 5.0)
86 86
       thor (>= 0.14, < 2.0)
87
-    json (1.7.6)
87
+    json (1.7.7)
88 88
     launchy (2.2.0)
89 89
       addressable (~> 2.3)
90 90
     mail (2.4.4)
91 91
       i18n (>= 0.4.0)
92 92
       mime-types (~> 1.16)
93 93
       treetop (~> 1.4.8)
94
-    mime-types (1.20.1)
95
-    minitest (4.5.0)
94
+    mime-types (1.21)
95
+    minitest (4.6.0)
96 96
     minitest-reporters (0.14.7)
97 97
       ansi
98 98
       builder
99 99
       minitest (>= 2.12, < 5.0)
100 100
       powerbar
101
-    mongoid (3.0.21)
101
+    mongoid (3.0.22)
102 102
       activemodel (~> 3.1)
103 103
       moped (~> 1.2)
104 104
       origin (~> 1.0)
105 105
       tzinfo (~> 0.3.22)
106
-    moped (1.3.2)
107
-    multi_json (1.5.0)
108
-    net-scp (1.0.4)
109
-      net-ssh (>= 1.99.1)
110
-    net-sftp (2.0.5)
111
-      net-ssh (>= 2.0.9)
112
-    net-ssh (2.6.3)
113
-    net-ssh-gateway (1.1.0)
114
-      net-ssh (>= 1.99.1)
106
+    moped (1.4.2)
107
+    multi_json (1.6.0)
108
+    net-scp (1.1.0)
109
+      net-ssh (>= 2.6.5)
110
+    net-sftp (2.1.1)
111
+      net-ssh (>= 2.6.5)
112
+    net-ssh (2.6.5)
113
+    net-ssh-gateway (1.2.0)
114
+      net-ssh (>= 2.6.5)
115 115
     nokogiri (1.5.6)
116
+    normalize-rails (2.0.1)
116 117
     origin (1.0.11)
117 118
     polyglot (0.3.3)
118 119
     powerbar (1.0.11)
119 120
       ansi (~> 1.4.0)
120 121
       hashie (>= 1.1.0)
121
-    rack (1.4.4)
122
+    rack (1.4.5)
122 123
     rack-cache (1.2)
123 124
       rack (>= 0.4)
124 125
     rack-ssl (1.3.3)
125 126
       rack
126 127
     rack-test (0.6.2)
127 128
       rack (>= 1.0)
128
-    rails (3.2.11)
129
-      actionmailer (= 3.2.11)
130
-      actionpack (= 3.2.11)
131
-      activerecord (= 3.2.11)
132
-      activeresource (= 3.2.11)
133
-      activesupport (= 3.2.11)
129
+    rails (3.2.12)
130
+      actionmailer (= 3.2.12)
131
+      actionpack (= 3.2.12)
132
+      activerecord (= 3.2.12)
133
+      activeresource (= 3.2.12)
134
+      activesupport (= 3.2.12)
134 135
       bundler (~> 1.0)
135
-      railties (= 3.2.11)
136
-    railties (3.2.11)
137
-      actionpack (= 3.2.11)
138
-      activesupport (= 3.2.11)
136
+      railties (= 3.2.12)
137
+    railties (3.2.12)
138
+      actionpack (= 3.2.12)
139
+      activesupport (= 3.2.12)
139 140
       rack-ssl (~> 1.3.2)
140 141
       rake (>= 0.8.7)
141 142
       rdoc (~> 3.4)
142 143
       thor (>= 0.14.6, < 2.0)
143 144
     rake (10.0.3)
144
-    rdoc (3.12)
145
+    rdoc (3.12.1)
145 146
       json (~> 1.4)
146 147
     rspec-core (2.12.2)
147 148
     rspec-expectations (2.12.1)
... ...
@@ -173,7 +176,7 @@ GEM
173 173
     test-unit (2.5.4)
174 174
     thor (0.17.0)
175 175
     tilt (1.3.3)
176
-    timecop (0.5.9.1)
176
+    timecop (0.5.9.2)
177 177
     treetop (1.4.12)
178 178
       polyglot
179 179
       polyglot (>= 0.3.1)
... ...
@@ -193,7 +196,7 @@ DEPENDENCIES
193 193
   capistrano
194 194
   capybara
195 195
   coffee-rails (~> 3.2.1)
196
-  compass (~> 0.12.2)
196
+  compass-rails
197 197
   factory_girl_rails
198 198
   haml (~> 3.1.7)
199 199
   haml-rails (~> 0.3.5)
... ...
@@ -202,7 +205,8 @@ DEPENDENCIES
202 202
   minitest
203 203
   minitest-reporters (>= 0.5.0)
204 204
   mongoid (~> 3.0.20)
205
-  rails (= 3.2.11)
205
+  normalize-rails
206
+  rails (~> 3.2.11)
206 207
   rspec-rails
207 208
   sass-rails (~> 3.2.3)
208 209
   test-unit
209 210
deleted file mode 100755
... ...
@@ -1,3 +0,0 @@
1
-# Place all the behaviors and hooks related to the matching controller here.
2
-# All this logic will automatically be available in application.js.
3
-# You can use CoffeeScript in this file: http://jashkenas.github.com/coffee-script/
4 1
new file mode 100644
... ...
@@ -0,0 +1,8 @@
0
+$bg-color: #DEDBDB;
1
+$app-color: #24a396;
2
+
3
+$white: #fff;
4
+$gray: #b0b7b9;
5
+$gray-light: #dde0e3;
6
+
7
+$error: #AD3A3A;
0 8
\ No newline at end of file
1 9
new file mode 100644
... ...
@@ -0,0 +1,65 @@
0
+/*
1
+ *= require normalize-rails
2
+ *= require_self
3
+ *= require_tree .
4
+*/
5
+
6
+@import "config";
7
+@import "compass/css3/box-sizing";
8
+
9
+h1 {
10
+  color: $app-color;
11
+  background: #f4f4f4;
12
+  font-size: 17px;
13
+  padding: 7px 14px;
14
+}
15
+
16
+body {
17
+  background: $bg-color;
18
+}
19
+
20
+label {
21
+  display: block;
22
+  color: $gray;
23
+  font-size: 12px;
24
+  margin: 11px 0 2px;
25
+}
26
+
27
+input {
28
+  border: 1px $gray-light solid;
29
+  border-radius: 4px;
30
+  width: 100%;
31
+  margin-bottom: 10px;
32
+  height: 30px;
33
+  @include box-sizing(border-box);
34
+
35
+  &[type=submit] {
36
+    text-transform:lowercase;
37
+    font-variant: small-caps;
38
+    font-weight: bold;
39
+    font-size: 18px;
40
+    background: $app-color;
41
+    color: #f9f9f9;
42
+    border: none 0px #000000;
43
+    margin-top: 16px;
44
+  }
45
+
46
+  &:focus {
47
+    outline: 5px auto $app-color;
48
+  }
49
+}
50
+
51
+.top-border {
52
+  border-top: 7px solid $app-color;
53
+}
54
+
55
+.alert {
56
+  font-size: 12px;
57
+  &.alert-notice {
58
+
59
+  }
60
+
61
+  &.alert-error {
62
+    color: $error;
63
+  }
64
+}
0 65
\ No newline at end of file
1 66
new file mode 100644
... ...
@@ -0,0 +1,18 @@
0
+@import "config";
1
+
2
+body {
3
+  border-top: #658489 7px solid;
4
+}
5
+
6
+$form-wrapper-padding: 14px;
7
+
8
+.form-wrapper {
9
+  width: 250px;
10
+  background: $white;
11
+  padding: 0 $form-wrapper-padding;
12
+  margin: 100px auto;
13
+}
14
+
15
+.login-form-header {
16
+  margin: 0 -1*$form-wrapper-padding;
17
+}
0 18
\ No newline at end of file
... ...
@@ -2,7 +2,7 @@
2 2
 %html{:lang => :en}
3 3
   %head
4 4
     %title= yield(:title) + " | App"
5
-    %meta{:charset => "utf-8"}/
6
-    -#%link{ :href => "/css/screen.css", :media => "screen", :rel => "stylesheet" }
5
+    %meta{ :charset => "utf-8" }/
6
+    = stylesheet_link_tag "application"
7 7
   %body
8 8
     = yield
9 9
\ No newline at end of file
... ...
@@ -1,20 +1,23 @@
1
-- content_for(:title, 'Login')
2
-%h1 Login
3
-- if flash[:error]
4
-  %div.alert.alert-error
5
-    = flash[:error]
1
+- content_for(:title, t("sessions.title"))
2
+.form-wrapper
3
+  %h1{ class: "top-border login-form-header" }
4
+    = t(".form-header")
6 5
 
7
-- if flash[:notice]
8
-  %div.alert.alert-notice
9
-    = flash[:notice]
6
+  %form{ action: sessions_path, method: "post"}
7
+    %label{for: "jid"}
8
+      %strong Jabber ID
9
+    %input{type: "text", name: "jid", class: "text", id: "jid", placeholder: "nick@example.com"}
10 10
 
11
-%form{ action: sessions_path, method: "post"}
12
-  %fieldset
13
-    %ol
14
-      %li
15
-        %label{for: "jid"} Jabber ID:
16
-        %input{type: "text", name: "jid", class: "text", id: "jid"}
17
-      %li
18
-        %label{for: "password"} Password:
19
-        %input{type: "password", name: "password", class: "text", id: "password"}
20
-    %input{type: "submit", value: "Send", class: "button"}
21 11
\ No newline at end of file
12
+    %label{for: "pass"}
13
+      %strong Password
14
+    %input{type: "password", name: "password", class: "text", id: "pass"}
15
+
16
+    - if flash[:error]
17
+      %div.alert.alert-error
18
+        = flash[:error]
19
+
20
+    - if flash[:notice]
21
+      %div.alert.alert-notice
22
+        = flash[:notice]
23
+
24
+    %input{type: "submit", value: t(".form-send"), class: "button"}
22 25
\ No newline at end of file
... ...
@@ -4,4 +4,11 @@
4 4
 en:
5 5
   login:
6 6
     error: 'Invalid email/password combination'
7
-    success: 'Successfully logged in'
8 7
\ No newline at end of file
8
+    success: 'Successfully logged in'
9
+
10
+  sessions:
11
+    title: "Login"
12
+
13
+    new:
14
+      form-header: "Login form"
15
+      form-send: "Login"
9 16
\ No newline at end of file