diff --git a/customize.dist/src/less2/include/alertify.less b/customize.dist/src/less2/include/alertify.less index db951613c..c3767f073 100644 --- a/customize.dist/src/less2/include/alertify.less +++ b/customize.dist/src/less2/include/alertify.less @@ -153,12 +153,10 @@ max-width: 500px; margin: 0 auto; text-align: left; - padding: @alertify_padding-base; background: #fff; box-shadow: @alertify_box-shadow; &.wide { - width: 1000px; - max-width: 70%; + max-width: 850px; } } @@ -178,13 +176,14 @@ max-height: 100%; display: flex; flex-flow: column; + padding: @alertify_padding-base; .alertify-tabs-titles { height: 40px; display: flex; border-bottom: 1px solid @alertify-fore; margin-bottom: 10px; box-sizing: content-box; - span { + .alertify-tabs-title { .tools_unselectable(); font-size: 20px; height: 40px; @@ -201,6 +200,13 @@ color: #949494; cursor: not-allowed; } + &:not(.alertify-tabs-active) { + @media (max-width: @browser_media-medium-screen) { + .tab-title-text { + display: none; + } + } + } } span.alertify-tabs-active { background-color: @alertify-fore !important; @@ -393,9 +399,15 @@ .cp-share-columns { display: flex; flex-flow: row; + @media screen and (max-width: (@browser_media-medium-screen)) { + flex-flow: column; + } & > .cp-share-column { width: 50%; + @media screen and (max-width: (@browser_media-medium-screen)) { + width: unset; + } //padding: 0 10px; position: relative; &.contains-nav { @@ -414,19 +426,32 @@ } &:first-child { margin-right: @alertify_padding-base; + @media screen and (max-width: (@browser_media-medium-screen)) { + margin: 0 0 @alertify_padding-base 0; + } } &:last-child { margin-left: @alertify_padding-base; + @media screen and (max-width: (@browser_media-medium-screen)) { + margin: 0px; + } } } & > .cp-share-column-mid { display: flex; align-items: center; + justify-content: center; + @media screen and (max-width: (@browser_media-medium-screen)) { + margin-bottom: @alertify_padding-base; + } button { width: 50px; margin: 0; min-width: 0; font-size: 18px !important; + @media screen and (max-width: (@browser_media-medium-screen)) { + width: 100%; + } } } } diff --git a/customize.dist/src/less2/include/corner.less b/customize.dist/src/less2/include/corner.less index feec62165..04d503cc9 100644 --- a/customize.dist/src/less2/include/corner.less +++ b/customize.dist/src/less2/include/corner.less @@ -89,6 +89,7 @@ } &.cp-corner-big { width: 500px; + max-width: 95%; } .cp-corner-dontshow { diff --git a/customize.dist/src/less2/include/modal.less b/customize.dist/src/less2/include/modal.less index 8ed10a1b2..08c0121fd 100644 --- a/customize.dist/src/less2/include/modal.less +++ b/customize.dist/src/less2/include/modal.less @@ -41,6 +41,7 @@ box-shadow: @variables_shadow; padding: @variables_padding; + padding-top: @variables_padding * 2; position: relative; //top: 15vh; bottom: 15vh; @@ -57,6 +58,11 @@ margin-bottom: 1em; } + & > p:not(.cp-modal-form) { + text-align: left; // XXX needs testing + margin-right: 30px; + } + .cp-modal-form { display: flex; flex-wrap: wrap; diff --git a/customize.dist/src/less2/include/modals-ui-elements.less b/customize.dist/src/less2/include/modals-ui-elements.less index e8282f6e8..09e381c47 100644 --- a/customize.dist/src/less2/include/modals-ui-elements.less +++ b/customize.dist/src/less2/include/modals-ui-elements.less @@ -1,5 +1,7 @@ @import (reference) "./colortheme-all.less"; @import (reference) "./variables.less"; +@import (reference) "./browser.less"; + .modals-ui-elements_main() { --LessLoader_require: LessLoader_currentFile(); } @@ -20,6 +22,15 @@ .cp-radio { margin-right: 30px; } + @media (max-width: @browser_media-medium-screen) { + flex-direction: column; + &:not(:last-child) { + margin-bottom: 0px; + } + .cp-radio { + margin: 0 0 5px 0; + } + } } } @@ -74,6 +85,24 @@ } // Access modal + button.cp-access-add { + i { + margin-right: 0px !important; + } + i.fa-arrow-left { + display: inline; + @media (max-width: @browser_media-medium-screen) { + display:none; + } + } + i.fa-arrow-up { + display: none; + @media (max-width: @browser_media-medium-screen) { + display: inline; + } + } + } + .cp-overlay-container { position: relative; .cp-overlay { diff --git a/www/common/common-interface.js b/www/common/common-interface.js index 37ef044ff..647036356 100644 --- a/www/common/common-interface.js +++ b/www/common/common-interface.js @@ -221,9 +221,9 @@ define([ tabs.forEach(function (tab, i) { if (!(tab.content || tab.disabled) || !tab.title) { return; } var content = h('div.alertify-tabs-content', tab.content); - var title = h('span.alertify-tabs-title'+ (tab.disabled ? '.disabled' : ''), tab.title); + var title = h('span.alertify-tabs-title'+ (tab.disabled ? '.disabled' : ''), h('span.tab-title-text',{id: 'cp-tab-' + tab.title.toLowerCase(), 'aria-hidden':"true"}, tab.title)); if (tab.icon) { - var icon = h('i', {class: tab.icon}); + var icon = h('i', {class: tab.icon, 'aria-labelledby': 'cp-tab-' + tab.title.toLowerCase()}); $(title).prepend(' ').prepend(icon); } $(title).click(function () { diff --git a/www/common/drive-ui.js b/www/common/drive-ui.js index bb6af01c4..4165ef009 100644 --- a/www/common/drive-ui.js +++ b/www/common/drive-ui.js @@ -1389,7 +1389,7 @@ define([ } $button.show(); $button.css({ - background: '#000' + background: '#63b1f7' }); window.setTimeout(function () { $button.css({ @@ -3693,6 +3693,9 @@ define([ APP.hideMenu(); return; } + if (!$li.length) { + return void $dirContent.contextmenu(); + } // Open the menu $li.contextmenu(); }); diff --git a/www/common/inner/access.js b/www/common/inner/access.js index 2e1f4b4a8..129b24916 100644 --- a/www/common/inner/access.js +++ b/www/common/inner/access.js @@ -33,7 +33,7 @@ define([ opts = opts || {}; var redrawAll = function () {}; - var addBtn = h('button.btn.btn-primary.fa.fa-arrow-left'); + var addBtn = h('button.btn.btn-primary.cp-access-add', [h('i.fa.fa-arrow-left'), h('i.fa.fa-arrow-up')]); var div1 = h('div.cp-share-column.cp-ownership'); var divMid = h('div.cp-share-column-mid', addBtn); @@ -388,7 +388,7 @@ define([ var redrawAll = function () {}; - var addBtn = h('button.btn.btn-primary.fa.fa-arrow-left'); + var addBtn = h('button.btn.btn-primary.cp-access-add', [h('i.fa.fa-arrow-left'), h('i.fa.fa-arrow-up')]); var div1 = h('div.cp-share-column.cp-allowlist'); var divMid = h('div.cp-share-column-mid.cp-overlay-container', [ diff --git a/www/common/inner/share.js b/www/common/inner/share.js index 5825b5fa8..19570f78e 100644 --- a/www/common/inner/share.js +++ b/www/common/inner/share.js @@ -656,7 +656,7 @@ define([ var tabs = [{ getTab: getContactsTab, title: Messages.share_contactCategory, - icon: "fa fa-addessèbook", + icon: "fa fa-address-book", active: hasFriends, onShow: onShowContacts, onHide: resetTab @@ -836,7 +836,7 @@ define([ var tabs = [{ getTab: getFileContactsTab, title: Messages.share_contactCategory, - icon: "fa fa-addessèbook", + icon: "fa fa-address-book", active: hasFriends, }, { getTab: getFileLinkTab,