From 3964616a9e2d2902f3e9be1f142938290eb34972 Mon Sep 17 00:00:00 2001
From: "John Molakvoæ (skjnldsv)" <skjnldsv@protonmail.com>
Date: Wed, 28 Feb 2018 12:55:33 +0100
Subject: Updated popover rules to allow form inputs and added input submit for
new File
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
apps/files/css/files.scss | 8 --------
apps/files/js/newfilemenu.js | 10 ++++++++--
core/css/apps.scss | 21 ++++++++++++++-------
3 files changed, 22 insertions(+), 17 deletions(-)
diff --git a/apps/files/css/files.scss b/apps/files/css/files.scss
index 1be58cff5a1..3012ca171aa 100644
--- a/apps/files/css/files.scss
+++ b/apps/files/css/files.scss
@@ -696,14 +696,6 @@ table.dragshadow td.size {
z-index: 1001;
}
-.newFileMenu .filenameform {
- display: inline-block;
-}
-
-.newFileMenu .filenameform input {
- margin: 2px 0;
-}
-
#filestable .filename .action .icon,
#filestable .selectedActions a .icon,
#filestable .filename .favorite-mark .icon,
diff --git a/apps/files/js/newfilemenu.js b/apps/files/js/newfilemenu.js
index 18d9104dc40..09420328f29 100644
--- a/apps/files/js/newfilemenu.js
+++ b/apps/files/js/newfilemenu.js
@@ -28,6 +28,7 @@
'<form class="filenameform">' +
'<label class="hidden-visually" for="{{cid}}-input-{{fileType}}">{{fileName}}</label>' +
'<input id="{{cid}}-input-{{fileType}}" type="text" value="{{fileName}}" autocomplete="off" autocapitalize="off">' +
+ '<input type="submit" value=" " class="primary icon-checkmark-white" />'
'</form>';
/**
@@ -116,7 +117,7 @@
}
if ($target.find('form').length) {
- $target.find('input').focus();
+ $target.find('input[type=\'text\']').focus();
return;
}
@@ -138,7 +139,8 @@
$target.append($form);
// here comes the OLD code
- var $input = $form.find('input');
+ var $input = $form.find('input[type=\'text\']');
+ var $submit = $form.find('input[type=\'submit\']');
var lastPos;
var checkInput = function () {
@@ -171,6 +173,10 @@
}
});
+ $submit.click(function(){
+ $form.submit();
+ });
+
$input.focus();
// pre select name up to the extension
lastPos = newName.lastIndexOf('.');
diff --git a/core/css/apps.scss b/core/css/apps.scss
index 691a0c07131..cbacec07252 100644
--- a/core/css/apps.scss
+++ b/core/css/apps.scss
@@ -811,10 +811,9 @@ kbd {
flex: 0 0 auto;
> button,
> a,
- > .menuitem,
- > label {
+ > .menuitem {
cursor: pointer;
- line-height: 36px;
+ line-height: 38px;
border: 0;
background-color: transparent;
display: flex;
@@ -827,8 +826,8 @@ kbd {
color: $color-main-text;
/* Override the app-navigation li opacity */
opacity: .7 !important;
- [class^='icon-'],
- [class*=' icon-'],
+ span[class^='icon-'],
+ span[class*=' icon-'],
&[class^='icon-'],
&[class*=' icon-'] {
min-width: 0; /* Overwrite icons*/
@@ -836,8 +835,8 @@ kbd {
background-position: 10px center;
background-size: 16px;
}
- [class^='icon-'],
- [class*=' icon-'] {
+ span[class^='icon-'],
+ span[class*=' icon-'] {
/* Keep padding to define the width to
assure correct position of a possible text */
padding: 18px 0 18px 36px;
@@ -889,6 +888,14 @@ kbd {
> input:not([type=radio]):not([type=checkbox]):not([type=image]) {
width: 150px;
}
+ input {
+ min-width: 34px;
+ max-height: 34px;
+ margin: 2px 0;
+ ~ input {
+ margin-left: 5px;
+ }
+ }
}
> button {
padding: 0;
--
cgit v1.2.3
From a7a36402241ef98a3e1403c85e32a2170c6b2ca0 Mon Sep 17 00:00:00 2001
From: "John Molakvoæ (skjnldsv)" <skjnldsv@protonmail.com>
Date: Wed, 28 Feb 2018 13:09:11 +0100
Subject: fixup! Updated popover rules to allow form inputs and added input
submit for new File
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
core/css/apps.scss | 6 ++++++
1 file changed, 6 insertions(+)
diff --git a/core/css/apps.scss b/core/css/apps.scss
index cbacec07252..1389938a325 100644
--- a/core/css/apps.scss
+++ b/core/css/apps.scss
@@ -888,10 +888,16 @@ kbd {
> input:not([type=radio]):not([type=checkbox]):not([type=image]) {
width: 150px;
}
+ form {
+ display: flex;
+ flex: 1 1 auto;
+ }
+ /* Inputs inside popover supports text, submit & reset */
input {
min-width: 34px;
max-height: 34px;
margin: 2px 0;
+ flex: 1 1 auto;
~ input {
margin-left: 5px;
}
--
cgit v1.2.3
From 955c2ee1a7d4936aa5fc4168cb1c8bff41f7ad8b Mon Sep 17 00:00:00 2001
From: "John Molakvoæ (skjnldsv)" <skjnldsv@protonmail.com>
Date: Mon, 5 Mar 2018 17:17:10 +0100
Subject: PoC inline icon-confirm with inputs
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
apps/files/js/newfilemenu.js | 2 +-
core/css/inputs.scss | 35 +++++++++++++++++++++++++++++++++++
2 files changed, 36 insertions(+), 1 deletion(-)
diff --git a/apps/files/js/newfilemenu.js b/apps/files/js/newfilemenu.js
index 09420328f29..0b28e158fe0 100644
--- a/apps/files/js/newfilemenu.js
+++ b/apps/files/js/newfilemenu.js
@@ -28,7 +28,7 @@
'<form class="filenameform">' +
'<label class="hidden-visually" for="{{cid}}-input-{{fileType}}">{{fileName}}</label>' +
'<input id="{{cid}}-input-{{fileType}}" type="text" value="{{fileName}}" autocomplete="off" autocapitalize="off">' +
- '<input type="submit" value=" " class="primary icon-checkmark-white" />'
+ '<input type="submit" value=" " class="icon-confirm" />'
'</form>';
/**
diff --git a/core/css/inputs.scss b/core/css/inputs.scss
index 7b74d645481..91f74fbf1fa 100644
--- a/core/css/inputs.scss
+++ b/core/css/inputs.scss
@@ -212,6 +212,41 @@ select {
padding-right: 24px !important;
}
+/* Confirm inputs */
+input {
+ &[type='text'],
+ &[type='password'],
+ &[type='email'] {
+ + .icon-confirm {
+ margin-left: -8px !important;
+ border-left-color: transparent !important;
+ border-radius: 0 $border-radius $border-radius 0 !important;
+ background-clip: padding-box; /* Avoid background under border */
+ }
+ /* only show confirm borders if input is not focused */
+ &:not(:active):not(:hover):not(:focus){
+ + .icon-confirm {
+ &:active,
+ &:hover,
+ &:focus {
+ border-left-color: $color-primary-element !important;
+ border-radius: $border-radius !important;
+ }
+ }
+ }
+ &:active,
+ &:hover,
+ &:focus {
+ + .icon-confirm {
+ border-color: $color-primary-element !important;
+ border-left-color: transparent !important;
+ }
+ }
+ }
+
+}
+
+
/* Various Fixes */
button img,
.button img {
--
cgit v1.2.3
From 4e6043fd6b8853a6ea20fab6d9f71e21f35f0825 Mon Sep 17 00:00:00 2001
From: "John Molakvoæ (skjnldsv)" <skjnldsv@protonmail.com>
Date: Mon, 5 Mar 2018 17:37:05 +0100
Subject: Fixed tooltip positionning & error display
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
apps/files/css/files.scss | 5 +++--
apps/files/js/newfilemenu.js | 2 +-
core/css/inputs.scss | 1 +
3 files changed, 5 insertions(+), 3 deletions(-)
diff --git a/apps/files/css/files.scss b/apps/files/css/files.scss
index 3012ca171aa..f2d2e7d54f3 100644
--- a/apps/files/css/files.scss
+++ b/apps/files/css/files.scss
@@ -38,10 +38,11 @@
font-weight: normal;
}
-.newFileMenu .error, #fileList .error {
+.newFileMenu .error,
+.newFileMenu .error + .icon-confirm,
+#fileList .error {
color: $color-error;
border-color: $color-error;
- box-shadow: 0 0 6px #f8b9b7;
}
/* FILE TABLE */
diff --git a/apps/files/js/newfilemenu.js b/apps/files/js/newfilemenu.js
index 0b28e158fe0..e27ccd9771f 100644
--- a/apps/files/js/newfilemenu.js
+++ b/apps/files/js/newfilemenu.js
@@ -157,7 +157,7 @@
}
} catch (error) {
$input.attr('title', error);
- $input.tooltip({placement: 'right', trigger: 'manual'});
+ $input.tooltip({placement: 'right', trigger: 'manual', 'container': '.newFileMenu'});
$input.tooltip('fixTitle');
$input.tooltip('show');
$input.addClass('error');
diff --git a/core/css/inputs.scss b/core/css/inputs.scss
index 91f74fbf1fa..0e2a7483041 100644
--- a/core/css/inputs.scss
+++ b/core/css/inputs.scss
@@ -222,6 +222,7 @@ input {
border-left-color: transparent !important;
border-radius: 0 $border-radius $border-radius 0 !important;
background-clip: padding-box; /* Avoid background under border */
+ background-color: $color-main-background !important;
}
/* only show confirm borders if input is not focused */
&:not(:active):not(:hover):not(:focus){
--
cgit v1.2.3
From 8d986160b899684dd5e76c3996ba04902152df4e Mon Sep 17 00:00:00 2001
From: "John Molakvoæ (skjnldsv)" <skjnldsv@protonmail.com>
Date: Tue, 6 Mar 2018 10:21:35 +0100
Subject: Improved inline confirm icon with opacity and fixed ext share loading
state
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
apps/files_sharing/css/public.scss | 16 ---------
apps/files_sharing/js/public.js | 40 ++++++++++++----------
.../lib/Template/ExternalShareMenuAction.php | 4 +--
core/css/icons.scss | 4 +++
core/css/inputs.scss | 18 ++++++----
core/img/actions/confirm-fade.svg | 1 +
6 files changed, 40 insertions(+), 43 deletions(-)
create mode 100644 core/img/actions/confirm-fade.svg
diff --git a/apps/files_sharing/css/public.scss b/apps/files_sharing/css/public.scss
index e040d449129..e30c97ae7aa 100644
--- a/apps/files_sharing/css/public.scss
+++ b/apps/files_sharing/css/public.scss
@@ -105,25 +105,9 @@ thead {
border-color: rgba(0,0,0,0.3) !important;
}
-/* within #save */
-#save .save-form {
- position: relative;
- margin-right: -10px;
-}
#remote_address {
width: 200px;
- margin-right: 4px;
- height: 31px;
-}
-
-#save-button-confirm {
- position: absolute;
- background-color: transparent;
- border: none;
- margin: 0;
- right: 0px;
- height: 40px;
}
#public-upload .avatardiv {
diff --git a/apps/files_sharing/js/public.js b/apps/files_sharing/js/public.js
index ae19500080b..607c50f5028 100644
--- a/apps/files_sharing/js/public.js
+++ b/apps/files_sharing/js/public.js
@@ -271,7 +271,7 @@ OCA.Sharing.PublicApp = {
});
$('#remote_address').on("keyup paste", function() {
- if ($(this).val() === '') {
+ if ($(this).val() === '' || $('#save > .icon.icon-loading-small').length > 0) {
$('#save-button-confirm').prop('disabled', true);
} else {
$('#save-button-confirm').prop('disabled', false);
@@ -329,6 +329,7 @@ OCA.Sharing.PublicApp = {
*/
_legacyCreateFederatedShare: function (remote, token, owner, ownerDisplayName, name, isProtected) {
+ var self = this;
var location = window.location.protocol + '//' + window.location.host + OC.webroot;
if(remote.substr(-1) !== '/') {
@@ -346,6 +347,7 @@ OCA.Sharing.PublicApp = {
// this check needs to happen on the server due to the Content Security Policy directive
$.get(OC.generateUrl('apps/files_sharing/testremote'), {remote: remote}).then(function (protocol) {
if (protocol !== 'http' && protocol !== 'https') {
+ self._toggleLoading();
OC.dialogs.alert(t('files_sharing', 'No compatible server found at {remote}', {remote: remote}),
t('files_sharing', 'Invalid server URL'));
} else {
@@ -355,30 +357,30 @@ OCA.Sharing.PublicApp = {
}
},
- _createFederatedShare: function (remote, token, owner, ownerDisplayName, name, isProtected) {
+ _toggleLoading: function() {
+ var loading = $('#save > .icon.icon-loading-small').length === 0;
+ if (loading) {
+ $('#save > .icon-external')
+ .removeClass("icon-external")
+ .addClass("icon-loading-small");
+ $('#save #save-button-confirm').prop("disabled", true);
- var toggleLoading = function() {
- var iconClass = $('#save-button-confirm').attr('class');
- var loading = iconClass.indexOf('icon-loading-small') !== -1;
- if(loading) {
- $('#save-button-confirm')
- .removeClass("icon-loading-small")
- .addClass("icon-confirm");
+ } else {
+ $('#save > .icon-loading-small')
+ .addClass("icon-external")
+ .removeClass("icon-loading-small");
+ $('#save #save-button-confirm').prop("disabled", false);
- }
- else {
- $('#save-button-confirm')
- .removeClass("icon-confirm")
- .addClass("icon-loading-small");
+ }
+ },
- }
- };
+ _createFederatedShare: function (remote, token, owner, ownerDisplayName, name, isProtected) {
+ var self = this;
- toggleLoading();
+ this._toggleLoading();
if (remote.indexOf('@') === -1) {
this._legacyCreateFederatedShare(remote, token, owner, ownerDisplayName, name, isProtected);
- toggleLoading();
return;
}
@@ -402,7 +404,7 @@ OCA.Sharing.PublicApp = {
function (jqXHR) {
OC.dialogs.alert(JSON.parse(jqXHR.responseText).message,
t('files_sharing', 'Failed to add the public link to your Nextcloud'));
- toggleLoading();
+ self._toggleLoading();
}
);
}
diff --git a/apps/files_sharing/lib/Template/ExternalShareMenuAction.php b/apps/files_sharing/lib/Template/ExternalShareMenuAction.php
index f548a3bc6f1..635b301e57c 100644
--- a/apps/files_sharing/lib/Template/ExternalShareMenuAction.php
+++ b/apps/files_sharing/lib/Template/ExternalShareMenuAction.php
@@ -60,9 +60,9 @@ class ExternalShareMenuAction extends SimpleMenuAction {
'<span id="save-button">' . Util::sanitizeHTML($this->getLabel()) . '</span>' .
'<form class="save-form hidden" action="#">' .
'<input type="text" id="remote_address" placeholder="user@yourNextcloud.org">' .
- '<button id="save-button-confirm" class="icon-confirm svg" disabled=""></button>' .
+ '<input type="submit" value=" " id="save-button-confirm" class="icon-confirm" disabled="disabled"></button>' .
'</form>' .
'</a>' .
'</li>';
}
-}
\ No newline at end of file
+}
diff --git a/core/css/icons.scss b/core/css/icons.scss
index 3c3dff56c1a..b4505e24e18 100644
--- a/core/css/icons.scss
+++ b/core/css/icons.scss
@@ -165,6 +165,10 @@ img, object, video, button, textarea, input, select, div[contenteditable=true] {
background-image: url('../img/actions/confirm.svg?v=2');
}
+.icon-confirm-fade {
+ background-image: url('../img/actions/confirm-fade.svg?v=2');
+}
+
.icon-confirm-white {
background-image: url('../img/actions/confirm-white.svg?v=2');
}
diff --git a/core/css/inputs.scss b/core/css/inputs.scss
index 0e2a7483041..caa8209bdbd 100644
--- a/core/css/inputs.scss
+++ b/core/css/inputs.scss
@@ -149,11 +149,6 @@ input[type='reset'] {
cursor: pointer;
box-sizing: border-box;
background-color: nc-darken($color-main-background, 3%);
- &.icon-confirm:not(:empty),
- &.icon-confirm[value]:not([value=""]) {
- background-position: calc(100% - 6px) center;
- padding-right: 30px;
- }
}
/* Buttons */
@@ -223,6 +218,14 @@ input {
border-radius: 0 $border-radius $border-radius 0 !important;
background-clip: padding-box; /* Avoid background under border */
background-color: $color-main-background !important;
+ opacity: 1;
+ width: 16px;
+ padding: 7px 6px;
+ cursor: pointer;
+ &:disabled {
+ cursor: default;
+ background-image: url('../img/actions/confirm-fade.svg?v=2') !important;
+ }
}
/* only show confirm borders if input is not focused */
&:not(:active):not(:hover):not(:focus){
@@ -230,8 +233,11 @@ input {
&:active,
&:hover,
&:focus {
- border-left-color: $color-primary-element !important;
+ border-color: $color-primary-element !important;
border-radius: $border-radius !important;
+ &:disabled {
+ border-color: nc-darken($color-main-background, 14%) !important;
+ }
}
}
}
diff --git a/core/img/actions/confirm-fade.svg b/core/img/actions/confirm-fade.svg
new file mode 100644
index 00000000000..122af34cd7a
--- /dev/null
+++ b/core/img/actions/confirm-fade.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 16 16" width="16" version="1.1" height="16"><path opacity=".5" d="m8.5 0.5c-0.8974 0-1.3404 1.0909-0.6973 1.7168l4.7837 4.7832h-11.573c-1.3523-0.019125-1.3523 2.0191 0 2h11.572l-4.7832 4.7832c-0.98163 0.94251 0.47155 2.3957 1.4141 1.4141l6.4911-6.49c0.387-0.3878 0.391-1.0228 0-1.414l-6.4906-6.4903c-0.1883-0.1935-0.4468-0.30268-0.7168-0.3027z"/></svg>
--
cgit v1.2.3
From 966ceca8eaf9d06d9f0528c83168a2942ca7e279 Mon Sep 17 00:00:00 2001
From: "John Molakvoæ (skjnldsv)" <skjnldsv@protonmail.com>
Date: Wed, 7 Mar 2018 10:29:09 +0100
Subject: Removed unwanted conflicting props
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
core/css/styles.scss | 23 ++++++-----------------
1 file changed, 6 insertions(+), 17 deletions(-)
diff --git a/core/css/styles.scss b/core/css/styles.scss
index 18a298d39b6..5a927046c03 100644
--- a/core/css/styles.scss
+++ b/core/css/styles.scss
@@ -254,28 +254,17 @@ body {
}
#controls {
- .button, button {
- box-sizing: border-box;
- display: inline-block;
- height: 36px;
- padding: 7px 10px;
- }
- input {
- &[type='submit'], &[type='text'], &[type='password'] {
+ > div,
+ & {
+ > .button, button {
box-sizing: border-box;
display: inline-block;
height: 36px;
padding: 7px 10px;
}
- }
- select {
- box-sizing: border-box;
- display: inline-block;
- height: 36px;
- padding: 7px 10px;
- }
- .button.hidden {
- display: none;
+ .button.hidden {
+ display: none;
+ }
}
}
--
cgit v1.2.3
From e77bddf56b80c0f9ebcb1c3322c8086af7231330 Mon Sep 17 00:00:00 2001
From: "John Molakvoæ (skjnldsv)" <skjnldsv@protonmail.com>
Date: Wed, 7 Mar 2018 12:42:26 +0100
Subject: Css hack to add margin on first or last visible inputs
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
core/css/apps.scss | 9 +++++++++
1 file changed, 9 insertions(+)
diff --git a/core/css/apps.scss b/core/css/apps.scss
index 1389938a325..9f8a33956e0 100644
--- a/core/css/apps.scss
+++ b/core/css/apps.scss
@@ -903,6 +903,15 @@ kbd {
}
}
}
+ /* css hack, only first not hidden*/
+ &:not(.hidden):not([style*='display: none']) {
+ &:first-of-type input {
+ margin-top: 10px;
+ }
+ &:last-of-type input {
+ margin-bottom: 10px;
+ }
+ }
> button {
padding: 0;
span {
--
cgit v1.2.3
From e2910e17b09acc0a1c29ba687ffd78f13c1dbdc0 Mon Sep 17 00:00:00 2001
From: "John Molakvoæ (skjnldsv)" <skjnldsv@protonmail.com>
Date: Wed, 7 Mar 2018 13:16:19 +0100
Subject: Default left margin for entries without icons
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
core/css/apps.scss | 10 ++++++++++
1 file changed, 10 insertions(+)
diff --git a/core/css/apps.scss b/core/css/apps.scss
index 9f8a33956e0..670924ee0fb 100644
--- a/core/css/apps.scss
+++ b/core/css/apps.scss
@@ -841,6 +841,16 @@ kbd {
assure correct position of a possible text */
padding: 18px 0 18px 36px;
}
+ // If no icons set, force left margin to align
+ &:not([class^='icon-']):not([class*='icon-']) {
+ > span,
+ > input,
+ > form {
+ &:not([class^='icon-']):not([class*='icon-']):first-of-type {
+ margin-left: 36px;
+ }
+ }
+ }
&[class^='icon-'],
&[class*=' icon-'] {
padding: 0 10px 0 36px !important;
--
cgit v1.2.3
From 446a3a9d5a9ea552f93b7621bb798b0f573f1bd7 Mon Sep 17 00:00:00 2001
From: "John Molakvoæ (skjnldsv)" <skjnldsv@protonmail.com>
Date: Wed, 7 Mar 2018 14:57:07 +0100
Subject: Fixed ext share style and use varable for popover height
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
apps/files/js/newfilemenu.js | 1 -
apps/files_sharing/css/public.scss | 3 +-
apps/files_sharing/js/public.js | 6 ---
.../lib/Template/ExternalShareMenuAction.php | 8 ++-
core/css/apps.scss | 59 +++++++++++++++-------
5 files changed, 48 insertions(+), 29 deletions(-)
diff --git a/apps/files/js/newfilemenu.js b/apps/files/js/newfilemenu.js
index e27ccd9771f..cbe9ced8af4 100644
--- a/apps/files/js/newfilemenu.js
+++ b/apps/files/js/newfilemenu.js
@@ -26,7 +26,6 @@
var TEMPLATE_FILENAME_FORM =
'<form class="filenameform">' +
- '<label class="hidden-visually" for="{{cid}}-input-{{fileType}}">{{fileName}}</label>' +
'<input id="{{cid}}-input-{{fileType}}" type="text" value="{{fileName}}" autocomplete="off" autocapitalize="off">' +
'<input type="submit" value=" " class="icon-confirm" />'
'</form>';
diff --git a/apps/files_sharing/css/public.scss b/apps/files_sharing/css/public.scss
index e30c97ae7aa..cc3788884e7 100644
--- a/apps/files_sharing/css/public.scss
+++ b/apps/files_sharing/css/public.scss
@@ -105,8 +105,7 @@ thead {
border-color: rgba(0,0,0,0.3) !important;
}
-
-#remote_address {
+#share-menu input[type='text'] {
width: 200px;
}
diff --git a/apps/files_sharing/js/public.js b/apps/files_sharing/js/public.js
index 607c50f5028..4b3ede24389 100644
--- a/apps/files_sharing/js/public.js
+++ b/apps/files_sharing/js/public.js
@@ -278,12 +278,6 @@ OCA.Sharing.PublicApp = {
}
});
- $('#save #save-button').click(function () {
- $(this).hide();
- $('.save-form').css('display', 'inline');
- $('#remote_address').focus();
- });
-
// legacy
window.FileList = this.fileList;
},
diff --git a/apps/files_sharing/lib/Template/ExternalShareMenuAction.php b/apps/files_sharing/lib/Template/ExternalShareMenuAction.php
index 635b301e57c..0a6608ac8ca 100644
--- a/apps/files_sharing/lib/Template/ExternalShareMenuAction.php
+++ b/apps/files_sharing/lib/Template/ExternalShareMenuAction.php
@@ -58,11 +58,15 @@ class ExternalShareMenuAction extends SimpleMenuAction {
'<a id="save" data-protected="false" data-owner-display-name="' . Util::sanitizeHTML($this->displayname) . '" data-owner="' . Util::sanitizeHTML($this->owner) . '" data-name="' . Util::sanitizeHTML($this->shareName) . '">' .
'<span class="icon ' . Util::sanitizeHTML($this->getIcon()) . '"></span>' .
'<span id="save-button">' . Util::sanitizeHTML($this->getLabel()) . '</span>' .
- '<form class="save-form hidden" action="#">' .
+ '</a>' .
+ '</li>' .
+ '<li>' .
+ '<span class="menuitem">' .
+ '<form class="save-form" action="#">' .
'<input type="text" id="remote_address" placeholder="user@yourNextcloud.org">' .
'<input type="submit" value=" " id="save-button-confirm" class="icon-confirm" disabled="disabled"></button>' .
'</form>' .
- '</a>' .
+ '</span>' .
'</li>';
}
}
diff --git a/core/css/apps.scss b/core/css/apps.scss
index 670924ee0fb..e6f1aaf9d36 100644
--- a/core/css/apps.scss
+++ b/core/css/apps.scss
@@ -737,6 +737,9 @@ kbd {
}
/* POPOVER MENU ------------------------------------------------------------- */
+$popoveritem-height: 38px;
+$popovericon-size: 16px;
+
.ie,
.edge {
.bubble, .bubble:after,
@@ -813,11 +816,11 @@ kbd {
> a,
> .menuitem {
cursor: pointer;
- line-height: 38px;
+ line-height: $popoveritem-height;
border: 0;
background-color: transparent;
display: flex;
- align-items: center;
+ align-items: flex-start;
height: auto;
margin: 0;
font-weight: 300;
@@ -832,28 +835,28 @@ kbd {
&[class*=' icon-'] {
min-width: 0; /* Overwrite icons*/
min-height: 0;
- background-position: 10px center;
- background-size: 16px;
+ background-position: #{($popoveritem-height - $popovericon-size) / 2} center;
+ background-size: $popovericon-size;
}
span[class^='icon-'],
span[class*=' icon-'] {
/* Keep padding to define the width to
assure correct position of a possible text */
- padding: 18px 0 18px 36px;
+ padding: #{$popoveritem-height / 2} 0 #{$popoveritem-height / 2} $popoveritem-height;
}
// If no icons set, force left margin to align
&:not([class^='icon-']):not([class*='icon-']) {
> span,
> input,
> form {
- &:not([class^='icon-']):not([class*='icon-']):first-of-type {
- margin-left: 36px;
+ &:not([class^='icon-']):not([class*='icon-']):first-child {
+ margin-left: $popoveritem-height;
}
}
}
&[class^='icon-'],
&[class*=' icon-'] {
- padding: 0 10px 0 36px !important;
+ padding: 0 #{($popoveritem-height - $popovericon-size) / 2} 0 $popoveritem-height !important;
}
&:hover, &:focus, &.active {
opacity: 1 !important;
@@ -879,9 +882,11 @@ kbd {
&:not(:empty) {
padding-right: 10px !important;
}
+ /* DEPRECATED! old img in popover fallback
+ * TODO: to remove */
> img {
- width: 16px;
- padding: 0 10px;
+ width: $popovericon-size;
+ padding: #{($popoveritem-height - $popovericon-size) / 2};
}
/* checkbox/radio fixes */
> input.radio + label,
@@ -901,25 +906,43 @@ kbd {
form {
display: flex;
flex: 1 1 auto;
+ /* put a small space between text and form
+ if there is an element before */
+ &:not(:first-child) {
+ margin-left: 5px;
+ }
+ }
+ /* no margin if hidden span before */
+ > span.hidden + form,
+ > span[style*='display:none'] + form {
+ margin-left: 0;
}
/* Inputs inside popover supports text, submit & reset */
input {
- min-width: 34px;
- max-height: 34px;
+ min-width: #{$popoveritem-height - 4px}; /* twice the margin */
+ max-height: #{$popoveritem-height - 4px}; /* twice the margin */
margin: 2px 0;
flex: 1 1 auto;
- ~ input {
+ &:not(:first-child) {
margin-left: 5px;
}
}
}
/* css hack, only first not hidden*/
- &:not(.hidden):not([style*='display: none']) {
- &:first-of-type input {
- margin-top: 10px;
+ &:not(.hidden):not([style*='display:none']) {
+ &:first-of-type {
+ > button, > a, > .menuitem {
+ > form, > input {
+ margin-top: 10px;
+ }
+ }
}
- &:last-of-type input {
- margin-bottom: 10px;
+ &:last-of-type {
+ > button, > a, > .menuitem {
+ > form, > input {
+ margin-bottom: 10px;
+ }
+ }
}
}
> button {
--
cgit v1.2.3
From 5dbd09f07cddafd59d96ee632ca967df151ab701 Mon Sep 17 00:00:00 2001
From: "John Molakvoæ (skjnldsv)" <skjnldsv@protonmail.com>
Date: Wed, 7 Mar 2018 15:17:54 +0100
Subject: Align radio & checkboxes
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
core/css/apps.scss | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
diff --git a/core/css/apps.scss b/core/css/apps.scss
index e6f1aaf9d36..fc255aca676 100644
--- a/core/css/apps.scss
+++ b/core/css/apps.scss
@@ -895,10 +895,10 @@ $popovericon-size: 16px;
width: 100%;
}
> input.checkbox + label::before {
- margin: -2px 12px 0;
+ margin: -2px 13px 0;
}
> input.radio + label::before {
- margin: -2px 11px 0;
+ margin: -2px 12px 0;
}
> input:not([type=radio]):not([type=checkbox]):not([type=image]) {
width: 150px;
--
cgit v1.2.3
From e1ec4514ccc8550d174cb63df53a361e96f749f8 Mon Sep 17 00:00:00 2001
From: "John Molakvoæ (skjnldsv)" <skjnldsv@protonmail.com>
Date: Wed, 7 Mar 2018 15:28:03 +0100
Subject: Use label for better focus on external share
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
apps/files_sharing/lib/Template/ExternalShareMenuAction.php | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/apps/files_sharing/lib/Template/ExternalShareMenuAction.php b/apps/files_sharing/lib/Template/ExternalShareMenuAction.php
index 0a6608ac8ca..e30a77cb2e6 100644
--- a/apps/files_sharing/lib/Template/ExternalShareMenuAction.php
+++ b/apps/files_sharing/lib/Template/ExternalShareMenuAction.php
@@ -57,7 +57,7 @@ class ExternalShareMenuAction extends SimpleMenuAction {
return '<li>' .
'<a id="save" data-protected="false" data-owner-display-name="' . Util::sanitizeHTML($this->displayname) . '" data-owner="' . Util::sanitizeHTML($this->owner) . '" data-name="' . Util::sanitizeHTML($this->shareName) . '">' .
'<span class="icon ' . Util::sanitizeHTML($this->getIcon()) . '"></span>' .
- '<span id="save-button">' . Util::sanitizeHTML($this->getLabel()) . '</span>' .
+ '<label for="remote_address">' . Util::sanitizeHTML($this->getLabel()) . '</label>' .
'</a>' .
'</li>' .
'<li>' .
--
cgit v1.2.3
From 3ef4131533f0fd2c06b05fd2e893d5c4f9720063 Mon Sep 17 00:00:00 2001
From: "John Molakvoæ (skjnldsv)" <skjnldsv@protonmail.com>
Date: Wed, 7 Mar 2018 17:10:46 +0100
Subject: Fixed event propagation on safari
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
apps/files/js/newfilemenu.js | 4 +++-
1 file changed, 3 insertions(+), 1 deletion(-)
diff --git a/apps/files/js/newfilemenu.js b/apps/files/js/newfilemenu.js
index cbe9ced8af4..a340b8b6218 100644
--- a/apps/files/js/newfilemenu.js
+++ b/apps/files/js/newfilemenu.js
@@ -172,7 +172,9 @@
}
});
- $submit.click(function(){
+ $submit.click(function(event) {
+ event.stopPropagation();
+ event.preventDefault();
$form.submit();
});
--
cgit v1.2.3
From cee5be6ff262cf28af81a10c18e8cfd415b129aa Mon Sep 17 00:00:00 2001
From: "John Molakvoæ (skjnldsv)" <skjnldsv@protonmail.com>
Date: Thu, 8 Mar 2018 10:31:33 +0100
Subject: Fixed jsunit
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
---
apps/files/tests/js/newfilemenuSpec.js | 3 ++-
1 file changed, 2 insertions(+), 1 deletion(-)
diff --git a/apps/files/tests/js/newfilemenuSpec.js b/apps/files/tests/js/newfilemenuSpec.js
index 20f617d24d6..af998c14916 100644
--- a/apps/files/tests/js/newfilemenuSpec.js
+++ b/apps/files/tests/js/newfilemenuSpec.js
@@ -67,7 +67,8 @@ describe('OCA.Files.NewFileMenu', function() {
});
it('sets default text in field', function() {
- expect($input.length).toEqual(1);
+ // text + submit
+ expect($input.length).toEqual(2);
expect($input.val()).toEqual('New folder');
});
it('prevents entering invalid file names', function() {
--
cgit v1.2.3