turn login and register into infopages
This commit is contained in:
Pierre Bondoerffer
parent
549b1b2c4f
commit
dc0a037894
4 changed files with 99 additions and 35 deletions
|
|
@ -419,12 +419,12 @@ define([
|
|||
return [h('div#cp-main.cp-page-register', [
|
||||
infopageTopbar(),
|
||||
h('div.container.cp-container', [
|
||||
h('div#data.hidden', [
|
||||
h('div.row.align-items-center', [
|
||||
h('div#data.hidden.col-md-6', [
|
||||
h('h1', Msg.register_header),
|
||||
h('br'),
|
||||
setHTML(h('p.left.register-explanation'), Msg.register_explanation)
|
||||
setHTML(h('p.register-explanation'), Msg.register_explanation)
|
||||
]),
|
||||
h('div#userForm.form-group.hidden', [
|
||||
h('div#userForm.form-group.hidden.col-md-6', [
|
||||
h('input.form-control#username', {
|
||||
type: 'text',
|
||||
autocomplete: 'off',
|
||||
|
|
@ -442,34 +442,38 @@ define([
|
|||
type: 'password',
|
||||
placeholder: Msg.login_confirm,
|
||||
}),
|
||||
h('input#import-recent', {
|
||||
type: 'checkbox',
|
||||
checked: true
|
||||
}),
|
||||
h('label', {
|
||||
'for': 'import-recent',
|
||||
}, Msg.register_importRecent),
|
||||
h('br'),
|
||||
h('input#accept-terms', {
|
||||
type: 'checkbox'
|
||||
}),
|
||||
setHTML(h('label', {
|
||||
'for': 'accept-terms',
|
||||
}), Msg.register_acceptTerms),
|
||||
h('br'),
|
||||
h('div.checkbox-container', [
|
||||
h('input#import-recent', {
|
||||
type: 'checkbox',
|
||||
checked: true
|
||||
}),
|
||||
h('label', {
|
||||
'for': 'import-recent',
|
||||
}, Msg.register_importRecent),
|
||||
]),
|
||||
h('div.checkbox-container', [
|
||||
h('input#accept-terms', {
|
||||
type: 'checkbox'
|
||||
}),
|
||||
setHTML(h('label', {
|
||||
'for': 'accept-terms',
|
||||
}), Msg.register_acceptTerms),
|
||||
]),
|
||||
h('button#register.btn.btn-primary', Msg.login_register)
|
||||
])
|
||||
])
|
||||
]),
|
||||
]),
|
||||
infopageFooter(),
|
||||
])];
|
||||
};
|
||||
|
||||
Pages['/login/'] = Pages['/login/index.html'] = function () {
|
||||
return [h('div#main', [
|
||||
h('div.mainOverlay'),
|
||||
h('div#align-container',
|
||||
h('div#main-container', [
|
||||
h('div#data.hidden', setHTML(h('p.left'), Msg.main_info)),
|
||||
h('div#userForm.form-group.hidden', [
|
||||
return [h('div#cp-main.cp-page-login', [
|
||||
infopageTopbar(),
|
||||
h('div.container.cp-container', [
|
||||
h('div.row.align-items-center', [
|
||||
h('div#data.hidden.col-md-6', setHTML(h('p.left'), Msg.main_info)),
|
||||
h('div#userForm.form-group.hidden.col-md-6', [
|
||||
h('input.form-control#name', {
|
||||
name: 'name',
|
||||
type: 'text',
|
||||
|
|
@ -485,14 +489,15 @@ define([
|
|||
'name': 'password',
|
||||
placeholder: Msg.login_password,
|
||||
}),
|
||||
h('button.btn.btn-primary.login.first', Msg.login_login),
|
||||
h('div.extra', [
|
||||
h('p', Msg.login_notRegistered),
|
||||
h('button.btn.btn-primary.login.first', Msg.login_login),
|
||||
h('span', Msg.login_notRegistered),
|
||||
h('button#register.btn.btn-success.register', Msg.login_register)
|
||||
])
|
||||
])
|
||||
])
|
||||
)
|
||||
]),
|
||||
]),
|
||||
infopageFooter(),
|
||||
])];
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
@import (once) "./colortheme.less";
|
||||
|
||||
@infopages_infobar-height: 64px;
|
||||
@infopages_padding: 32px;
|
||||
|
||||
// Basic setup for info pages, this should be used at the global level
|
||||
.infopages_main () {
|
||||
min-height: 100vh;
|
||||
background-color: @colortheme_info-background;
|
||||
|
||||
a {
|
||||
|
|
@ -27,7 +27,35 @@
|
|||
font-family: 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||
|
||||
.cp-container {
|
||||
padding-top: @infopages_infobar-height;
|
||||
margin-top: @infopages_infobar-height;
|
||||
padding-top: @infopages_padding;
|
||||
padding-bottom: @infopages_padding;
|
||||
min-height: 75vh;
|
||||
h1 {
|
||||
font-size: 3em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
.form-group {
|
||||
& > * {
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
.checkbox-container {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
label {
|
||||
margin: 0;
|
||||
}
|
||||
input {
|
||||
margin-right: 0.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -75,4 +103,4 @@
|
|||
.infopages_link()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,17 @@
|
|||
@import (once) "../include/infopages.less";
|
||||
@import (once) "../include/colortheme.less";
|
||||
|
||||
.infopages_main();
|
||||
.infopages_topbar();
|
||||
|
||||
.form-group {
|
||||
.extra {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
width: 100%;
|
||||
.login {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -4,6 +4,20 @@
|
|||
.infopages_main();
|
||||
.infopages_topbar();
|
||||
|
||||
#cp-main.cp-page-register {
|
||||
|
||||
.cp-container {
|
||||
.form-group {
|
||||
.checkbox-container {
|
||||
&:nth-of-type(1) {
|
||||
margin-top: 2em;
|
||||
}
|
||||
&:last-of-type {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
}
|
||||
#register {
|
||||
margin-top: 16px;
|
||||
font-size: 1.25em;
|
||||
width: 30%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue