From 99bce536cdd658432e12a9d7a3e89ebd1e0c9f06 Mon Sep 17 00:00:00 2001 From: Bruno Windels Date: Wed, 8 Jul 2020 17:30:50 +0200 Subject: [PATCH] update call icons --- res/css/structures/_RoomView.scss | 2 +- res/css/views/dialogs/_UserSettingsDialog.scss | 2 +- res/css/views/rooms/_MessageComposer.scss | 11 ++++++++--- res/img/element-icons/call/hangup.svg | 3 +++ res/img/element-icons/{ => call}/video-call.svg | 0 res/img/element-icons/{ => call}/voice-call.svg | 0 res/img/element-icons/call/voice-muted.svg | 4 ++++ res/img/element-icons/call/voice-unmuted.svg | 3 +++ res/img/element-icons/room/in-call.svg | 6 ++++++ src/components/structures/RoomStatusBar.js | 2 +- src/components/structures/RoomView.js | 11 ++++++----- 11 files changed, 33 insertions(+), 11 deletions(-) create mode 100644 res/img/element-icons/call/hangup.svg rename res/img/element-icons/{ => call}/video-call.svg (100%) rename res/img/element-icons/{ => call}/voice-call.svg (100%) create mode 100644 res/img/element-icons/call/voice-muted.svg create mode 100644 res/img/element-icons/call/voice-unmuted.svg create mode 100644 res/img/element-icons/room/in-call.svg diff --git a/res/css/structures/_RoomView.scss b/res/css/structures/_RoomView.scss index f2154ef448..3b60c4e62b 100644 --- a/res/css/structures/_RoomView.scss +++ b/res/css/structures/_RoomView.scss @@ -261,7 +261,7 @@ hr.mx_RoomView_myReadMarker { .mx_RoomView_voipButton { float: right; margin-right: 13px; - margin-top: 10px; + margin-top: 13px; cursor: pointer; } diff --git a/res/css/views/dialogs/_UserSettingsDialog.scss b/res/css/views/dialogs/_UserSettingsDialog.scss index 0612950ab4..bd472710ea 100644 --- a/res/css/views/dialogs/_UserSettingsDialog.scss +++ b/res/css/views/dialogs/_UserSettingsDialog.scss @@ -26,7 +26,7 @@ limitations under the License. } .mx_UserSettingsDialog_voiceIcon::before { - mask-image: url('$(res)/img/element-icons/voice-call.svg'); + mask-image: url('$(res)/img/element-icons/call/voice-call.svg'); } .mx_UserSettingsDialog_bellIcon::before { diff --git a/res/css/views/rooms/_MessageComposer.scss b/res/css/views/rooms/_MessageComposer.scss index 84283444ab..8af9d36fee 100644 --- a/res/css/views/rooms/_MessageComposer.scss +++ b/res/css/views/rooms/_MessageComposer.scss @@ -196,22 +196,27 @@ limitations under the License. mask-size: contain; mask-position: center; } + + &.mx_MessageComposer_hangup::before { + background-color: $warning-color; + } } + .mx_MessageComposer_upload::before { mask-image: url('$(res)/img/element-icons/room/composer/attach.svg'); } .mx_MessageComposer_hangup::before { - mask-image: url('$(res)/img/hangup.svg'); + mask-image: url('$(res)/img/element-icons/call/hangup.svg'); } .mx_MessageComposer_voicecall::before { - mask-image: url('$(res)/img/element-icons/voice-call.svg'); + mask-image: url('$(res)/img/element-icons/call/voice-call.svg'); } .mx_MessageComposer_videocall::before { - mask-image: url('$(res)/img/element-icons/video-call.svg'); + mask-image: url('$(res)/img/element-icons/call/video-call.svg'); } .mx_MessageComposer_emoji::before { diff --git a/res/img/element-icons/call/hangup.svg b/res/img/element-icons/call/hangup.svg new file mode 100644 index 0000000000..1a1b82a1d7 --- /dev/null +++ b/res/img/element-icons/call/hangup.svg @@ -0,0 +1,3 @@ + + + diff --git a/res/img/element-icons/video-call.svg b/res/img/element-icons/call/video-call.svg similarity index 100% rename from res/img/element-icons/video-call.svg rename to res/img/element-icons/call/video-call.svg diff --git a/res/img/element-icons/voice-call.svg b/res/img/element-icons/call/voice-call.svg similarity index 100% rename from res/img/element-icons/voice-call.svg rename to res/img/element-icons/call/voice-call.svg diff --git a/res/img/element-icons/call/voice-muted.svg b/res/img/element-icons/call/voice-muted.svg new file mode 100644 index 0000000000..32abafb04a --- /dev/null +++ b/res/img/element-icons/call/voice-muted.svg @@ -0,0 +1,4 @@ + + + + diff --git a/res/img/element-icons/call/voice-unmuted.svg b/res/img/element-icons/call/voice-unmuted.svg new file mode 100644 index 0000000000..e664080217 --- /dev/null +++ b/res/img/element-icons/call/voice-unmuted.svg @@ -0,0 +1,3 @@ + + + diff --git a/res/img/element-icons/room/in-call.svg b/res/img/element-icons/room/in-call.svg new file mode 100644 index 0000000000..0e574faa84 --- /dev/null +++ b/res/img/element-icons/room/in-call.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/src/components/structures/RoomStatusBar.js b/src/components/structures/RoomStatusBar.js index 65d062cfaa..3171dbccbe 100644 --- a/src/components/structures/RoomStatusBar.js +++ b/src/components/structures/RoomStatusBar.js @@ -173,7 +173,7 @@ export default createReactClass({ if (this.props.hasActiveCall) { const TintableSvg = sdk.getComponent("elements.TintableSvg"); return ( - + ); } diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js index 519c4c1f8e..9127cc0ce9 100644 --- a/src/components/structures/RoomView.js +++ b/src/components/structures/RoomView.js @@ -1933,7 +1933,7 @@ export default createReactClass({ } if (inCall) { - let zoomButton; let voiceMuteButton; let videoMuteButton; + let zoomButton; let videoMuteButton; if (call.type === "video") { zoomButton = ( @@ -1946,12 +1946,14 @@ export default createReactClass({
+ width="" height="27" />
; } - voiceMuteButton = + const voiceMuteButton =
-
; @@ -1963,7 +1965,6 @@ export default createReactClass({ { videoMuteButton } { zoomButton } { statusBar } - ; }