diff --git a/customize.dist/bkregister.jpg b/customize.dist/bkregister.jpg new file mode 100644 index 000000000..03660433f Binary files /dev/null and b/customize.dist/bkregister.jpg differ diff --git a/customize.dist/pages.js b/customize.dist/pages.js index a5c6982f1..9016d9168 100644 --- a/customize.dist/pages.js +++ b/customize.dist/pages.js @@ -406,10 +406,18 @@ define([ Pages['/register/'] = Pages['/register/index.html'] = function () { return [h('div#cp-main', [ infopageTopbar(), + h('div.container-fluid.cp-register-wel',[ + h('div.container',[ + h('div.row',[ + h('div.col-12',[ + h('h1.text-center', Msg.register_header) + ]) + ]) + ]) + ]), h('div.container.cp-container', [ - h('div.row.align-items-center', [ + h('div.row.align-items-center.cp-register-det', [ h('div#data.hidden.col-md-6', [ - h('h1', Msg.register_header), setHTML(h('p.register-explanation'), Msg.register_explanation) ]), h('div#userForm.form-group.hidden.col-md-6', [ @@ -453,10 +461,18 @@ define([ 'for': 'accept-terms', }), Msg.register_acceptTerms),*/ ]), - h('button#register.btn.btn-primary', Msg.login_register) + h('button#register.btn.cp-login-register', Msg.login_register) ]) ]), + h('div.row.cp-register-test',[ + h('hr'), + h('div.col-12', [ + setHTML(h('p.test-details'), Msg.register_testimonial), + h('a.cp-test-source.pull-right', { href : 'http://boingboing.net/2016/09/26/cryptpad-a-freeopen-end-to.html'}, Msg.register_testimonial_name) + ]) + ]) ]), + infopageFooter(), ])]; }; diff --git a/customize.dist/src/less2/include/colortheme.less b/customize.dist/src/less2/include/colortheme.less index a62800442..4ecafb27a 100644 --- a/customize.dist/src/less2/include/colortheme.less +++ b/customize.dist/src/less2/include/colortheme.less @@ -66,3 +66,5 @@ @cryptpad_color_blue: #4591C4; @cryptpad_color_grey: #999999; +@cryptpad_header_col: #1E1F1F; +@cryptpad_text_col: #3F4141; \ No newline at end of file diff --git a/customize.dist/src/less2/pages/page-index.less b/customize.dist/src/less2/pages/page-index.less index daf84bc3d..90a765a4a 100644 --- a/customize.dist/src/less2/pages/page-index.less +++ b/customize.dist/src/less2/pages/page-index.less @@ -42,7 +42,7 @@ body { &:hover { transform: scale(1.05); } - } + } } .cp-title { display: flex; diff --git a/customize.dist/src/less2/pages/page-register.less b/customize.dist/src/less2/pages/page-register.less index 06a5207c6..c4f5951a3 100644 --- a/customize.dist/src/less2/pages/page-register.less +++ b/customize.dist/src/less2/pages/page-register.less @@ -20,13 +20,110 @@ margin-top: 16px; font-size: 1.25em; width: 30%; + @media (max-width: 500px) { + width: 45%; + } } } + padding-bottom: 3em; + min-height: 5vh; } - .alertify { // workaround for alertify making empty p p:empty { display: none; } } +.cp-register-wel { + padding-top: 6em; + padding-bottom: 20em; + background-image: url(/customize/bkregister.jpg); + background-size: cover; + background-repeat: no-repeat; + background-position: center; + h1 { + font-weight: 700; + color: #fff; + text-shadow: 0 1px 5px rgba(0,0,0,.2); + } +} +.cp-register-det { + margin-top: -7em; + background: #fff; + box-shadow: 0 5px 15px rgba(69,145,196, 0.3); + #data { + background: #4591C4; /* fallback for old browsers */ + background: -webkit-linear-gradient(to right, #FF7C4F, #4592C4); /* Chrome 10-25, Safari 5.1-6 */ + background: linear-gradient(to right, #FF7C4F, #4592C4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ + padding-top: 3em; + padding-bottom: 5em; + padding-left: 30px; + padding-right: 30px; + p { + color: #fff; + li { + margin-bottom: 1em; + } + .fa { + font-size: 1.5em; + padding-right: 10px; + color: #000; + } + } + h3 { + font-weight: 700; + margin-bottom: 1em; + } + } + #userForm { + padding-top: 3em; + padding-bottom: 2em; + .form-control { + border-radius: 0; + color: @cryptpad_text_col; + margin-top: 1em; + &:focus { + border-color: @cryptpad_color_blue; + } + } + .checkbox-container { + color: @cryptpad_text_col; + } + } + .cp-login-register { + color: @cryptpad_color_blue; + background: #fff; + border: 2px solid @cryptpad_color_blue; + border-radius: 0; + &:hover { + transform: scale(1.05); + } + } +} +.cp-register-test { + margin-top: 3em; + hr { + width: 15rem; + border-top: 2px solid @cryptpad_color_blue; + margin-top: 0; + margin-bottom: 2em; + } + p { + margin-bottom: 0; + } + .cp-test-source { + font-style: italic; + } + .test-details { + padding-left: 4em; + background-image: url(/customize/testimonial.svg); + background-repeat: no-repeat; + background-position: left top; + background-size: 3em; + color: @cryptpad_text_col; + } + +} +#cp-main { + background: #fff; +} \ No newline at end of file diff --git a/customize.dist/testimonial.svg b/customize.dist/testimonial.svg new file mode 100644 index 000000000..4c1b0074e --- /dev/null +++ b/customize.dist/testimonial.svg @@ -0,0 +1,19 @@ + + + + +testimonial + + + + + + + diff --git a/customize.dist/translations/messages.js b/customize.dist/translations/messages.js index ec7cac571..a8383a421 100644 --- a/customize.dist/translations/messages.js +++ b/customize.dist/translations/messages.js @@ -404,13 +404,15 @@ define(function () { out.register_header = "Welcome to CryptPad"; out.register_explanation = [ - "

Lets go over a couple things first

", - "