diff --git a/config.example.js b/config.example.js index 749fe4793..43438aea6 100644 --- a/config.example.js +++ b/config.example.js @@ -119,6 +119,7 @@ module.exports = { 'terms', 'about', 'contact', + 'what-is-cryptpad' ], /* Limits, Donations, Subscriptions and Contact diff --git a/customize.dist/CryptPad-white-logo.svg b/customize.dist/CryptPad-white-logo.svg new file mode 100644 index 000000000..120bd9014 --- /dev/null +++ b/customize.dist/CryptPad-white-logo.svg @@ -0,0 +1 @@ +CryptPad white logo \ No newline at end of file diff --git a/customize.dist/alt-favicon.png b/customize.dist/alt-favicon.png index 169ce4ef2..3981f6b84 100644 Binary files a/customize.dist/alt-favicon.png and b/customize.dist/alt-favicon.png differ diff --git a/customize.dist/bg14.jpg b/customize.dist/bg14.jpg new file mode 100644 index 000000000..6bf5956a1 Binary files /dev/null and b/customize.dist/bg14.jpg differ diff --git a/customize.dist/bg3.jpg b/customize.dist/bg3.jpg deleted file mode 100644 index 04d3a04e0..000000000 Binary files a/customize.dist/bg3.jpg and /dev/null differ diff --git a/customize.dist/cryptpad-new-logo-colors-logoonly.png b/customize.dist/cryptpad-new-logo-colors-logoonly.png new file mode 100644 index 000000000..6ad292df0 Binary files /dev/null and b/customize.dist/cryptpad-new-logo-colors-logoonly.png differ diff --git a/customize.dist/fonts/neuropolitical.ttf b/customize.dist/fonts/neuropolitical.ttf new file mode 100644 index 000000000..26bbb63ce Binary files /dev/null and b/customize.dist/fonts/neuropolitical.ttf differ diff --git a/customize.dist/images/aaron.jpg b/customize.dist/images/aaron.jpg new file mode 100644 index 000000000..f746cf7e4 Binary files /dev/null and b/customize.dist/images/aaron.jpg differ diff --git a/customize.dist/images/caleb.jpg b/customize.dist/images/caleb.jpg new file mode 100644 index 000000000..1903d87b9 Binary files /dev/null and b/customize.dist/images/caleb.jpg differ diff --git a/customize.dist/images/drive_screenshot.png b/customize.dist/images/drive_screenshot.png new file mode 100644 index 000000000..b1170561c Binary files /dev/null and b/customize.dist/images/drive_screenshot.png differ diff --git a/customize.dist/images/logo_white.svg b/customize.dist/images/logo_white.svg new file mode 100644 index 000000000..d1cd2bc73 --- /dev/null +++ b/customize.dist/images/logo_white.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/customize.dist/images/pad_screenshot.png b/customize.dist/images/pad_screenshot.png new file mode 100644 index 000000000..cbc837f58 Binary files /dev/null and b/customize.dist/images/pad_screenshot.png differ diff --git a/customize.dist/images/pierre.jpg b/customize.dist/images/pierre.jpg new file mode 100644 index 000000000..fea27c787 Binary files /dev/null and b/customize.dist/images/pierre.jpg differ diff --git a/customize.dist/images/yann.jpg b/customize.dist/images/yann.jpg new file mode 100644 index 000000000..6c5e144fd Binary files /dev/null and b/customize.dist/images/yann.jpg differ diff --git a/customize.dist/main-favicon.png b/customize.dist/main-favicon.png index 54169c07e..354d88ece 100644 Binary files a/customize.dist/main-favicon.png and b/customize.dist/main-favicon.png differ diff --git a/customize.dist/pages.js b/customize.dist/pages.js index b7b94940c..e5977ff8a 100644 --- a/customize.dist/pages.js +++ b/customize.dist/pages.js @@ -2,7 +2,8 @@ define([ '/api/config', '/common/hyperscript.js', '/common/cryptpad-common.js', -], function (Config, h, Cryptpad) { + 'jquery' +], function (Config, h, Cryptpad, $) { var Pages = {}; var Msg = Cryptpad.Messages; var urlArgs = Config.requireConf.urlArgs; @@ -12,168 +13,207 @@ define([ return e; }; - var indexContent = function () { - return [ - h('div.page.category.first#knowmore', [ - h('center', [ - h('h1', Msg.main_howitworks) - ]) - ]), - h('div.page', [ - h('div.info-container', [ - h('div.left.image', [ - h('img', { - src: '/customize/images/zeroknowledge_small.png?' + urlArgs , - alt: 'Zero Knowledge' - }) - ]), - h('div.right', [ - h('h2', Msg.main_zeroKnowledge), - setHTML(h('p'), Msg.main_zeroKnowledge_p) - ]) - ]) - ]), - h('div.page.even', [ - h('div.info-container', [ - h('div.left', [ - h('h2', Msg.main_writeItDown), - h('p', Msg.main_writeItDown_p) + var footerCol = function (title, L, literal) { + return h('div.col', [ + h('ul.list-unstyled', [ + h('li.title', { + 'data-localization': title, + }, title? Msg[title]: literal ) + ].concat(L.map(function (l) { + return h('li', [ l ]); + })) + ) + ]); + }; + + var footLink = function (ref, loc, text) { + var attrs = { + href: ref, + }; + if (!/^\//.test(ref)) { + attrs.target = '_blank'; + attrs.rel = 'noopener noreferrer'; + } + if (loc) { + attrs['data-localization'] = loc; + text = Msg[loc]; + } + return h('a', attrs, text); + }; + + var infopageFooter = function () { + return h('footer', [ + h('div.container', [ + h('div.row', [ + footerCol(null, [ + footLink('/about.html', 'about'), + footLink('/terms.html', 'terms'), + footLink('/privacy.html', 'privacy'), + ], 'CryptPad'), + footerCol('footer_applications', [ + footLink('/drive/', 'main_drive'), + footLink('/pad/', 'main_richText'), + footLink('/code/', 'main_code'), + footLink('/slide/', 'main_slide'), + footLink('/poll/', 'main_poll'), + footLink('/whiteboard/', null, Msg.type.whiteboard) ]), - h('div.right.image', [ - h('img', { - alt: "User account", - src: '/customize/images/realtime_small.png?' + urlArgs, - }) - ]) - ]) - ]), - h('div.page', [ - h('div.info-container', [ - h('div.left.image', [ - h('img', { - src: '/customize/images/key_small.png?' + urlArgs, - alt: 'User account' - }) + footerCol('footer_aboutUs', [ + footLink('https://blog.cryptpad.fr', 'blog'), + footLink('https://labs.xwiki.com', null, 'XWiki Labs'), + footLink('http://www.xwiki.com', null, 'XWiki SAS'), + footLink('https://www.open-paas.org', null, 'OpenPaaS') ]), - h('div.right', [ - h('h2', Msg.main_share), - h('p', Msg.main_share_p) + footerCol('footer_contact', [ + footLink('https://riot.im/app/#/room/#cryptpad:matrix.org', null, 'Chat'), + footLink('https://twitter.com/cryptpad', null, 'Twitter'), + footLink('https://github.com/xwiki-labs/cryptpad', null, 'GitHub'), + footLink('/contact.html', null, 'Email') ]) ]) ]), - h('div.page.even', [ - h('div.info-container', [ - h('div.left', [ - h('h2', Msg.main_organize), - h('p', Msg.main_organize_p) - ]), - h('div.right.image', [ - h('img', { - src: '/customize/images/organize.png?' + urlArgs, - alt: 'User account' - }) - ]) - ]) - ]) - ]; + h('div.cp-version-footer', "CryptPad v1.13.0 (Naiad)") + ]); }; Pages['/about.html'] = function () { - return h('div#main_other', [ - h('center', [ - h('h1', Msg.about) + return h('div#cp-main.cp-page-about', [ + infopageTopbar(), + h('div.container.cp-container', [ + h('center', [ + h('h1', Msg.about) + ]), + setHTML(h('p'), 'CryptPad is created inside of the Research Team at XWiki SAS, a small business located in Paris France and Iasi Romania. There are 3 core team members working on CryptPad plus a number of contributors both inside and outside of XWiki SAS.'), + h('h2', 'Core Developers'), + h('div.row', [ + h('div.col-md-4', [ + h('img.bio-avatar', {'src': '/customize/images/aaron.jpg'}), + h('h3', "Aaron MacSween"), + setHTML(h('div#bio'), '

Aaron transitioned into distributed systems development from a background in jazz and live stage performance.

He appreciates the elegance of biological systems and functional programming, and focused on both as a student at the University of Toronto, where he studied cognitive and computer sciences.

He moved to Paris in 2015 to work as a research engineer at XWiki SAS, after having dedicated significant time to various cryptography-related software projects.

He spends his spare time experimenting with guitars, photography, science fiction, and spicy food.

') + ]), + h('div.col-md-4', [ + h('img.bio-avatar', {'src': '/customize/images/caleb.jpg'}), + h('h3', "Caleb James Delisle"), + setHTML(h('div#bio'), '

Caleb is a cryptography developer, Machine Technology graduate of the Franklin County Technical School and lifelong tinkerer.

In 2011, he started the cjdns Open Source project to show that secure networking could be invisible and easily deployed.

After joining XWiki SAS in 2014, he started the CryptPad project with the intent of bringing the same transparent security to collaborative editing.

He\'s always trying to learn from more experienced colleagues and when someone passes through the Research Team office, his favorite words are "Pull up a chair!".

') + ]), + h('div.col-md-4', [ + h('img.bio-avatar', {'src': '/customize/images/yann.jpg'}), + h('h3', "Yann Flory"), + setHTML(h('div#bio'), '

Yann is a mysterious person.

') + ]), + ]), + h('h2', 'Key Contributors'), + h('div.row', [ + h('div.col-md-4', [ + h('img.bio-avatar', {'src': '/customize/images/pierre.jpg'}), + h('h3', "Pierre Bondoerffer"), + setHTML(h('div#bio'), '

Resident CSS wizard and emoji extraordinaire, Pierre is passionate about anything related to technology. He loves to hack around computers and put parts together.

He is currently studying at 42, where he learns about algorithms, networking, kernel programming and graphics.

As a part of an internship, he joined XWiki SAS and worked on CryptPad to improve user experience. He also maintains the Spanish translation.

') + ]), + h('div.col-md-4', [ + h('img.bio-avatar', {'src': '/customize/images/avatar.png'}), + h('h3', "Catalin Scripcariu"), + setHTML(h('div#bio'), '') + ]), + h('div.col-md-4', [ + h('img.bio-avatar', {'src': '/customize/images/avatar.png'}), + h('h3', "Ludovic Dubost"), + setHTML(h('div#bio'), '') + ]) + ]), ]), - setHTML(h('p'), Msg.main_p2), - h('h2', Msg.main_howitworks), - setHTML(h('p'), Msg.main_howitworks_p1) - ].concat(indexContent())); + infopageFooter() + ]); }; Pages['/privacy.html'] = function () { - return h('div#main_other', [ - h('center', h('h1', Msg.policy_title)), - h('h2', Msg.policy_whatweknow), - h('p', Msg.policywhatweknow_p1), + return h('div#cp-main.cp-page-privacy', [ + infopageTopbar(), + h('div.container.cp-container', [ + h('center', h('h1', Msg.policy_title)), + h('h2', Msg.policy_whatweknow), + h('p', Msg.policywhatweknow_p1), - h('h2', Msg.policy_howweuse), - h('p', Msg.policy_howweuse_p1), - h('p', Msg.policy_howweuse_p2), + h('h2', Msg.policy_howweuse), + h('p', Msg.policy_howweuse_p1), + h('p', Msg.policy_howweuse_p2), - h('h2', Msg.policy_whatwetell), - h('p', Msg.policy_whatwetell_p1), + h('h2', Msg.policy_whatwetell), + h('p', Msg.policy_whatwetell_p1), - h('h2', Msg.policy_links), - h('p', Msg.policy_links_p1), + h('h2', Msg.policy_links), + h('p', Msg.policy_links_p1), - h('h2', Msg.policy_ads), - h('p', Msg.policy_ads_p1), + h('h2', Msg.policy_ads), + h('p', Msg.policy_ads_p1), - h('h2', Msg.policy_choices), - h('p', Msg.policy_choices_open), - setHTML(h('p'), Msg.policy_choices_vpn), - - h('br') + h('h2', Msg.policy_choices), + h('p', Msg.policy_choices_open), + setHTML(h('p'), Msg.policy_choices_vpn), + ]), + infopageFooter() ]); }; Pages['/terms.html'] = function () { - return h('div#main_other', [ - h('center', h('h1', Msg.tos_title)), - h('p', Msg.tos_legal), - h('p', Msg.tos_availability), - h('p', Msg.tos_e2ee), - h('p', Msg.tos_logs), - h('p', Msg.tos_3rdparties), + return h('div#cp-main.cp-page-terms', [ + infopageTopbar(), + h('div.container.cp-container', [ + h('center', h('h1', Msg.tos_title)), + h('p', Msg.tos_legal), + h('p', Msg.tos_availability), + h('p', Msg.tos_e2ee), + h('p', Msg.tos_logs), + h('p', Msg.tos_3rdparties), + ]), + infopageFooter() ]); }; Pages['/contact.html'] = function () { - return h('div#main_other', [ - h('center', h('h1', Msg.contact)), - setHTML(h('p'), Msg.main_about_p2) + return h('div#cp-main.cp-page-contact', [ + infopageTopbar(), + h('div.container.cp-container', [ + h('center', h('h1', Msg.contact)), + setHTML(h('p'), Msg.main_about_p2) + ]), + infopageFooter(), ]); }; - var userForm = function () { - return h('div#userForm.form-group.hidden', [ - h('input#name.form-control', { - name: 'name', - type: 'text', - placeholder: Msg.login_username - }), - h('input#password.form-control', { - name: 'password', - type: 'password', - placeholder: Msg.login_password - }), - h('div', { - style: { display: 'none' } - }, [ - h('span.remember.form-check', [ - h('label.form-check-label', { - 'for': 'rememberme', - placeholder: Msg.login_remember, - }, [ - h('input#rememberme.form-check-input', { - type: 'checkbox', - checked: true - }) - ]) - ]) + Pages['/what-is-cryptpad.html'] = function () { + return h('div#cp-main.cp-page-what-is-cryptpad', [ + infopageTopbar(), + h('div.container.cp-container', [ + h('center', h('h1', Msg.whatis_title)), + setHTML(h('h2'), Msg.whatis_collaboration), + setHTML(h('p'), Msg.whatis_collaboration_p1), + h('img', { src: '/customize/images/pad_screenshot.png?' + urlArgs }), + setHTML(h('p'), Msg.whatis_collaboration_p2), + setHTML(h('p'), Msg.whatis_collaboration_p3), + setHTML(h('h2'), Msg.whatis_zeroknowledge), + h('div.row', [ + h('div.col-md-4.align-self-center', [ + h('img#zeroknowledge', { src: '/customize/images/zeroknowledge_small.png?' + urlArgs }), + ]), + h('div.col-md-8', [ + setHTML(h('p'), Msg.whatis_zeroknowledge_p1), + setHTML(h('p'), Msg.whatis_zeroknowledge_p2), + setHTML(h('p'), Msg.whatis_zeroknowledge_p3), + ]), + ]), + setHTML(h('h2'), Msg.whatis_drive), + setHTML(h('p'), Msg.whatis_drive_p1), + h('img', { src: '/customize/images/drive_screenshot.png?' + urlArgs }), + setHTML(h('p'), Msg.whatis_drive_p2), + setHTML(h('p'), Msg.whatis_drive_p3), + setHTML(h('h2'), Msg.whatis_business), + setHTML(h('p'), Msg.whatis_business_p1), + setHTML(h('p'), Msg.whatis_business_p2), ]), - h('button.btn.btn-secondary.login.half.first', Msg.login_login), - h('button.btn.btn-success.register.half', Msg.login_register), - h('p.separator', Msg.login_orNoLogin), - h('p#buttons.buttons'), - h('p.driveLink', [ - h('a.gotodrive', { - href: '/drive/' - }, Msg.login_nologin) - ]) + infopageFooter(), ]); }; - var appButton = function (alt, h2, img, p, url, btn, id) { return h('div.app', [ h('center', [ @@ -194,84 +234,95 @@ define([ ]); }; - var tryIt = function () { - return [ - h('div.class.category#tryit', [ - h('center', [ - h('h1', Msg.tryIt) - ]) - ]), - h('div.page', [ - h('div.app-container', [ - h('div.app-row', [ - appButton("Rich Text application", - Msg.main_richText, - '/customize/images/pad.png?' + urlArgs, - Msg.main_richText_p, - '/pad/', - Msg.button_newpad, - 'create-pad'), - appButton('Code application', - Msg.main_code, - '/customize/images/code.png?' + urlArgs, - Msg.main_code_p, - '/code/', - Msg.button_newcode, - 'create-code'), - appButton('Slide application', - Msg.main_slide, - '/customize/images/slide.png?' + urlArgs, - Msg.main_slide_p, - '/slide/', - Msg.button_newslide, - 'create-slide'), - appButton('Poll application', - Msg.main_poll, - '/customize/images/poll.png?' + urlArgs, - Msg.main_poll_p, - '/poll/', - Msg.button_newpoll, - 'create-poll') - ]) - ]) + var infopageTopbar = function () { + return h('div.cp-topbar', + h('div', + h('a.navbar-brand', { href: 'index.html'}, [ + h( 'img', { src: '/customize/CryptPad-white-logo.svg' }) ]) - ]; + ), + h('div.navbar.navbar-toggleable-md.navbar-light.navbar-inverse', + h('button.navbar-toggler.navbar-toggler-right', {'type':'button'}, {'data-toggle':'collapse'}, {'data-target':'#menuCollapse'}, {'aria-controls': 'menuCollapse'}, {'aria-expanded':'false'}, {'aria-label':'Toggle navigation'}, + [h('i.fa.fa-bars ') + ]), + h('div.collapse.navbar-collapse.justify-content-end.flex-column#menuCollapse', [ + h('a.nav-item.nav-link', { href: '/what-is-cryptpad.html'}, Msg.topbar_whatIsCryptpad), + h('a.nav-item.nav-link', { href: 'https://blog.cryptpad.fr/'}, Msg.blog), + h('a.nav-item.nav-link', { href: '/contact.html'}, Msg.contact), + h('a.nav-item.nav-link', { href: '/about.html'}, Msg.about), + h('a.cp-login-btn', { href: '/login'}, Msg.login_login), + h('a.cp-register-btn', { href: '/register'}, Msg.login_register) + ]) + ) + ); }; Pages['/'] = Pages['/index.html'] = function () { + var showingMore = false; 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#cp-main.cp-page-index', [ + infopageTopbar(), + h('div.container.cp-container', [ + h('div.row', [ + h('div.cp-title.col-12.col-sm-6', [ + h('img', { src: '/customize/cryptpad-new-logo-colors-logoonly.png?' + urlArgs }), + h('h1', 'CryptPad'), + h('p', Msg.main_catch_phrase) ]), - userForm(), - h('div#loggedIn.hidden', [ - h('p#loggedInHello'), - h('p', [ - h('button.btn.btn-primary.gotodrive', Msg.login_accessDrive), - ]), - h('p', [ - h('button#loggedInLogout.btn.btn-secondary', Msg.logoutButton) + h('div.col-12.col-sm-6', [ + [ + [ 'pad', '/pad/', Msg.main_richTextPad, 'fa-file-word-o' ], + [ 'code', '/code/', Msg.main_codePad, 'fa-file-code-o' ], + [ 'slide', '/slide/', Msg.main_slidePad, 'fa-file-powerpoint-o' ], + [ 'poll.cp-more.cp-hidden', '/poll/', Msg.main_pollPad, 'fa-calendar' ], + [ 'whiteboard.cp-more.cp-hidden', '/whiteboard/', Msg.main_whiteboardPad, 'fa-paint-brush' ], + [ 'recent.cp-more.cp-hidden', '/drive/', Msg.main_recentPads, 'fa-hdd-o' ] + ].map(function (x) { + return h('a', [ + { href: x[1] }, + h('div.bs-callout.cp-callout-' + x[0], [ + h('i.fa.' + x[3]), + h('div', [ h('h4', x[2]) ]) + ]) + ]); + }), + h('div.bs-callout.cp-callout-more', [ + h('div.cp-callout-more-lessmsg.cp-hidden', [ + "see less ", + h('i.fa.fa-caret-up') + ]), + h('div.cp-callout-more-moremsg', [ + "see more ", + h('i.fa.fa-caret-down') + ]), + { + onclick: function () { + if (showingMore) { + $('.cp-more, .cp-callout-more-lessmsg').addClass('cp-hidden'); + $('.cp-callout-more-moremsg').removeClass('cp-hidden'); + } else { + $('.cp-more, .cp-callout-more-lessmsg').removeClass('cp-hidden'); + $('.cp-callout-more-moremsg').addClass('cp-hidden'); + } + showingMore = !showingMore; + } + } ]) ]) ]) ]), ]) - ] - .concat(tryIt()); + ]; }; var loadingScreen = function () { return h('div#loading', h('div.loadingContainer', [ h('img.cryptofist', { - src: '/customize/cryptofist_small.png?' + urlArgs + src: '/customize/cryptpad-new-logo-colors-logoonly.png?' + urlArgs }), h('div.spinnerContainer', - h('span.fa.fa-spinner.fa-pulse.fa-4x.fa-fw')), + h('span.fa.fa-circle-o-notch.fa-spin.fa-4x.fa-fw')), h('p', Msg.loading) ]) ); @@ -283,15 +334,15 @@ define([ }; Pages['/register/'] = Pages['/register/index.html'] = function () { - return [h('div#main', [ - h('div.mainOverlay'), - h('div#align-container', [ - h('div#data.hidden', [ + return [h('div#cp-main.cp-page-register', [ + infopageTopbar(), + h('div.container.cp-container', [ + 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', @@ -309,34 +360,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', @@ -352,14 +407,14 @@ 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('button#register.btn.btn-success.register', Msg.login_register) ]) ]) - ]) - ) + ]), + ]), + infopageFooter(), ])]; }; diff --git a/customize.dist/src/less/loading.less b/customize.dist/src/less/loading.less index 3f2ac0381..cf93330cb 100644 --- a/customize.dist/src/less/loading.less +++ b/customize.dist/src/less/loading.less @@ -19,6 +19,7 @@ margin-left: auto; margin-right: auto; height: 300px; + margin-bottom: 2em; @media screen and (max-height: @media-short-screen) { display: none; } diff --git a/customize.dist/src/less/toolbar.less b/customize.dist/src/less/toolbar.less index 80537d534..f6ac5b1ac 100644 --- a/customize.dist/src/less/toolbar.less +++ b/customize.dist/src/less/toolbar.less @@ -821,13 +821,16 @@ body .cryptpad-toolbar { } a.cryptpad-logo { cursor: pointer; - font-size: 1em; - height: auto; - padding: 0px 5px; + display: inline-flex; text-decoration: none; + height: auto; + padding: 10px; - // hack because of whiteboard and poll - color: white !important; + img { + cursor: pointer; + height: 100%; + width: 100%; + } } } .cryptpad-user { diff --git a/customize.dist/src/less/variables.less b/customize.dist/src/less/variables.less index 5e089d7f7..ccd1f065f 100644 --- a/customize.dist/src/less/variables.less +++ b/customize.dist/src/less/variables.less @@ -1,3 +1,5 @@ +@import (once) '../less2/include/colortheme.less'; + @base: #fff; //#f5f5f5; @dark-base: darken(@base, 20%); @less-dark-base: darken(@base, 10%); @@ -62,7 +64,7 @@ @slide-default-bg: #000; -@bg-loading: @old-base; +@bg-loading: #222; @color-loading: @old-fore; @media-not-big: 800px; @@ -85,28 +87,28 @@ @toolbar-button-font: @dropdown-font; -@toolbar-pad-bg: #1c4fa0; -@toolbar-pad-color: #fff; -@toolbar-slide-bg: #e57614; -@toolbar-slide-color: #fff; -@toolbar-code-bg: #ffae00; -@toolbar-code-color: #000; -@toolbar-poll-bg: #006304; -@toolbar-poll-color: #fff; -@toolbar-whiteboard-bg: #800080; -@toolbar-whiteboard-color: #fff; -@toolbar-drive-bg: #0087ff; -@toolbar-drive-color: #fff; -@toolbar-file-bg: #cd2532; -@toolbar-file-color: #fff; -@toolbar-friends-bg: #607B8D; -@toolbar-friends-color: #fff; -@toolbar-default-bg: #ddd; -@toolbar-default-color: #000; -@toolbar-settings-bg: #0087ff; -@toolbar-settings-color: #fff; -@toolbar-profile-bg: #0087ff; -@toolbar-profile-color: #fff; +@toolbar-pad-bg: @colortheme_pad-bg; +@toolbar-pad-color: @colortheme_pad-color; +@toolbar-slide-bg: @colortheme_slide-bg; +@toolbar-slide-color: @colortheme_slide-color; +@toolbar-code-bg: @colortheme_code-bg; +@toolbar-code-color: @colortheme_code-color; +@toolbar-poll-bg: @colortheme_poll-bg; +@toolbar-poll-color: @colortheme_poll-color; +@toolbar-whiteboard-bg: @colortheme_whiteboard-bg; +@toolbar-whiteboard-color: @colortheme_whiteboard-color; +@toolbar-drive-bg: @colortheme_drive-bg; +@toolbar-drive-color: @colortheme_drive-color; +@toolbar-file-bg: @colortheme_file-bg; +@toolbar-file-color: @colortheme_file-color; +@toolbar-friends-bg: @colortheme_friends-bg; +@toolbar-friends-color: @colortheme_friends-color; +@toolbar-default-bg: @colortheme_default-bg; +@toolbar-default-color: @colortheme_default-color; +@toolbar-settings-bg: @colortheme_settings-bg; +@toolbar-settings-color: @colortheme_settings-color; +@toolbar-profile-bg: @colortheme_profile-bg; +@toolbar-profile-color: @colortheme_profile-color; @toolbar-todo-bg: #7bccd1; @toolbar-todo-color: #000; @@ -124,7 +126,7 @@ @main-block-bg: rgba(200, 200, 200, 0.3); @main-color: #fff; -@main-bg: url('/customize/bg3.jpg') no-repeat center center; +@main-bg: url('/customize/bg4.jpg') no-repeat center center; @category-bg: #f4f4f4; diff --git a/customize.dist/src/less2/include/colortheme.less b/customize.dist/src/less2/include/colortheme.less new file mode 100644 index 000000000..3ece30827 --- /dev/null +++ b/customize.dist/src/less2/include/colortheme.less @@ -0,0 +1,37 @@ +@colortheme_link-color: #0275D8; +@colortheme_link-color-visited: #005999; +@colortheme_info-background: #fafafa; + + +@colortheme_pad-bg: #1c4fa0; +@colortheme_pad-color: #fff; + +@colortheme_slide-bg: #e57614; +@colortheme_slide-color: #fff; + +@colortheme_code-bg: #ffae00; +@colortheme_code-color: #000; + +@colortheme_poll-bg: #006304; +@colortheme_poll-color: #fff; + +@colortheme_whiteboard-bg: #800080; +@colortheme_whiteboard-color: #fff; + +@colortheme_drive-bg: #0087ff; +@colortheme_drive-color: #fff; + +@colortheme_file-bg: #cd2532; +@colortheme_file-color: #fff; + +@colortheme_friends-bg: #607B8D; +@colortheme_friends-color: #fff; + +@colortheme_default-bg: #ddd; +@colortheme_default-color: #000; + +@colortheme_settings-bg: #0087ff; +@colortheme_settings-color: #fff; + +@colortheme_profile-bg: #0087ff; +@colortheme_profile-color: #fff; \ No newline at end of file diff --git a/customize.dist/src/less2/include/infopages.less b/customize.dist/src/less2/include/infopages.less new file mode 100644 index 000000000..dfc4108ba --- /dev/null +++ b/customize.dist/src/less2/include/infopages.less @@ -0,0 +1,161 @@ +@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 () { + background-color: @colortheme_info-background; + + a { + color: @colortheme_link-color; + &:visited { color: @colortheme_link-color-visited; } + //opacity: 0.8; + //transition: opacity 0.2s; + } + a:hover { + opacity: 1; + } + + border: 0; + padding: 0; + margin: 0; + + font-size: 14px; + font-family: 'Open Sans', 'Helvetica Neue', sans-serif; + + .cp-container { + font-size: 16px; + margin-top: @infopages_infobar-height; + padding-top: @infopages_padding; + padding-bottom: @infopages_padding; + min-height: 75vh; + h1 { + font-size: 3em; + margin-bottom: 0.5em; + } + h2 { + font-size: 2em; + margin-top: 1em; + margin-bottom: 0.5em; + } + h3 { + font-size: 1.5em; + margin-top: 1em; + margin-bottom: 0.5em; + } + + img { + &.left { + float: left; + } + + max-width: 100%; + } + + .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; + } + } + } + } + + footer { + background-color: white; + + .container { + .col { + margin-top: 1em; + } + + width: 100%; + text-align: center; + margin-bottom: 1em; + + ul.list-unstyled { + margin: 0; + } + } + + .cp-version-footer { + background-color: @colortheme_info-background; + color: black; + text-align: center; + padding: 0.5em; + } + } +}; + +.infopages_link () { + text-decoration: none; + color: #0275D8; + cursor: pointer; + display: inline-flex; + &:hover { + transform: scale(1.05); + } +} + +// Apply this to the top bar div +.infopages_topbar () { + .cp-topbar { + background: #fff; + z-index: 9001; + position: fixed; + top: 0; + + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + + box-sizing: border-box; + width: 100%; + height: @infopages_infobar-height; + padding-left: 0.5em; + padding-right: 0.5em; + vertical-align: middle; + font-size: 1.25em; + line-height: 1.25em; + + cursor: default; + user-select: none; + -moz-user-select: none; + -webkit-user-select: none; + -ms-user-select: none; + + .navbar-nav { + display: flex; + align-items: center; + } + + a { + font-weight: 500; + padding: 0.6em; + .infopages_link() + } + + .cp-logo { + img { + height: @infopages_infobar-height / 2; + } + margin-right: 0.5em; + } + } +} diff --git a/customize.dist/src/less2/main.less b/customize.dist/src/less2/main.less new file mode 100644 index 000000000..068db5c7e --- /dev/null +++ b/customize.dist/src/less2/main.less @@ -0,0 +1,12 @@ +@font-face { + font-family: Neuropolitical; + src: url(./customize/fonts/neuropolitical.ttf) +} +div#cp-main.cp-page-index { @import "./pages/page-index.less"; } +div#cp-main.cp-page-contact { @import "./pages/page-contact.less"; } +div#cp-main.cp-page-login { @import "./pages/page-login.less"; } +div#cp-main.cp-page-register { @import "./pages/page-register.less"; } +div#cp-main.cp-page-what-is-cryptpad { @import "./pages/page-what-is-cryptpad.less"; } +div#cp-main.cp-page-about { @import "./pages/page-about.less"; } +div#cp-main.cp-page-privacy { @import "./pages/page-privacy.less"; } +div#cp-main.cp-page-terms { @import "./pages/page-terms.less"; } diff --git a/customize.dist/src/less2/pages/page-about.less b/customize.dist/src/less2/pages/page-about.less new file mode 100644 index 000000000..7e9cb81a4 --- /dev/null +++ b/customize.dist/src/less2/pages/page-about.less @@ -0,0 +1,12 @@ +@import (once) "../include/infopages.less"; +@import (once) "../include/colortheme.less"; + +.infopages_main(); +.infopages_topbar(); + +.bio-avatar { + border-radius: 50%; + margin: 1em 0; + max-width: 300px; + max-height: 300px; +} diff --git a/customize.dist/src/less2/pages/page-contact.less b/customize.dist/src/less2/pages/page-contact.less new file mode 100644 index 000000000..56a60022c --- /dev/null +++ b/customize.dist/src/less2/pages/page-contact.less @@ -0,0 +1,9 @@ +@import (once) "../include/infopages.less"; +@import (once) "../include/colortheme.less"; + +.infopages_main(); +.infopages_topbar(); + +.fa { + padding-right: 0.25em; +} diff --git a/customize.dist/src/less2/pages/page-index.less b/customize.dist/src/less2/pages/page-index.less new file mode 100644 index 000000000..82832f792 --- /dev/null +++ b/customize.dist/src/less2/pages/page-index.less @@ -0,0 +1,229 @@ +//@import (once) "./variables.less"; + +@import (once) "../include/infopages.less"; +@import (once) "../include/colortheme.less"; + + +.infopages_main(); +.infopages_topbar(); + +@background_lighter: rgba(0,0,0,0.1); +@background_darker: rgba(0,0,0,0.4); +&#cp-main { + color: #FFF; + background: linear-gradient( @background_darker, @background_lighter ), url('/customize/bg14.jpg'); + background-size: cover; + min-height: 100vh; + display: flex; + flex-direction: column; + justify-content: space-around; + align-items: center; + .container { + @media only screen and (max-device-width : 576px) { + margin-top: 6em; + } + } +} +.cp-right { + .cp-register-btn { + padding: 0.5em 1em 0.7em 1em; + border: 2px solid #fff; + &:hover { + transform: scale(1.05); + } + } + .cp-login-btn { + color: #fff; + padding: 0.5em 1em 0.7em 1em; + &:hover { + transform: scale(1.05); + } + } +} +.cp-title { + display: flex; + align-items: center; + flex-direction: column; + margin-top: 1.5em; + img { + height: 20vh; + margin-bottom: 1.5em; + } + margin-left: 0; + h1 { + font-family: "Neuropolitical"; + //font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", Times, serif; + //font-family: "Raleway"; + font-size: 45px; + } + p { + //font-family: "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; + font-size: 20px; + //font-style: italic; + } +} +.cp-topbar { + //position: absolute; + background: transparent; + a { + color: #fff; + padding: 0.5em 0.5em 0.5em 0.5em; + } + button:focus { + outline: none; + } + .collapse { + a { + display: block; + } + } + .navbar-toggler-left { + top: -0.59rem; + } + .cp-left { + .fa-bars { + font-size: 1.6rem; + } + } + a.cp-logo { + display: none; + } + img { + height: 5vh; + margin-top: -4px; + } + &:hover { + img { + transform: none; + } + }; + a.cp-logo { + display: none; + } +} +@callout-padding: 15px; +a:hover { + text-decoration: none +} +.bs-callout { + display: flex; + align-items: stretch; + margin: 25px 0; + background:rgba(255,255,255,0.6); + color: black; + transition: all .1s ease-in-out; + box-sizing: border-box; + height: 5em; + position: relative; + a { + color: black; + &:hover { text-decoration-line: none; } + } + div { + @media only screen and (min-device-width: 576px) and (max-device-width: 767px) { + left: 4.5em !important; + } + } +} +h4 { + margin: 0; +} +.cp-callout-more-moremsg,.cp-callout-more-lessmsg { + transform: none !important; +} +.bs-callout div { + display: flex; + align-items: center; + justify-content: center; + height: 100%; + position: absolute; + left: 5em; +} +.bs-callout+.bs-callout { + margin-top: -5px; +} + +.bs-callout:hover { + //color: white; + transform: scale(1.05); + cursor: pointer; +} +.bs-callout:hover .fa { + //width: 100%; +} +.bs-callout:hover.cp-callout-more { + transform: none !important; +} +.bs-callout .fa { + display: flex; + align-items: center; + font-size: 2em; + padding-left: 0.57em; + width: 2em; + transition: width 0.1s; + color: #fff; +} +.cp-callout-pad .fa { background-color: @colortheme_pad-bg; } +.cp-callout-code .fa { background-color: @colortheme_code-bg; } +.cp-callout-slide .fa { background-color: @colortheme_slide-bg; } +.cp-callout-poll .fa { background-color: @colortheme_poll-bg; } +.cp-callout-whiteboard .fa { background-color: @colortheme_whiteboard-bg; } +.cp-callout-recent .fa { background-color: @colortheme_drive-bg; } +.cp-hidden { display: none !important; } +.cp-callout-more { + width: auto; + display: inline-block; + align-content: center; + height: 2em; + border-radius: 1em; + margin-left: auto; + margin-right: auto; + margin-top: 0; + background: none; + width: 100%; + div { + .infopages_link(); + color: #fff; + .fa { + font-size: inherit; + padding: 0; + width: 1em; + padding-left: 5px; + } + } +} +.navbar-inverse .navbar-toggler { + border-color: transparent; + margin-top: -12px; + padding: 0; +} +@media (min-width: 576px) and (max-width: 767px) { + .container { + padding-left: 0; + padding-right: 0; + } + div#cp-main.cp-page-index .cp-topbar .navbar-toggler-left { + left: 5px; + } +} +@media (max-width: 991px) { + #menuCollapse { + /*position: absolute; + left: -131px;*/ + margin-top: 0.5em; + text-align: right; + } + #menuCollapse a { + width: 100%; + text-align: right; + } + .navbar-nav a { + text-align: right !important; + } + .cp-right .cp-login-btn { + padding: 0.5em; + } +} +.collapsing a { + text-align: right !important; +} diff --git a/customize.dist/src/less2/pages/page-login.less b/customize.dist/src/less2/pages/page-login.less new file mode 100644 index 000000000..6909ecdc7 --- /dev/null +++ b/customize.dist/src/less2/pages/page-login.less @@ -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 { + } + } +} diff --git a/customize.dist/src/less2/pages/page-privacy.less b/customize.dist/src/less2/pages/page-privacy.less new file mode 100644 index 000000000..59fa4b1fd --- /dev/null +++ b/customize.dist/src/less2/pages/page-privacy.less @@ -0,0 +1,5 @@ +@import (once) "../include/infopages.less"; +@import (once) "../include/colortheme.less"; + +.infopages_main(); +.infopages_topbar(); diff --git a/customize.dist/src/less2/pages/page-register.less b/customize.dist/src/less2/pages/page-register.less new file mode 100644 index 000000000..e057e2b20 --- /dev/null +++ b/customize.dist/src/less2/pages/page-register.less @@ -0,0 +1,23 @@ +@import (once) "../include/infopages.less"; +@import (once) "../include/colortheme.less"; + +.infopages_main(); +.infopages_topbar(); + +.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%; + } + } +} diff --git a/customize.dist/src/less2/pages/page-terms.less b/customize.dist/src/less2/pages/page-terms.less new file mode 100644 index 000000000..59fa4b1fd --- /dev/null +++ b/customize.dist/src/less2/pages/page-terms.less @@ -0,0 +1,5 @@ +@import (once) "../include/infopages.less"; +@import (once) "../include/colortheme.less"; + +.infopages_main(); +.infopages_topbar(); diff --git a/customize.dist/src/less2/pages/page-what-is-cryptpad.less b/customize.dist/src/less2/pages/page-what-is-cryptpad.less new file mode 100644 index 000000000..b57517a01 --- /dev/null +++ b/customize.dist/src/less2/pages/page-what-is-cryptpad.less @@ -0,0 +1,9 @@ +@import (once) "../include/infopages.less"; +@import (once) "../include/colortheme.less"; + +.infopages_main(); +.infopages_topbar(); + +img#zeroknowledge { + width: 100%; +} diff --git a/customize.dist/src/less2/readme.md b/customize.dist/src/less2/readme.md new file mode 100644 index 000000000..08a26ec9b --- /dev/null +++ b/customize.dist/src/less2/readme.md @@ -0,0 +1,20 @@ +# CryptPad Styling + +How it works: +* In this example, we use the index page, for each page we will have a corresponding class name and a corresponding less file. +* The index page has a main div containing everything `
` +* There is a corresponding less file called `less2/pages/page-index.less` +* Finally there is a corresponding line in main.less which imports that less file: `div#main.cp-page-index { @import "./pages/page-index.less"; }` + * cp-page-index class means: + * cp -> cryptpad + * page -> this is a style for accessing a page's less file + * index -> the name of the page and of the less file (page-index.less) +* And everything which is standardized across pages is included from `page-index.less` as variables and mixins. + +Rules: +* All of our new classes and ids should start with `cp-`. +* You may make as many files as you need, for different purposes, but they can only contain mixins and variables. +* All mixins and variables must be prefixed with the name of the file where they're defined and and underscore. + * e.g. `@colortheme_toolbar-poll-bg: #006304;` defined in `colortheme.less` +* All mixin / variable files go in an `/include/` directory. +* Document the meaning of your variable or mixin in a comment, consider that your mixin will be used by people other than you and if they do not have a definition of what it means, an update to it's style which seems logical to you might break their usage of it. \ No newline at end of file diff --git a/customize.dist/template.js b/customize.dist/template.js index 6c3361789..340ec11d1 100644 --- a/customize.dist/template.js +++ b/customize.dist/template.js @@ -177,10 +177,11 @@ $(function () { } require([ - 'less!/customize/src/less/cryptpad.less', + 'less!/customize/src/less2/main.less', 'css!/bower_components/bootstrap/dist/css/bootstrap.min.css', + '/bower_components/bootstrap/dist/js/bootstrap.min.js' ], function () { - $body.append($topbar).append($main).append($footer); + $body.append($main); if (/^\/user\//.test(pathname)) { require([ '/user/main.js'], function () {}); diff --git a/customize.dist/translations/messages.es.js b/customize.dist/translations/messages.es.js index 65afe91f0..10b722f4a 100644 --- a/customize.dist/translations/messages.es.js +++ b/customize.dist/translations/messages.es.js @@ -104,7 +104,11 @@ define(function () { out.main_p2 = 'Este proyecto utiliza el editor de texto visual CKEditor, CodeMirror, y el motor en tiempo real ChainPad.'; out.main_howitworks = '¿Cómo funciona?'; out.main_howitworks_p1 = "CryptPad utiliza una variante del algoritmo de transformación operacional (página en inglés) que es capaz de encontrar un consenso distribuido usando un Blockchain Nakamoto (página en inglés), popularizado por Bitcoin. De esta manera el algoritmo puede evitar la necesidad de un servidor central para resolver conflictos de edición de la transformación operacional y sin necesidad de resolver conflictos, el servidor puede mantenerse inconsciente del contenido que se está editando en el pad."; +<<<<<<< HEAD + out.main_about_p2 = 'Si tienes preguntas o comentarios, puedes enviarnos un tweet, abrir un issue en GitHub. saludarnos en nuestro canal Matrix o en IRC (#cryptpad on irc.freenode.net), o envianos un email.'; +======= out.main_about_p2 = 'Si tienes preguntas o comentarios, puedes enviarnos un tweet, abrir un issue en GitHub, saludarnos en nuestro canal IRC (irc.freenode.net), o envíanos un email.'; +>>>>>>> fb13e656b7b3ee611bf195a1f1ccf7475f2f1ee4 out.button_newpad = 'Crear nuevo pad de texto enriquecido'; out.button_newcode = 'Crear nuevo pad de código'; @@ -542,6 +546,11 @@ define(function () { out.settings_logoutEverywhereButton = "Cerrar sesión"; out.upload_title = "Subir archivo"; +<<<<<<< HEAD + // 1.13.0 - Naiad + out.topbar_whatIsCryptpad = "Qué es CryptPad"; + +======= // 1.12.0 - Minotaur out.userlist_pending = "Pendiente..."; out.contacts_typeHere = "Escribe un mensaje aquí..."; @@ -554,5 +563,6 @@ define(function () { out.todo_markAsCompleteTitle = "Marcar esta tarea como completa"; out.todo_markAsIncompleteTitle = "Marcar esta tarea como incompleta"; out.todo_removeTaskTitle = "Borrar esta tarea de la lista"; +>>>>>>> fb13e656b7b3ee611bf195a1f1ccf7475f2f1ee4 return out; }); diff --git a/customize.dist/translations/messages.fr.js b/customize.dist/translations/messages.fr.js index a63196f95..70814a2de 100644 --- a/customize.dist/translations/messages.fr.js +++ b/customize.dist/translations/messages.fr.js @@ -486,7 +486,7 @@ define(function () { out.main_p2 = 'Ce projet utilise l\'éditeur visuel (WYSIWYG) CKEditor, l\'éditeur de code source CodeMirror, et le moteur temps-réel ChainPad.'; out.main_howitworks_p1 = 'CryptPad utilise une variante de l\'algorithme d\'Operational transformation qui est capable de trouver un consensus distribué en utilisant une chaîne de bloc Nakamoto, un outil popularisé par le Bitcoin. De cette manière, l\'algorithme évite la nécessité d\'utiliser un serveur central pour résoudre les conflits d\'édition de l\'Operational Transformation, et sans ce besoin de résolution des conflits le serveur peut rester ignorant du contenu qui est édité dans le pad.'; //contact.html - out.main_about_p2 = 'Si vous avez des questions ou commentaires, vous pouvez nous tweeter, ouvrir une issue sur Github, venir dire bonjour sur IRC (irc.freenode.net), ou nous envoyer un email.'; + out.main_about_p2 = 'Si vous avez des questions ou commentaires, vous pouvez nous tweeter, ouvrir une issue sur GitHub, venir dire bonjour sur notre salle Matrix ou IRC (#cryptpad sur irc.freenode.net), ou bien encore nous envoyer un email.'; out.main_info = "

Collaborez avec confiance


Développez vos idées en groupe avec des document partagés; la technologie Zero Knowledge sécurise vos données."; @@ -520,6 +520,8 @@ define(function () { out.terms = "Conditions"; out.blog = "Blog"; + out.topbar_whatIsCryptpad = "Qu'est-ce que CryptPad"; + // privacy.html out.policy_title = 'Politique de confidentialité de CryptPad'; diff --git a/customize.dist/translations/messages.js b/customize.dist/translations/messages.js index d41e17145..5fb3a6ae1 100644 --- a/customize.dist/translations/messages.js +++ b/customize.dist/translations/messages.js @@ -388,8 +388,6 @@ define(function () { out.login_invalPass = 'Password required'; out.login_unhandledError = 'An unexpected error occurred :('; - out.login_notRegistered = 'Not registered?'; - out.register_importRecent = "Import pad history (Recommended)"; out.register_acceptTerms = "I accept the terms of service"; out.register_passwordsDontMatch = "Passwords do not match!"; @@ -496,9 +494,10 @@ define(function () { out.main_howitworks_p1 = 'CryptPad uses a variant of the Operational transformation algorithm which is able to find distributed consensus using a Nakamoto Blockchain, a construct popularized by Bitcoin. This way the algorithm can avoid the need for a central server to resolve Operational Transform Edit Conflicts and without the need for resolving conflicts, the server can be kept unaware of the content which is being edited on the pad.'; // contact.html - out.main_about_p2 = 'If you have any questions or comments, you can tweet us, open an issue on github, come say hi on irc (irc.freenode.net), or send us an email.'; + out.main_about_p2 = 'If you have any questions or comments, feel free to reach out! You can tweet us, open an issue on GitHub. Come say hi on our Matrix channel or IRC (#cryptpad on irc.freenode.net), or send us an email.'; out.main_info = "

Collaborate in Confidence


Grow your ideas together with shared documents while Zero Knowledge technology secures your privacy; even from us."; + out.main_catch_phrase = "The Zero Knowledge Cloud"; out.main_howitworks = 'How It Works'; out.main_zeroKnowledge = 'Zero Knowledge'; @@ -521,6 +520,13 @@ define(function () { out.main_poll_p = 'Plan your meeting or your event, or vote for the best solution regarding your problem.'; out.main_drive = 'CryptDrive'; + out.main_richTextPad = 'Rich Text Pad'; + out.main_codePad = 'Markdown/Code Pad'; + out.main_slidePad = 'Markdown Presentation'; + out.main_pollPad = 'Poll or Schedule'; + out.main_whiteboardPad = 'Whiteboard'; + out.main_recentPads = 'Recent Pads'; + out.footer_applications = "Applications"; out.footer_contact = "Contact"; out.footer_aboutUs = "About us"; @@ -531,6 +537,27 @@ define(function () { out.terms = "ToS"; out.blog = "Blog"; + out.topbar_whatIsCryptpad = "What is CryptPad"; + + // what-is-cryptpad.html + + out.whatis_title = 'What is CryptPad'; + out.whatis_collaboration = 'Fast, Easy Collaboration'; + out.whatis_collaboration_p1 = 'With CryptPad, you can make quick collaborative documents for taking notes and writing down ideas together. When you sign up and log in, you get file upload capability and a CryptDrive where you can organize all of your pads. As a registered user you get 50MB of space for free.'; + out.whatis_collaboration_p2 = 'You can share access to a CryptPad document simply by sharing the link. You can also share a link which provides read only access to a pad, allowing you to publicise your collaborative work while still being able to edit it.'; + out.whatis_collaboration_p3 = 'You can make simple rich text documents with CKEditor as well as Markdown documents which are rendered in realtime while you type. You can also use the poll app for scheduling events with multiple participants.'; + out.whatis_zeroknowledge = 'Zero Knowledge'; + out.whatis_zeroknowledge_p1 = "We don't want to know what you're typing and with modern cryptography, you can be sure that we can't know. CryptPad uses 100% client side encryption to protect the content that you type from us, the people who host the server."; + out.whatis_zeroknowledge_p2 = 'When you sign up and log in, your username and password are computed into a secret key using scrypt key derivation function. Neither this key, nor the username and password are ever sent to the server. Instead they are used on the client side to decrypt the content of your CryptDrive, which contains the keys to all pads that you are able to access.'; + out.whatis_zeroknowledge_p3 = 'When you share the link to a document, you\'re sharing the cryptographic key for accessing that document but since the key is in the fragment identifier, it is never directly sent to the server. Check out our privacy blog post to learn more about what types of metadata we do and do not have access to.'; + out.whatis_drive = 'Organization with CryptDrive'; + out.whatis_drive_p1 = 'Whenever you access a pad in CryptPad, the pad is automatically added to your CryptDrive in the main folder. Later on, you can organize these pads into folders or you can put them in the trash bin. CryptDrive allows you to search through your pads and to organize them whenever you want, however you want.'; + out.whatis_drive_p2 = 'With intuitive drag-and-drop, you can move pads around in your drive and the link to these pads will stay the same so your collaborators will never lose access.'; + out.whatis_drive_p3 = 'You can also upload files in your CryptDrive and share them with colleagues. Uploaded files can be organized just like collaborative pads.'; + out.whatis_business = 'CryptPad for Business'; + out.whatis_business_p1 = 'CryptPad\'s Zero Knowledge encryption is excellent for multiplying the effectiveness of existing security protocols by mirroring organizational access controls in cryptography. Because sensitive assets can only be decrypted using employee access credentials, CryptPad removes the hacker jackpot which exists in traditional IT servers. Read the CryptPad Whitepaper to learn more about how it can help your business.'; + out.whatis_business_p2 = 'CryptPad is deployable on premises and the CryptPad developers at XWiki SAS are able to offer commercial support, customization and development. Reach out to sales@cryptpad.fr for more information.'; + // privacy.html out.policy_title = 'CryptPad Privacy Policy'; diff --git a/customize.dist/what-is-cryptpad.html b/customize.dist/what-is-cryptpad.html new file mode 100644 index 000000000..03032969b --- /dev/null +++ b/customize.dist/what-is-cryptpad.html @@ -0,0 +1,16 @@ + + + + + CryptPad: Zero Knowledge, Collaborative Real Time Editing + + + + + + + + diff --git a/package.json b/package.json index f6e44faa2..a2b893d21 100644 --- a/package.json +++ b/package.json @@ -18,6 +18,6 @@ "scripts": { "lint": "jshint --config .jshintrc --exclude-path .jshintignore .", "test": "node TestSelenium.js", - "template": "cd customize.dist/src && for page in ../index.html ../privacy.html ../terms.html ../about.html ../contact.html ../../www/login/index.html ../../www/register/index.html ../../www/settings/index.html ../../www/user/index.html;do echo $page; cp template.html $page; done;" + "template": "cd customize.dist/src && for page in ../index.html ../privacy.html ../terms.html ../about.html ../contact.html ../what-is-cryptpad.html ../../www/login/index.html ../../www/register/index.html ../../www/settings/index.html ../../www/user/index.html;do echo $page; cp template.html $page; done;" } } diff --git a/server.js b/server.js index aed35c2fc..351f0c695 100644 --- a/server.js +++ b/server.js @@ -32,7 +32,7 @@ var setHeaders = (function () { if (typeof(config.httpHeaders) !== 'object') { return function () {}; } const headers = clone(config.httpHeaders); - if (config.contentSecurity) { + if (config.contentSecurity && false) { headers['Content-Security-Policy'] = clone(config.contentSecurity); if (!/;$/.test(headers['Content-Security-Policy'])) { headers['Content-Security-Policy'] += ';' } if (headers['Content-Security-Policy'].indexOf('frame-ancestors') === -1) { diff --git a/www/common/pdfjs/api/draft/fonts/OpenSans-Light-webfont.eot? b/www/common/pdfjs/api/draft/fonts/OpenSans-Light-webfont.eot? deleted file mode 100644 index 14868406a..000000000 Binary files a/www/common/pdfjs/api/draft/fonts/OpenSans-Light-webfont.eot? and /dev/null differ diff --git a/www/common/pdfjs/api/draft/fonts/OpenSans-Regular-webfont.eot? b/www/common/pdfjs/api/draft/fonts/OpenSans-Regular-webfont.eot? deleted file mode 100644 index 6bbc3cf58..000000000 Binary files a/www/common/pdfjs/api/draft/fonts/OpenSans-Regular-webfont.eot? and /dev/null differ diff --git a/www/common/toolbar2.js b/www/common/toolbar2.js index f132558bf..0c7b6e507 100644 --- a/www/common/toolbar2.js +++ b/www/common/toolbar2.js @@ -626,8 +626,10 @@ define([ var $aTag = $('', { href: "/drive/", title: Messages.header_logoTitle, - 'class': "cryptpad-logo fa fa-hdd-o" - }); + 'class': "cryptpad-logo" + }).append($('', { + src: '/customize/images/logo_white.svg' + })); var onClick = function (e) { e.preventDefault(); if (e.ctrlKey) {