From 876d44a16192d4c584a1222c383faa40aa151ff9 Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Tue, 9 Jan 2018 16:46:53 +0100 Subject: [PATCH 1/7] Replace triangle sidebar trigger with dedicated icon Signed-off-by: Jan-Christoph Borchardt --- css/style.css | 39 +++++++++------------------------------ img/menu-people.svg | 1 + js/views/sidebarview.js | 4 +--- 3 files changed, 11 insertions(+), 33 deletions(-) create mode 100644 img/menu-people.svg diff --git a/css/style.css b/css/style.css index b9d0bac37c4..1950d27e4ce 100644 --- a/css/style.css +++ b/css/style.css @@ -445,12 +445,14 @@ video { } #video-fullscreen, -.nameIndicator button { +.nameIndicator button, +#app-sidebar-trigger { background-color: transparent; border: none; + margin: 0; width: 44px; height: 44px; - background-size: 25px; + background-size: 24px; } .nameIndicator button.audio-disabled, @@ -672,40 +674,17 @@ video { position: fixed; /* Although it would be desirable due to their complementary behaviour, the * trigger can not be placed at the same position as the close button - * (top: 45px) due to the "Switch to fullscreen" icon shown during calls. */ - top: 150px; + * (top: 45px) due to the "Switch to fullscreen" icon shown during calls. + * Set to 45px (header) + 44px (fullscreen icon). */ + top: 89px; right: 0; - width: 48px; - height: 48px; /* Higher than the z-index of the emptycontent */ z-index: 50; cursor: pointer; } -#app-sidebar-trigger .large-outer-left-triangle { - position: absolute; - top: 0; - right: 0; - border-width: 24px; - border-color: #ebebeb; - border-style: solid; - border-left-color: transparent; - border-top-color: transparent; - border-bottom-color: transparent; - cursor: pointer; -} - -#app-sidebar-trigger .large-inner-left-triangle { - position: absolute; - top: 2px; - right: 0; - border-width: 22px; - border-color: #fff; - border-style: solid; - border-left-color: transparent; - border-top-color: transparent; - border-bottom-color: transparent; - cursor: pointer; +.icon-menu-people { + background-image: url('../img/menu-people.svg?v=1'); } #app-sidebar .close { diff --git a/img/menu-people.svg b/img/menu-people.svg new file mode 100644 index 00000000000..e47f7e81753 --- /dev/null +++ b/img/menu-people.svg @@ -0,0 +1 @@ + diff --git a/js/views/sidebarview.js b/js/views/sidebarview.js index b6203e08f8e..ed848510587 100644 --- a/js/views/sidebarview.js +++ b/js/views/sidebarview.js @@ -28,9 +28,7 @@ OCA.SpreedMe.Views = OCA.SpreedMe.Views || {}; var TEMPLATE = - '
' + - '
' + - '
' + + '
' + '
' + '
' + '
' + From 8c9c127c49c06260c751d93218761f640e86e7ea Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Tue, 9 Jan 2018 17:13:14 +0100 Subject: [PATCH 2/7] Padding fixes and icons for tab headers Signed-off-by: Jan-Christoph Borchardt --- css/style.css | 28 ++++++++++++++++++++++++++++ 1 file changed, 28 insertions(+) diff --git a/css/style.css b/css/style.css index 1950d27e4ce..17600c58ea5 100644 --- a/css/style.css +++ b/css/style.css @@ -751,6 +751,34 @@ video { display: inline-block; } +/* START: move padding fixes and icons-for-tabs capability into core */ +.tabHeaders .tabHeader { + padding: 12px; + padding-left: 32px; + background-position: 12px; + background-repeat: no-repeat; + opacity: .5; +} + +.tabHeaders .tabHeader a { + color: #000; +} + +.tabHeaders .tabHeader.selected, +.tabHeaders .tabHeader:hover, +.tabHeaders .tabHeader:focus { + opacity: 1; +} + +#tabHeaderChat { + background-image: url('../../../core/img/actions/comment.svg?v=1'); +} + +#tabHeaderParticipants { + background-image: url('../../../core/img/places/contacts-dark.svg?v=1'); +} +/* END: move padding fixes and icons-for-tabs capability into core */ + #app-sidebar.hidden { display: none !important; } From 9ad16ca7be0d6452aa4b4c00f5f0fba741bd0113 Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Tue, 9 Jan 2018 17:13:50 +0100 Subject: [PATCH 3/7] Move style.css to SCSS Signed-off-by: Jan-Christoph Borchardt --- css/{style.css => style.scss} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename css/{style.css => style.scss} (100%) diff --git a/css/style.css b/css/style.scss similarity index 100% rename from css/style.css rename to css/style.scss From 2e146cee3195e7e307135fadfa7479c116f5e48e Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Tue, 9 Jan 2018 17:14:09 +0100 Subject: [PATCH 4/7] Use variable for text color Signed-off-by: Jan-Christoph Borchardt --- css/style.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/css/style.scss b/css/style.scss index 17600c58ea5..cc50bfb94c0 100644 --- a/css/style.scss +++ b/css/style.scss @@ -761,7 +761,7 @@ video { } .tabHeaders .tabHeader a { - color: #000; + color: $color-main-text; } .tabHeaders .tabHeader.selected, From 83e1a062588a088ac43076c47a83da0ba46d69c8 Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Tue, 9 Jan 2018 17:19:36 +0100 Subject: [PATCH 5/7] Reduce whitespace between room info and tabs Signed-off-by: Jan-Christoph Borchardt --- css/style.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/css/style.scss b/css/style.scss index cc50bfb94c0..1461c116434 100644 --- a/css/style.scss +++ b/css/style.scss @@ -752,6 +752,10 @@ video { } /* START: move padding fixes and icons-for-tabs capability into core */ +.tabHeaders { + margin-top: 0; +} + .tabHeaders .tabHeader { padding: 12px; padding-left: 32px; From 43881c49a21fb21d30b403cf71485c514ad2fd10 Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Tue, 9 Jan 2018 19:53:20 +0100 Subject: [PATCH 6/7] Add some whitespace to guest name, prevent jumping on edit Signed-off-by: Jan-Christoph Borchardt --- css/style.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/css/style.scss b/css/style.scss index 1461c116434..28c3ca18120 100644 --- a/css/style.scss +++ b/css/style.scss @@ -863,6 +863,10 @@ video { display: inline-block; } +.detailCallInfoContainer .guest-name p { + padding: 9px 0; +} + .detailCallInfoContainer .editable-text-label .edit-button { display: none; } From 404ef18dfbc9533010f10aa243301f82cbc114aa Mon Sep 17 00:00:00 2001 From: Jan-Christoph Borchardt Date: Tue, 9 Jan 2018 19:53:50 +0100 Subject: [PATCH 7/7] Improve wording on Copy link icon Signed-off-by: Jan-Christoph Borchardt --- js/views/callinfoview.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/js/views/callinfoview.js b/js/views/callinfoview.js index 2f29abd56bb..3b92bda1736 100644 --- a/js/views/callinfoview.js +++ b/js/views/callinfoview.js @@ -290,13 +290,13 @@ clipboard.on('success', function(e) { var $input = $(e.trigger); $input.tooltip('hide') - .attr('data-original-title', t('core', 'Copied!')) + .attr('data-original-title', t('core', 'Link copied!')) .tooltip('fixTitle') .tooltip({placement: 'bottom', trigger: 'manual'}) .tooltip('show'); _.delay(function() { $input.tooltip('hide') - .attr('data-original-title', t('core', 'Copy')) + .attr('data-original-title', t('core', 'Copy link')) .tooltip('fixTitle'); }, 3000); });