-
Notifications
You must be signed in to change notification settings - Fork 454
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Creating an additional span #7
Comments
Hello, Thanks for the feedback. Theses are valid features that we may tackle in the future but can't commit resources to it right now. In the mean time, here are some notes for future reference or if you/someone wants to to take a stab at it:
I'll keep this issue open as a feature request. |
The latest release (https://github.com/awslabs/aws-lex-web-ui/releases/tag/0.12.0) added support for Bot avatars and message dates. That takes care of item 1) and 2) in the list above. The feature are controlled by the |
…the simplified UI screens from Wongdoody Description: The tease bubble should reflect the UI example screens. Changes: - Change #1: lex-web-ui/src/components/LexWeb.vue, Line 709 Set the visibility for the .message-list-wrapper component to 'hidden' so that its container would no longer be rendered - Change #2: lex-web-ui/src/components/LexWeb.vue b/lex-web-ui/src/components/LexWeb.vue - Lines 720-729 Modified border-radius values in order to make the 'point' on the bottom-right of the tease bubble. Added a 'visibility: visible' so that this child container would now be visible after the above change; removed the 'margin-right' so that the tease bubble would appear closer to the Hope logo; added a small border to the top of the tease bubble to help it stand out against the white input field above it. - Change #3: lex-web-ui/src/components/LexWeb.vue b/lex-web-ui/src/components/LexWeb.vue - Lines 731-745 Removed the padding on the dismiss icon; moved the icon to the top-left of the tease bubble; made the icon visible for the same reason as above; set a lightgrey background color; made the icon have a circular background - Change #4: src/lex-web-ui-loader/css/lex-web-ui-iframe.css - Lines 24, 43, 88, 111 Increased height of the tease bubble container and decreased the width; removed the border-radius. - Change #5: src/lex-web-ui-loader/css/lex-web-ui-iframe.css - Line 71 Removed the 'display: none' that was making the tease bubble disappear - Change #6: src/website/custom-chatbot-style.css - Line 26 Added height and width values to the gutter mode Hope logo as it was appearing off of the page - Change #7: src/website/custom-chatbot-style.css - Lines 44-59 Decreased the height and width of the logo container
…the simplified UI screens from Wongdoody Description: The tease bubble should reflect the UI example screens. Changes: - Change #1: lex-web-ui/src/components/LexWeb.vue, Line 709 Set the visibility for the .message-list-wrapper component to 'hidden' so that its container would no longer be rendered - Change #2: lex-web-ui/src/components/LexWeb.vue b/lex-web-ui/src/components/LexWeb.vue - Lines 720-729 Modified border-radius values in order to make the 'point' on the bottom-right of the tease bubble. Added a 'visibility: visible' so that this child container would now be visible after the above change; removed the 'margin-right' so that the tease bubble would appear closer to the Hope logo; added a small border to the top of the tease bubble to help it stand out against the white input field above it. - Change #3: lex-web-ui/src/components/LexWeb.vue b/lex-web-ui/src/components/LexWeb.vue - Lines 731-745 Removed the padding on the dismiss icon; moved the icon to the top-left of the tease bubble; made the icon visible for the same reason as above; set a lightgrey background color; made the icon have a circular background - Change #4: src/lex-web-ui-loader/css/lex-web-ui-iframe.css - Lines 24, 43, 88, 111 Increased height of the tease bubble container and decreased the width; removed the border-radius. - Change #5: src/lex-web-ui-loader/css/lex-web-ui-iframe.css - Line 71 Removed the 'display: none' that was making the tease bubble disappear - Change #6: src/website/custom-chatbot-style.css - Line 26 Added height and width values to the gutter mode Hope logo as it was appearing off of the page - Change #7: src/website/custom-chatbot-style.css - Lines 44-59 Decreased the height and width of the logo container
Hi,
The UI that was provided is really beautiful and awesome. Here on top of what ever was provided, I was trying to do the below tasks.
But I'm really sorry to say that the code is quite confusing (That's my bad, I've no idea about the Vue.js), I've deployed the files to my S3 and running them.
Please let me know how can I add my own html entities like buttons/span/div etc...
Thanks
The text was updated successfully, but these errors were encountered: