Andreas/wekan
1
0
Fork 0
mirror of https://github.com/wekan/wekan.git synced 2025-12-19 08:50:13 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

Optimize login form layout & css

Browse source 
Fixes #448
This commit is contained in:
floatinghotpot 2015-12-28 11:35:38 +08:00
parent f90ac03f6d
commit 55bd26dc9c
2 changed files with 66 additions and 61 deletions
Download patch file Download diff file Expand all files Collapse all files

17
client/components/main/layouts.jade
View file

@ -12,14 +12,15 @@ template(name="userFormsLayout")
section.auth-layout section.auth-layout
h1.at-form-landing-logo h1.at-form-landing-logo
img(src="{{pathFor '/wekan-logo.png'}}" alt="Wekan") img(src="{{pathFor '/wekan-logo.png'}}" alt="Wekan")
+Template.dynamic(template=content) section.auth-dialog
div.at-form-lang +Template.dynamic(template=content)
select.select-lang.js-userform-set-language div.at-form-lang
each languages select.select-lang.js-userform-set-language
if isCurrentLanguage each languages
option(value="{{tag}}" selected="selected") {{name}} if isCurrentLanguage
else option(value="{{tag}}" selected="selected") {{name}}
option(value="{{tag}}") {{name}} else
option(value="{{tag}}") {{name}}
template(name="defaultLayout") template(name="defaultLayout")
+header +header

110
client/components/users/userForm.styl
View file

@ -3,58 +3,61 @@
width: 249px width: 249px
margin: auto margin: auto
margin-top: 50px margin-top: 50px
margin-top: 17vh margin-bottom: 20px
.at-form .auth-dialog
margin: auto
width: 275px width: 275px
padding: 25px padding: 25px
margin-top: 20px margin: auto
padding-bottom: 10px margin-bottom: 20px
background: #fff background: #fff
border-radius: 3px border-radius: 3px
border: 1px solid #dbdbdb border: 1px solid #dbdbdb
border-bottom-color: #c2c2c2 border-bottom-color: #c2c2c2
box-shadow: 0 1px 6px rgba(0, 0, 0, .3) box-shadow: 0 1px 6px rgba(0, 0, 0, .3)
.at-link .at-form
color: darken(#27AE60, 40%)
label .at-link
margin-bottom: 3px color: darken(#27AE60, 40%)
input label
width: 100% margin-bottom: 3px
.at-title input
background: #F7F7F7 width: 100%
margin: -25px
padding: 15px 25px 5px
margin-bottom: 20px
border-bottom: 1px solid #dcdcdc
color: darken(white, 70%)
font-weight: bold
.at-signup-link, button
.at-signin-link, width: 100%
.at-forgotPwd background: #216694
font-size: 0.9em color: #fff
margin-top: 15px
color: darken(white, 70%)
.at-signUp, .at-title
.at-signIn background: #F7F7F7
margin: -25px
padding: 15px 25px 5px
margin-bottom: 20px
border-bottom: 1px solid #dcdcdc
color: darken(white, 70%)
font-weight: bold font-weight: bold
.at-form-lang .at-signup-link,
margin: auto .at-signin-link,
width: 275px .at-forgotPwd
padding: 25px font-size: 0.9em
padding-bottom: 10px margin-top: 15px
color: darken(white, 70%)
.select-lang .at-signUp,
width: 275px .at-signIn
font-size: 1.0em font-weight: bold
.at-form-lang
margin-top: 0px
.select-lang
width: 100%
margin-top: 10px
@media screen and (max-width: 800px) @media screen and (max-width: 800px)
.auth-layout .auth-layout
@ -64,26 +67,27 @@
padding: 0px padding: 0px
.at-form-landing-logo .at-form-landing-logo
margin-top: 20px width: 125px
margin-bottom: 20px position: absolute
top: 0px
right: 20px
margin-top: 5px
margin-bottom: 5px
.at-form img
width: 125px
.auth-dialog
width: calc(100% - 50px) width: calc(100% - 50px)
height: calc(100% - 162px) height: calc(100% - 50px)
margin: 0px
padding: 25px padding: 25px
min-height: 380px
button
width: 100%
.at-form-lang
width: 100%
margin: 0px margin: 0px
padding: 0px margin-bottom: 0px
border: 0px
.select-lang .at-form
width: 200px .at-title
font-size: 1.2em h3
position: absolute width: calc(100% - 125px)
left: calc((100% - 200px)/2) overflow-x: hidden
bottom: 25px