From eac10321ba170d685297ef50f3a2b5ada7cbc371 Mon Sep 17 00:00:00 2001
From: yflory <yann.flory@xwiki.com>
Date: Wed, 7 Mar 2018 18:24:01 +0100
Subject: [PATCH 1/3] Reduce toolbar height on mobiles

---
 customize.dist/src/less2/include/toolbar.less | 169 ++++++++++++++----
 1 file changed, 131 insertions(+), 38 deletions(-)

diff --git a/customize.dist/src/less2/include/toolbar.less b/customize.dist/src/less2/include/toolbar.less
index a0c01e377..50c51f611 100644
--- a/customize.dist/src/less2/include/toolbar.less
+++ b/customize.dist/src/less2/include/toolbar.less
@@ -362,53 +362,146 @@
                 flex: 1;
             }
         }
-        &:not(.cp-toolbar-notitle) {
-            .cp-toolbar-top {
-                @media screen and (max-width: @browser_media-medium-screen) {
-                    flex-wrap: wrap;
-                    height: auto;
-                    .cp-toolbar-top-filler {
-                        flex: 1;
-                    }
-                    .cp-toolbar-title {
-                        flex: auto;
+        .cp-toolbar-top {
+            @media screen and (max-width: @browser_media-medium-screen) {
+                flex-wrap: wrap;
+                height: @toolbar_line-height;
+                .cp-pad-not-pinned {
+                    line-height: 32px;
+                    flex: unset;
+                    padding: 0;
+                    align-self: auto;
+                    margin: 0 5px;
+                }
+                .cp-toolbar-top-filler {
+                    height: 32px;
+                }
+                .cp-toolbar-title {
+                    height: @toolbar_line-height;
+                    line-height: initial;
+                    margin: 0;
+                    .cp-toolbar-title-hoverable {
                         width: 100%;
-                        order: 10;
+                    }
+                    .cp-toolbar-title-value-page {
+                        padding: 5px;
+                        line-height: unset;
+                        border: 0;
+                    }
+                    .cp-toolbar-title-editable, .cp-toolbar-title-value-page {
+                        max-width: ~"calc(100vw - 26px)";
+                        display: inline-block;
+                        overflow: hidden;
+                        text-overflow: ellipsis;
+                        font-size: @colortheme_app-font-size;
                         height: @toolbar_line-height;
-                        line-height: initial;
-                        margin: 0;
-                        .cp-toolbar-title-hoverable {
-                            width: 100%;
-                        }
-                        .cp-toolbar-title-editable {
-                            max-width: ~"calc(100vw - 26px)";
-                            display: inline-block;
-                            overflow: hidden;
-                            text-overflow: ellipsis;
+                        box-sizing: border-box;
+                        line-height: 20px;
+                    }
+                    .cp-toolbar-title-edit, .cp-toolbar-title-save {
+                        box-sizing: border-box;
+                        height: @toolbar_line-height;
+                        line-height: @colortheme_app-font-size;
+                        display: inline-block;
+
+                        .fa {
                             font-size: @colortheme_app-font-size;
+                        }
+                    }
+                    input {
+                        height: @toolbar_line-height;
+                        font-size: @colortheme_app-font-size;
+                        flex: 1;
+                        max-width: none;
+                        line-height: calc(@toolbar_line-height - 12px); // padding + border
+                    }
+                }
+                .cp-toolbar-link {
+                    height: @toolbar_line-height;
+                    width: @toolbar_line-height;
+                    .cp-toolbar-link-logo {
+                        padding: 5px;
+                    }
+                }
+                .cp-toolbar-user {
+                    height: @toolbar_line-height;
+                    .cp-toolbar-new {
+                        height: @toolbar_line-height;
+                        width: @toolbar_line-height;
+                        margin-left: 0;
+                        button {
                             height: @toolbar_line-height;
-                            box-sizing: border-box;
-                            line-height: 20px;
+                            width: @toolbar_line-height;
+                            font-size: 20px;
+                            margin-top: -1px;
                         }
-                        .cp-toolbar-title-edit, .cp-toolbar-title-save {
-                            box-sizing: border-box;
+                    }
+                    .cp-toolbar-user-dropdown {
+                        height: @toolbar_line-height;
+                        width: @toolbar_line-height;
+                        &> button {
                             height: @toolbar_line-height;
-                            line-height: @colortheme_app-font-size;
-                            display: inline-block;
-
-                            .fa {
-                                font-size: @colortheme_app-font-size;
+                            width: @toolbar_line-height;
+                            span { font-size: unset; }
+                        }
+                        &> button.cp-avatar.cp-avatar {
+                            media-tag {
+                                margin: 4px;
+                                max-width: 24px;
+                                min-width: 24px;
+                                max-height: 24px;
+                                min-height: 24px;
                             }
                         }
-                        input {
-                            height: @toolbar_line-height;
+                    }
+                    .cp-toolbar-limit {
+                        line-height: 32px;
+                        margin: 0;
+                    }
+                }
+                /*
+                .cp-toolbar-top-filler {
+                    flex: 1;
+                }
+                .cp-toolbar-title {
+                    flex: auto;
+                    width: 100%;
+                    order: 10;
+                    height: @toolbar_line-height;
+                    line-height: initial;
+                    margin: 0;
+                    .cp-toolbar-title-hoverable {
+                        width: 100%;
+                    }
+                    .cp-toolbar-title-editable {
+                        max-width: ~"calc(100vw - 26px)";
+                        display: inline-block;
+                        overflow: hidden;
+                        text-overflow: ellipsis;
+                        font-size: @colortheme_app-font-size;
+                        height: @toolbar_line-height;
+                        box-sizing: border-box;
+                        line-height: 20px;
+                    }
+                    .cp-toolbar-title-edit, .cp-toolbar-title-save {
+                        box-sizing: border-box;
+                        height: @toolbar_line-height;
+                        line-height: @colortheme_app-font-size;
+                        display: inline-block;
+
+                        .fa {
                             font-size: @colortheme_app-font-size;
-                            flex: 1;
-                            max-width: none;
-                            line-height: calc(@toolbar_line-height - 12px); // padding + border
                         }
                     }
+                    input {
+                        height: @toolbar_line-height;
+                        font-size: @colortheme_app-font-size;
+                        flex: 1;
+                        max-width: none;
+                        line-height: calc(@toolbar_line-height - 12px); // padding + border
+                    }
                 }
+                */
             }
         }
 
@@ -471,9 +564,9 @@
             overflow: hidden;
             white-space: nowrap;
 
-            align-self: center;
-            padding-left: 20px;
-            padding-right: 5px;
+            line-height: @toolbar_top-height;
+            padding: 0;
+            margin: 0 5px;
             font-size: @colortheme_app-font-size;
             color: @warn-color;
             .cp-pnp-msg {

From cbd29794b85606734c062baf127c4ddcaad69685 Mon Sep 17 00:00:00 2001
From: yflory <yann.flory@xwiki.com>
Date: Thu, 8 Mar 2018 12:16:40 +0100
Subject: [PATCH 2/3] Improve keyboard shortcuts in the pad creation screen

---
 www/common/common-ui-elements.js | 16 ++++++++++++++--
 www/settings/inner.js            |  6 +++---
 2 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/www/common/common-ui-elements.js b/www/common/common-ui-elements.js
index 15e3c7b8c..5239f43f7 100644
--- a/www/common/common-ui-elements.js
+++ b/www/common/common-ui-elements.js
@@ -1804,6 +1804,7 @@ define([
         };
 
         // Owned pads
+        // Default is Owned pad
         var owned = h('div.cp-creation-owned', [
             h('h2', [
                 Messages.creation_ownedTitle,
@@ -1829,7 +1830,7 @@ define([
         ]);
         $creation.append(owned);
 
-        // If set to "open pad" or not set, check "open pad"
+        // If set to "open pad", check "open pad"
         if (!cfg.owned && typeof cfg.owned !== "undefined") {
             $creation.find('#cp-creation-owned-false').attr('checked', true);
         }
@@ -1877,6 +1878,16 @@ define([
             ])
         ]);
         $creation.append(expire);
+        $creation.find('#cp-creation-expire-val').keydown(function (e) {
+            if (e.which === 9) {
+                e.stopPropagation();
+            }
+        });
+        $creation.find('#cp-creation-expire-unit').keydown(function (e) {
+            if (e.which === 9 && e.shiftKey) {
+                e.stopPropagation();
+            }
+        });
 
         UIElements.setExpirationValue(cfg.expire, $creation);
 
@@ -1945,6 +1956,7 @@ define([
         });
 
         var $button = $('<button>').text(Messages.creation_createFromScratch).appendTo($create);
+        $button.addClass('cp-creation-button-selected');
         $button.click(function () {
             create();
         });
@@ -1985,7 +1997,7 @@ define([
             $spinner[0]
         ])).appendTo($creation);
 
-        var selected = -1;
+        var selected = 0;
         var next = function () {
             selected = ++selected % $creation.find('button').length;
             $creation.find('button').removeClass('cp-creation-button-selected');
diff --git a/www/settings/inner.js b/www/settings/inner.js
index 5105ad2b7..86870d950 100644
--- a/www/settings/inner.js
+++ b/www/settings/inner.js
@@ -335,13 +335,13 @@ define([
                 type: 'radio',
                 name: 'cp-creation-owned',
                 value: 1,
+                checked: 'checked'
             }),
             h('label', { 'for': 'cp-creation-owned-true' }, Messages.creation_ownedTrue),
             h('input#cp-creation-owned-false.cp-creation-owned-value', {
                 type: 'radio',
                 name: 'cp-creation-owned',
                 value: 0,
-                checked: 'checked'
             }),
             h('label', { 'for': 'cp-creation-owned-false' }, Messages.creation_ownedFalse),
             h('span.fa.fa-check', {title: Messages.saved}),
@@ -364,8 +364,8 @@ define([
             });
         });
         common.getAttribute(['general', 'creation', 'owned'], function (e, val) {
-            if (val) {
-                $owned.find('#cp-creation-owned-true').attr('checked', true);
+            if (!val && typeof val !== "undefined") {
+                $owned.find('#cp-creation-owned-false').attr('checked', true);
             }
         });
 

From b1b968314158be4100f01b25e9a35a20cff86c66 Mon Sep 17 00:00:00 2001
From: yflory <yann.flory@xwiki.com>
Date: Thu, 8 Mar 2018 12:17:19 +0100
Subject: [PATCH 3/3] Add links to FAQ and Privacy in static pages

---
 customize.dist/pages.js                      | 7 ++++++-
 customize.dist/src/less2/pages/page-faq.less | 7 +++++++
 customize.dist/translations/messages.fr.js   | 3 ++-
 customize.dist/translations/messages.js      | 1 +
 4 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/customize.dist/pages.js b/customize.dist/pages.js
index e7982f5e8..a08e40d3c 100644
--- a/customize.dist/pages.js
+++ b/customize.dist/pages.js
@@ -98,9 +98,11 @@ define([
                     ]),
                     h('a.navbar-brand', { href: '/index.html'}),
                 h('div.collapse.navbar-collapse.justify-content-end#menuCollapse', [  
-                    h('a.nav-item.nav-link', { href: '/what-is-cryptpad.html'}, Msg.topbar_whatIsCryptpad),
+                    //h('a.nav-item.nav-link', { href: '/what-is-cryptpad.html'}, Msg.topbar_whatIsCryptpad), // Moved the FAQ
+                    h('a.nav-item.nav-link', { href: '/faq.html'}, Msg.faq_link),
                     h('a.nav-item.nav-link', { href: 'https://blog.cryptpad.fr/'}, Msg.blog),
                     h('a.nav-item.nav-link', { href: '/features.html'}, Msg.features),
+                    h('a.nav-item.nav-link', { href: '/privacy.html'}, Msg.privacy),
                     h('a.nav-item.nav-link', { href: '/contact.html'}, Msg.contact),
                     h('a.nav-item.nav-link', { href: '/about.html'}, Msg.about),
                 ].concat(rightLinks))
@@ -403,6 +405,9 @@ define([
             infopageTopbar(),
             h('div.container.cp-container', [
                 h('center', h('h1', Msg.faq_title)),
+                h('p.cp-faq-header', h('a.nav-item.nav-link', {
+                    href: '/what-is-cryptpad.html'
+                }, Msg.faq_whatis)),
                 h('div.cp-faq-container', categories)
             ]),
             infopageFooter()
diff --git a/customize.dist/src/less2/pages/page-faq.less b/customize.dist/src/less2/pages/page-faq.less
index e24dc767c..99df97f9f 100644
--- a/customize.dist/src/less2/pages/page-faq.less
+++ b/customize.dist/src/less2/pages/page-faq.less
@@ -4,6 +4,13 @@
 .infopages_main();
 .infopages_topbar();
 
+.cp-faq-header {
+    padding: 0;
+    font-size: 1.2em;
+    a {
+        padding: 0;
+    }
+}
 .cp-faq-container {
     .cp-faq-questions-q {
         color: #3a84b6;
diff --git a/customize.dist/translations/messages.fr.js b/customize.dist/translations/messages.fr.js
index fca773da3..d4743dc9e 100644
--- a/customize.dist/translations/messages.fr.js
+++ b/customize.dist/translations/messages.fr.js
@@ -672,7 +672,7 @@ define(function () {
     out.footer_aboutUs = "À propos";
 
     out.about = "À propos";
-    out.privacy = "Vie privée";
+    out.privacy = "Confidentialité";
     out.contact = "Contact";
     out.terms = "Conditions";
     out.blog = "Blog";
@@ -759,6 +759,7 @@ define(function () {
 
     out.faq_link = "FAQ";
     out.faq_title = "Foire Aux Questions";
+    out.faq_whatis = "Qu'est-ce que CryptPad ?";
     out.faq = {};
     out.faq.keywords = {
         title: 'Termes spéciaux',
diff --git a/customize.dist/translations/messages.js b/customize.dist/translations/messages.js
index 5b60b6b0b..92d0c9a26 100644
--- a/customize.dist/translations/messages.js
+++ b/customize.dist/translations/messages.js
@@ -765,6 +765,7 @@ define(function () {
 
     out.faq_link = "FAQ";
     out.faq_title = "Frequently Asked Questions";
+    out.faq_whatis = "What is CryptPad?";
     out.faq = {};
     out.faq.keywords = {
         title: 'Keywords',