From 0be92fbf9f1770b3c048c7755c4c4f741e91e997 Mon Sep 17 00:00:00 2001 From: sbosse Date: Mon, 21 Jul 2025 23:37:02 +0200 Subject: [PATCH] Mon 21 Jul 22:43:21 CEST 2025 --- js/ui/botui/src/styles/botui.scss | 73 +++++++++++++++++++++++++++++++ 1 file changed, 73 insertions(+) create mode 100644 js/ui/botui/src/styles/botui.scss diff --git a/js/ui/botui/src/styles/botui.scss b/js/ui/botui/src/styles/botui.scss new file mode 100644 index 0000000..f18c6c4 --- /dev/null +++ b/js/ui/botui/src/styles/botui.scss @@ -0,0 +1,73 @@ + +/* + These are the styles to create an interface of a chat/bot +*/ + +.botui-app-container { + width: 100%; // mobile-first + height: 100%; + line-height: 1; + + @media (min-width: 400px) { + width: 400px; + height: 500px; + margin: 0 auto; + } +} + +.botui-container { + width: 100%; + height: 100%; + overflow-y: auto; + overflow-x: hidden; +} + +.botui-message { + margin: 10px 0; + min-height: 20px; + + &:after { + display: block; + content: ""; + clear: both; + } +} + +.botui-message-content { + width: auto; + max-width: 85%; + display: inline-block; + + &.human { + float: right; + } + + iframe { + width: 100%; + } +} + +.botui-message-content-image { + margin: 5px 0; + display: block; + max-width: 200px; + max-height: 200px; +} + +.botui-message-content-link { + text-decoration: underline; +} + +button.botui-actions-buttons-button { + margin-top: 10px; + margin-bottom: 10px; + &:not(:last-child) { + margin-right: 10px; + } +} + +.botui-actions-text-submit { + @media (min-width: 400px) { + display: none; + } +}