diff --git a/app/javascript/packs/sdk.js b/app/javascript/packs/sdk.js index d4d513d47..8d98a82ad 100755 --- a/app/javascript/packs/sdk.js +++ b/app/javascript/packs/sdk.js @@ -105,8 +105,7 @@ function bubbleClickCallback() { } function onClickChatBubble() { - wootOn(chatBubble, 'click', bubbleClickCallback); - wootOn(closeBubble, 'click', bubbleClickCallback); + wootOn(bubbleHolder, 'click', bubbleClickCallback); } function disableScroll() { diff --git a/app/javascript/widget/assets/images/logo.svg b/app/javascript/widget/assets/images/logo.svg new file mode 100644 index 000000000..16529675d --- /dev/null +++ b/app/javascript/widget/assets/images/logo.svg @@ -0,0 +1,12 @@ + + + + woot-log + Created with Sketch. + + + + + + + \ No newline at end of file diff --git a/app/javascript/widget/assets/images/message-send.svg b/app/javascript/widget/assets/images/message-send.svg index 3295ce96d..2506e365a 100755 --- a/app/javascript/widget/assets/images/message-send.svg +++ b/app/javascript/widget/assets/images/message-send.svg @@ -1,10 +1,10 @@ - - - Untitled + + + message-send Created with Sketch. - - + + diff --git a/app/javascript/widget/components/ChatFooter.vue b/app/javascript/widget/components/ChatFooter.vue index e1fd507de..4313a0d24 100755 --- a/app/javascript/widget/components/ChatFooter.vue +++ b/app/javascript/widget/components/ChatFooter.vue @@ -1,6 +1,10 @@ @@ -30,4 +34,20 @@ export default { padding: $space-small; width: 100%; } + +.branding { + align-items: center; + color: $color-body; + display: flex; + font-size: $font-size-default; + justify-content: center; + padding: $space-one; + text-align: center; + text-decoration: none; + + img { + margin-right: $space-small; + max-width: $space-two; + } +} diff --git a/app/javascript/widget/components/ChatInputArea.vue b/app/javascript/widget/components/ChatInputArea.vue index b6e562ef5..25b312707 100755 --- a/app/javascript/widget/components/ChatInputArea.vue +++ b/app/javascript/widget/components/ChatInputArea.vue @@ -21,8 +21,7 @@ export default { @import '~widget/assets/scss/variables.scss'; .user-message-input { - border-color: $color-white; - border-bottom-color: $color-border-light; + border: 0; height: $space-big; resize: none; } diff --git a/app/javascript/widget/components/ChatInputWrap.vue b/app/javascript/widget/components/ChatInputWrap.vue index c6dc48a99..b492a908c 100755 --- a/app/javascript/widget/components/ChatInputWrap.vue +++ b/app/javascript/widget/components/ChatInputWrap.vue @@ -1,14 +1,10 @@ - - - - - - - + + + @@ -39,13 +35,26 @@ export default { userInput: '', }; }, + destroyed() { + document.removeEventListener('keypress', this.handleEnterKeyPress); + }, + mounted() { + document.addEventListener('keypress', this.handleEnterKeyPress); + }, + methods: { handleButtonClick() { - if (this.userInput) { + if (this.userInput && this.userInput.trim()) { this.onSendMessage(this.userInput); } this.userInput = ''; }, + handleEnterKeyPress(e) { + if (e.keyCode === 13 && !e.shiftKey) { + e.preventDefault(); + this.handleButtonClick(); + } + }, }, }; @@ -53,13 +62,9 @@ export default { diff --git a/app/javascript/widget/components/ChatSendButton.vue b/app/javascript/widget/components/ChatSendButton.vue index e37253d84..7e43c4028 100755 --- a/app/javascript/widget/components/ChatSendButton.vue +++ b/app/javascript/widget/components/ChatSendButton.vue @@ -2,12 +2,11 @@ - Send @@ -42,10 +41,9 @@ export default { @import '~widget/assets/scss/variables.scss'; .send-button { - align-items: center; - display: flex; - justify-content: space-around; - min-width: $space-big; + background: transparent; + border: 0; + cursor: pointer; position: relative; .icon-holder { @@ -54,10 +52,6 @@ export default { justify-content: center; fill: $color-white; font-weight: $font-weight-medium; - - img { - margin-right: $space-small; - } } } diff --git a/app/javascript/widget/components/ConversationWrap.vue b/app/javascript/widget/components/ConversationWrap.vue index 3ced87b89..01813a754 100755 --- a/app/javascript/widget/components/ConversationWrap.vue +++ b/app/javascript/widget/components/ConversationWrap.vue @@ -1,5 +1,5 @@ - + - - - diff --git a/app/javascript/widget/components/HelloWorld.vue b/app/javascript/widget/components/HelloWorld.vue deleted file mode 100755 index 7237f3eab..000000000 --- a/app/javascript/widget/components/HelloWorld.vue +++ /dev/null @@ -1,31 +0,0 @@ - - - {{ msg }} - - - - - - - diff --git a/app/javascript/widget/helpers/actionCable.js b/app/javascript/widget/helpers/actionCable.js index d43e740b8..c8a5bbd33 100644 --- a/app/javascript/widget/helpers/actionCable.js +++ b/app/javascript/widget/helpers/actionCable.js @@ -6,7 +6,6 @@ class ActionCableConnector extends BaseActionCableConnector { this.events = { 'message.created': this.onMessageCreated, }; - console.log('joined', app, pubsubToken); } onMessageCreated = data => { diff --git a/app/javascript/widget/views/Home.vue b/app/javascript/widget/views/Home.vue index 73f4baec2..af2a037ea 100755 --- a/app/javascript/widget/views/Home.vue +++ b/app/javascript/widget/views/Home.vue @@ -3,9 +3,7 @@ - - - + @@ -15,7 +13,6 @@