summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorMaxime Quandalle <maxime@quandalle.com>2015-12-28 10:44:11 +0100
committerMaxime Quandalle <maxime@quandalle.com>2015-12-28 10:44:11 +0100
commitd9bc56896dc1bb546dc8d430827dc17889c97535 (patch)
treeec0df9d8e1358ed21d2f8f54590bcf544007b605
parentcf6139d9e3a4477ed1deb88db6c876f61b6cad59 (diff)
parent55bd26dc9cae0cca1fa861a90fdcb7960672e28a (diff)
downloadwekan-d9bc56896dc1bb546dc8d430827dc17889c97535.tar.gz
wekan-d9bc56896dc1bb546dc8d430827dc17889c97535.tar.bz2
wekan-d9bc56896dc1bb546dc8d430827dc17889c97535.zip
Merge pull request #455 from floatinghotpot/bugfix-userform
optimize login form layout & css
-rw-r--r--client/components/main/layouts.jade17
-rw-r--r--client/components/users/userForm.styl120
2 files changed, 71 insertions, 66 deletions
diff --git a/client/components/main/layouts.jade b/client/components/main/layouts.jade
index 2095e016..943ebe0f 100644
--- a/client/components/main/layouts.jade
+++ b/client/components/main/layouts.jade
@@ -12,14 +12,15 @@ template(name="userFormsLayout")
section.auth-layout
h1.at-form-landing-logo
img(src="{{pathFor '/wekan-logo.png'}}" alt="Wekan")
- +Template.dynamic(template=content)
- div.at-form-lang
- select.select-lang.js-userform-set-language
- each languages
- if isCurrentLanguage
- option(value="{{tag}}" selected="selected") {{name}}
- else
- option(value="{{tag}}") {{name}}
+ section.auth-dialog
+ +Template.dynamic(template=content)
+ div.at-form-lang
+ select.select-lang.js-userform-set-language
+ each languages
+ if isCurrentLanguage
+ option(value="{{tag}}" selected="selected") {{name}}
+ else
+ option(value="{{tag}}") {{name}}
template(name="defaultLayout")
+header
diff --git a/client/components/users/userForm.styl b/client/components/users/userForm.styl
index 48a6a74e..930efb5a 100644
--- a/client/components/users/userForm.styl
+++ b/client/components/users/userForm.styl
@@ -3,58 +3,61 @@
width: 249px
margin: auto
margin-top: 50px
- margin-top: 17vh
+ margin-bottom: 20px
- .at-form
- margin: auto
+ .auth-dialog
width: 275px
padding: 25px
- margin-top: 20px
- padding-bottom: 10px
+ margin: auto
+ margin-bottom: 20px
background: #fff
border-radius: 3px
border: 1px solid #dbdbdb
border-bottom-color: #c2c2c2
box-shadow: 0 1px 6px rgba(0, 0, 0, .3)
- .at-link
- color: darken(#27AE60, 40%)
-
- label
- margin-bottom: 3px
-
- input
- width: 100%
-
- .at-title
- background: #F7F7F7
- margin: -25px
- padding: 15px 25px 5px
- margin-bottom: 20px
- border-bottom: 1px solid #dcdcdc
- color: darken(white, 70%)
- font-weight: bold
-
- .at-signup-link,
- .at-signin-link,
- .at-forgotPwd
- font-size: 0.9em
- margin-top: 15px
- color: darken(white, 70%)
-
- .at-signUp,
- .at-signIn
+ .at-form
+
+ .at-link
+ color: darken(#27AE60, 40%)
+
+ label
+ margin-bottom: 3px
+
+ input
+ width: 100%
+
+ button
+ width: 100%
+ background: #216694
+ color: #fff
+
+ .at-title
+ background: #F7F7F7
+ margin: -25px
+ padding: 15px 25px 5px
+ margin-bottom: 20px
+ border-bottom: 1px solid #dcdcdc
+ color: darken(white, 70%)
font-weight: bold
- .at-form-lang
- margin: auto
- width: 275px
- padding: 25px
- padding-bottom: 10px
+ .at-signup-link,
+ .at-signin-link,
+ .at-forgotPwd
+ font-size: 0.9em
+ margin-top: 15px
+ color: darken(white, 70%)
- .select-lang
- width: 275px
- font-size: 1.0em
+ .at-signUp,
+ .at-signIn
+ font-weight: bold
+
+ .at-form-lang
+ margin-top: 0px
+
+ .select-lang
+ width: 100%
+ margin-top: 10px
@media screen and (max-width: 800px)
.auth-layout
@@ -64,26 +67,27 @@
padding: 0px
.at-form-landing-logo
- margin-top: 20px
- margin-bottom: 20px
+ width: 125px
+ position: absolute
+ top: 0px
+ right: 20px
+ margin-top: 5px
+ margin-bottom: 5px
- .at-form
+ img
+ width: 125px
+
+ .auth-dialog
width: calc(100% - 50px)
- height: calc(100% - 162px)
- margin: 0px
+ height: calc(100% - 50px)
padding: 25px
-
- button
- width: 100%
-
- .at-form-lang
- width: 100%
+ min-height: 380px
margin: 0px
- padding: 0px
+ margin-bottom: 0px
+ border: 0px
- .select-lang
- width: 200px
- font-size: 1.2em
- position: absolute
- left: calc((100% - 200px)/2)
- bottom: 25px
+ .at-form
+ .at-title
+ h3
+ width: calc(100% - 125px)
+ overflow-x: hidden