Merge branch 'front-page' of https://git.xwikisas.com/xwiki-labs/cryptpad into front-page

customize.dist/main.js

@@ -25,6 +25,11 @@ define([
         $main.find('#data').removeClass('hidden');
 
         if (Cryptpad.isLoggedIn()) {
+            if (window.location.pathname === '/') {
+                window.location = '/drive/';
+                return;
+            }
+
             var name = localStorage[Cryptpad.userNameKey] || sessionStorage[Cryptpad.userNameKey];
             var $loggedInBlock = $main.find('#loggedIn');
             var $hello = $loggedInBlock.find('#loggedInHello');

customize.dist/pages.js

@@ -77,6 +77,21 @@ define([
     };
 
     var infopageTopbar = function () {
+        var rightLinks;
+        var username = window.localStorage.getItem('User_name');
+        if (username === null) {
+            rightLinks = [
+                h('a.nav-item.nav-link.cp-login-btn', { href: '/login'}, Msg.login_login),
+                h('a.nav-item.nav-link.cp-register-btn', { href: '/register'}, Msg.login_register)
+            ];
+        } else {
+            rightLinks = h('a.nav-item.nav-link.cp-user-btn', { href: '/drive' }, [
+                h('i.fa.fa-user-circle'),
+                " ",
+                username
+            ]);
+        }
+
         return h('nav.navbar.navbar-toggleable-md',
                      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 ')
@@ -87,14 +102,12 @@ define([
                     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.nav-item.nav-link.cp-login-btn', { href: '/login'}, Msg.login_login),
+                ].concat(rightLinks))
-                    h('a.nav-item.nav-link.cp-register-btn', { href: '/register'}, Msg.login_register)
-                ])
         );
     };
 
     Pages['/about.html'] = function () {
-        return h('div#cp-main.cp-page-about', [
+        return h('div#cp-main', [
             infopageTopbar(),
             h('div.container.cp-container', [
                 h('center', [
@@ -143,7 +156,7 @@ define([
     };
 
     Pages['/privacy.html'] = function () {
-        return h('div#cp-main.cp-page-privacy', [
+        return h('div#cp-main', [
             infopageTopbar(),
             h('div.container.cp-container', [
                 h('center', h('h1', Msg.policy_title)),
@@ -172,7 +185,7 @@ define([
     };
 
     Pages['/terms.html'] = function () {
-        return h('div#cp-main.cp-page-terms', [
+        return h('div#cp-main', [
             infopageTopbar(),
             h('div.container.cp-container', [
                 h('center', h('h1', Msg.tos_title)),
@@ -187,7 +200,7 @@ define([
     };
 
     Pages['/contact.html'] = function () {
-        return h('div#cp-main.cp-page-contact', [
+        return h('div#cp-main', [
             infopageTopbar(),
             h('div.container.cp-container', [
                 h('center', h('h1', Msg.contact)),
@@ -198,7 +211,7 @@ define([
     };
 
     Pages['/what-is-cryptpad.html'] = function () {
-        return h('div#cp-main.cp-page-what-is-cryptpad', [
+        return h('div#cp-main', [
             infopageTopbar(),
             h('div.container.cp-container', [
                 h('center', h('h1', Msg.whatis_title)),
@@ -234,7 +247,7 @@ define([
     Pages['/'] = Pages['/index.html'] = function () {
         var showingMore = false;
         return [
-            h('div#cp-main.cp-page-index', [
+            h('div#cp-main', [
                 infopageTopbar(),
                 h('div.container.cp-container', [
                     h('div.row', [
@@ -274,11 +287,9 @@ define([
                                         if (showingMore) {
                                             $('.cp-more, .cp-callout-more-lessmsg').addClass('cp-hidden');
                                             $('.cp-callout-more-moremsg').removeClass('cp-hidden');
-                                            if ( $( window ).width() >991 ) $('.navbar').css('margin-top','-1em');
                                         } else {
                                             $('.cp-more, .cp-callout-more-lessmsg').removeClass('cp-hidden');
                                             $('.cp-callout-more-moremsg').addClass('cp-hidden');
-                                            $('.navbar').css('margin-top','0');
                                         }
                                         showingMore = !showingMore;
                                     }
@@ -310,7 +321,7 @@ define([
     };
 
     Pages['/register/'] = Pages['/register/index.html'] = function () {
-        return [h('div#cp-main.cp-page-register', [
+        return [h('div#cp-main', [
             infopageTopbar(),
             h('div.container.cp-container', [
                 h('div.row.align-items-center', [
@@ -362,7 +373,7 @@ define([
     };
 
     Pages['/login/'] = Pages['/login/index.html'] = function () {
-        return [h('div#cp-main.cp-page-login', [
+        return [h('div#cp-main', [
             infopageTopbar(),
             h('div.container.cp-container', [
                 h('div.row.align-items-center', [

customize.dist/src/less2/include/alertify.less

@@ -5,15 +5,15 @@
     @alertify-fore: @colortheme_old-fore;
     @alertify-base: @colortheme_old-base;
 
-    @alertify-dialog-bg: #444;
+    @alertify-dialog-bg: #222;
     @alertify-dialog-fg: @colortheme_old-fore;
 
     @alertify-btn-fg: @colortheme_old-fore;
 
-    @alertify-btn-bg: rgba(200, 200, 200, 0.05);
+    @alertify-btn-bg: rgba(200, 200, 200, 0.1);
-    @alertify-btn-bg-hover: rgba(200, 200, 200, .15);
+    @alertify-btn-bg-hover: rgba(200, 200, 200, .3);
 
-    @alertify-bg: rgba(0, 0, 0, .3);
+    @alertify-bg: rgba(0, 0, 0, .4);
     @alertify-fg: @colortheme_old-fore;
 
     @alertify-input-bg: @colortheme_old-base;
@@ -21,7 +21,6 @@
 
     @alertify_padding-base: 12px;
     @alertify_box-shadow: 0 2px 5px 0 rgba(0,0,0,.2);
-    @alertify_border-radius: 1px;
 
     // Logs to show that something has happened
     // These show only once
@@ -38,7 +37,6 @@
             font-size: large;
 
             box-shadow: @alertify_box-shadow;
-            border-radius: @alertify_border-radius;
             &, &.default {
                 // FIXME
                 background: rgba(0, 0, 0, .8);
@@ -64,6 +62,10 @@
         height: 100%;
         z-index: 99999;
 
+        h1, h2, h3 {
+            margin-top: 0;
+        }
+
         &.hide {
             opacity: 0;
             pointer-events: none;
@@ -89,7 +91,6 @@
 
             & > div {
                 background-color: @alertify-dialog-bg;
-                border-radius: 5px;
                 &.half {
                     width: 50%;
                     @media (max-width: @browser_media-medium-screen) {
@@ -106,10 +107,10 @@
 
             > * {
                 width: 30%;
-                width: 500px;
+                min-width: 500px;
                 max-width: 95%;
                 margin: 0 auto;
-                text-align: center;
+                text-align: left;
                 padding: @alertify_padding-base;
                 background: #fff;
                 // FIXME
@@ -120,14 +121,12 @@
                 padding: @alertify_padding-base;
                 margin-bottom: @alertify_padding-base;
                 margin: 0;
-                text-align: left;
             }
 
             input:not(.form-control){
                 background-color: @alertify-input-bg;
                 color: @alertify-input-fg; 
                 border: 0px;
-                border-radius: 5px;
 
                 margin-bottom: 15px;
                 width: 100%;
@@ -161,10 +160,10 @@
                     font-size: 14px;
                     text-decoration: none;
                     cursor: pointer;
+                    border-radius: 0;
 
                     color: @alertify-btn-fg;
-                    border: 1px solid @alertify-base;
+                    border: 1px solid transparent;
-                    border-radius: 5px;
 
                     &.safe, &.danger {
                         color: @colortheme_old-base;
@@ -172,16 +171,16 @@
                         font-weight: bold;
                     }
                     &.danger {
-                        background-color: @colortheme_cp-red;
+                        background-color: @colortheme_alertify-red;
                         &:hover, &:active {
-                            background-color: lighten(@colortheme_cp-red, 5%);
+                            background-color: lighten(@colortheme_alertify-red, 5%);
                         }
                     }
 
                     &.safe {
-                        background-color: @colortheme_cp-green;
+                        background-color: @colortheme_alertify-green;
                         &:hover, &:active {
-                            background-color: lighten(@colortheme_cp-green, 10%);
+                            background-color: lighten(@colortheme_alertify-green, 10%);
                         }
                     }
 

customize.dist/src/less2/include/colortheme.less

@@ -11,6 +11,9 @@
 @colortheme_cp-red: #FA5858; // remove red
 @colortheme_cp-green: #46E981;
 
+@colortheme_alertify-red: #E55236;
+@colortheme_alertify-green: #77C825;
+
 @colortheme_pad-bg: #1c4fa0;
 @colortheme_pad-color: #fff;
 

customize.dist/src/less2/include/infopages.less

@@ -21,12 +21,11 @@
     padding: 0;
     margin: 0;
 
-    font-size: 14px;
+    font-size: 16pxt:;
     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;
@@ -115,6 +114,15 @@
 
 // Apply this to the top bar div
 .infopages_topbar () {
+    .navbar-brand {
+        display: block;
+        background-image: url(/customize/CryptPad-blue-logo.svg);
+        background-repeat: no-repeat;
+        background-size: contain;
+        height: 50px;
+        width: 250px;
+    }
+
     .cp-topbar {
         background: #fff;
         z-index: 9001;
@@ -153,9 +161,6 @@
         }
 
         .cp-logo {
-            img {
-                height: @infopages_infobar-height / 2;
-            }
             margin-right: 0.5em;
         }
     }

customize.dist/src/less2/main.less

@@ -2,11 +2,11 @@
 	font-family: Neuropolitical;
 	src: url(./customize/fonts/neuropolitical.ttf)
 }
-div#cp-main.cp-page-index { @import "./pages/page-index.less"; }
+body.cp-page-index { @import "./pages/page-index.less"; }
-div#cp-main.cp-page-contact { @import "./pages/page-contact.less"; }
+body.cp-page-contact { @import "./pages/page-contact.less"; }
-div#cp-main.cp-page-login { @import "./pages/page-login.less"; }
+body.cp-page-login { @import "./pages/page-login.less"; }
-div#cp-main.cp-page-register { @import "./pages/page-register.less"; }
+body.cp-page-register { @import "./pages/page-register.less"; }
-div#cp-main.cp-page-what-is-cryptpad { @import "./pages/page-what-is-cryptpad.less"; }
+body.cp-page-what-is-cryptpad { @import "./pages/page-what-is-cryptpad.less"; }
-div#cp-main.cp-page-about { @import "./pages/page-about.less"; }
+body.cp-page-about { @import "./pages/page-about.less"; }
-div#cp-main.cp-page-privacy { @import "./pages/page-privacy.less"; }
+body.cp-page-privacy { @import "./pages/page-privacy.less"; }
-div#cp-main.cp-page-terms { @import "./pages/page-terms.less"; }
+body.cp-page-terms { @import "./pages/page-terms.less"; }

customize.dist/src/less2/pages/page-index.less

@@ -9,14 +9,14 @@
 
 @background_lighter: rgba(0,0,0,0.1);
 @background_darker: rgba(0,0,0,0.4);
-&#cp-main {
+#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;
+    justify-content: space-between;
     align-items: center;
     .container {
         @media only screen and (max-device-width : 576px) {
@@ -65,14 +65,11 @@
 .navbar {
     background: transparent;
     width: 100%;
-    margin-top: -1em;
     @media only screen and (max-device-width: 991px) {
         margin-top: 0;
     }
     .navbar-brand {
-        background: url(/customize/CryptPad-white-logo.svg) no-repeat;
+        background-image: url(/customize/CryptPad-white-logo.svg);
-        width: 250px;
-        height: 50px;
     }
     a {
         color: #fff;

customize.dist/src/less2/pages/page-register.less

@@ -23,3 +23,10 @@
         }
     }
 }
+
+.alertify {
+    // workaround for alertify making empty p
+    p:empty {
+        display: none;
+    }
+}

customize.dist/template.js

@@ -78,6 +78,16 @@ $(function () {
 
             return;
         }
+    } else {
+        // add class on info-pages
+        var css = location.pathname.replace(/(index)?\.html$/gi, "") // .html
+            .replace(/[^a-zA-Z]+/gi, '-') // any non-alpha character
+            .replace(/^-|-$/g, ''); // starting/trailing dashes
+        if (css === '')
+        {
+            css = 'index';
+        }
+        $('body').addClass('cp-page-' + css);
     }
 
     require([

www/register/main.js

@@ -121,7 +121,7 @@ define([
             }
 
             setTimeout(function () {
-            Cryptpad.confirm("<h2 class='bright'>" + Messages.register_warning + "</h2>",
+            Cryptpad.confirm("<h2 class='bright msg'>" + Messages.register_warning + "</h2>",
             function (yes) {
                 if (!yes) { return; }