moparisthebest/kaiwa
1
0
Fork 0
mirror of https://github.com/moparisthebest/kaiwa synced 2024-08-13 17:03:51 -04:00
Code Issues Releases Wiki Activity

[ux] final touch on log in page

Browse Source
This commit is contained in:
karolinaszczur 2013-09-18 19:45:40 +02:00
parent f857e7e527
commit 1e8fb361f4
5 changed files with 54 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
public/css/app/aux.styl
View File

@ -6,15 +6,22 @@
#logo
margin: auto
#loginbox
.box
position: relative
margin: auto
margin-top: 5%
padding: 20px
padding: 20px 0
background: white
width: 75%
roundall(3px)
.head, .content
padding: 0 20px
.head
margin-bottom: 20px
border-bottom: 1px solid lighten($grayOutline, 50%)
input
width: 100%
margin-bottom: 15px
@ -23,9 +30,7 @@
float: right
h2
margin-top: 0
color: #222
padding-bottom: 10px
border-bottom: 1px solid lighten($grayOutline, 50%)
margin: 0
padding-bottom: 20px

2
public/css/app/forms.styl
View File

@ -1,3 +1,5 @@
// Forms and Buttons
input[type=text], input[type=email], input[type=search], input[type=password], textarea
-webkit-appearance: none
roundall(3px)

8
public/css/app/layout.styl
View File

@ -3,10 +3,10 @@
body
background: #ecf0f2
color: #222
font-family: 'Lucdia Grande', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif
font-size: 17px
font-weight: 500
color: $baseText
font-family: 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif
font-size: 16px
font-weight: 400
-webkit-font-smoothing: antialiased
#pages

32
public/css/otalk.css
View File

@ -658,10 +658,10 @@ td {
}
body {
background: #ecf0f2;
color: #222;
font-family: 'Lucdia Grande', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 17px;
font-weight: 500;
color: #565656;
font-family: 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 16px;
font-weight: 400;
-webkit-font-smoothing: antialiased;
}
body #pages {
@ -683,11 +683,11 @@ body #menu {
#logo {
margin: auto;
}
#loginbox {
.box {
position: relative;
margin: auto;
margin-top: 5%;
padding: 20px;
padding: 20px 0;
background: #fff;
width: 75%;
-moz-border-radius: 3px;
@ -697,18 +697,24 @@ body #menu {
-border-radius: 3px;
border-radius: 3px;
}
#loginbox input {
.box .head,
.box .content {
padding: 0 20px;
}
.box .head {
margin-bottom: 20px;
border-bottom: 1px solid #f2f2f2;
}
.box input {
width: 100%;
margin-bottom: 15px;
}
#loginbox a.button {
.box a.button {
float: right;
}
#loginbox h2 {
margin-top: 0;
color: #222;
padding-bottom: 10px;
border-bottom: 1px solid #f2f2f2;
.box h2 {
margin: 0;
padding-bottom: 20px;
}
input[type=text],
input[type=email],

33
views/login.jade
View File

@ -1,23 +1,26 @@
extends layout
block content
section#loginbox.content
h2
| Log in
a.button(href="/oauth/login") Have an &yet account?
section#loginbox.content.box
.head
h2
| Log in
a.button(href="/oauth/login") Have an &yet account?
form
.fieldContainer
label(for='username') JID
input(type='text', id='jid', name='jid', placeholder='you@aweso.me', tabindex='1', autofocus)
.fieldContainer
label(for='password') Password
input(type='password', id='password', name='password', placeholder='•••••••••••••', tabindex='2')
.fieldContainer
label(for='wsURL') WebSocket URL
input(type='text', id='wsURL', name='wsURL', placeholder='wss://aweso.me:5281/xmpp-websocket', tabindex='3')
.content
button(type='submit', tabindex='3') Go!
form
.fieldContainer
label(for='username') JID
input(type='text', id='jid', name='jid', placeholder='you@aweso.me', tabindex='1', autofocus)
.fieldContainer
label(for='password') Password
input(type='password', id='password', name='password', placeholder='•••••••••••••', tabindex='2')
.fieldContainer
label(for='wsURL') WebSocket URL
input(type='text', id='wsURL', name='wsURL', placeholder='wss://aweso.me:5281/xmpp-websocket', tabindex='3')
button(type='submit', tabindex='3') Go!
block scripts
script(src="/js/login.js")