Finalise "swallow the key" illustration and layout

This commit is contained in:
David Benqué 2021-01-08 17:24:54 +00:00
parent 97b0ac4daa
commit 4eef223654
3 changed files with 43 additions and 32 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 73 KiB

View File

@ -21,41 +21,43 @@ define([
h('div.row.cp-page-title', h('h1', Msg.register_header)),
h('div.row.cp-register-det', [
h('div#data.hidden.col-md-6', [
h('img.img-fluid', {
src: '/customize/images/illustration-swallow-the-key.png?' + urlArgs
}),
h('h2', Msg.register_notes_title),
Pages.setHTML(h('div.cp-register-notes'), Msg.register_notes)
]),
h('div#userForm.form-group.hidden.col-md-6', [
h('a', {
href: '/features.html'
}, Msg.register_whyRegister),
h('input.form-control#username', {
type: 'text',
autocomplete: 'off',
autocorrect: 'off',
autocapitalize: 'off',
spellcheck: false,
placeholder: Msg.login_username,
autofocus: true,
h('div.cp-reg-form.col-md-6', [
h('img.img-fluid', {
src: '/customize/images/swallow-the-key.png?' + urlArgs
}),
h('input.form-control#password', {
type: 'password',
placeholder: Msg.login_password,
}),
h('input.form-control#password-confirm', {
type: 'password',
placeholder: Msg.login_confirm,
}),
h('div.checkbox-container', [
UI.createCheckbox('import-recent', Msg.register_importRecent, true)
]),
h('div.checkbox-container', [
$(UI.createCheckbox('accept-terms')).find('.cp-checkmark-label').append(Msg.register_acceptTerms).parent()[0]
]),
h('button#register', Msg.login_register)
])
h('div#userForm.form-group.hidden', [
h('a', {
href: '/features.html'
}, Msg.register_whyRegister),
h('input.form-control#username', {
type: 'text',
autocomplete: 'off',
autocorrect: 'off',
autocapitalize: 'off',
spellcheck: false,
placeholder: Msg.login_username,
autofocus: true,
}),
h('input.form-control#password', {
type: 'password',
placeholder: Msg.login_password,
}),
h('input.form-control#password-confirm', {
type: 'password',
placeholder: Msg.login_confirm,
}),
h('div.checkbox-container', [
UI.createCheckbox('import-recent', Msg.register_importRecent, true)
]),
h('div.checkbox-container', [
$(UI.createCheckbox('accept-terms')).find('.cp-checkmark-label').append(Msg.register_acceptTerms).parent()[0]
]),
h('button#register', Msg.login_register)
])
]),
]),
]),

View File

@ -56,10 +56,19 @@
margin-bottom: 1em;
}
}
.cp-reg-form {
img {
margin-top: 0px;
position: relative;
z-index: 0;
}
}
#userForm {
padding: 15px;
background-color: white;
height: min-content; // XXX why does the form expand without this?
position: relative;
z-index: 2;
margin-bottom: 100px;
.cp-shadow();
.form-control {
border-radius: 0;