[add][Refs #9] reply-to

srv/public/index.html

@@ -18,9 +18,9 @@
             <div class="slack-chat-title" id="currentRoomTitle"></div>
             <div class="slack-chat-content" id="chatWindow"></div>
             <ul class="slack-chat-whoistyping" id="whoistyping"></ul>
-            <div id="replyToContainer" class="replyto-container"></div>
-            <ul id="slashList" class="slack-command-list"></ul>
             <div class="slack-chat-control">
+                <div id="replyToContainer" class="replyto-container"></div>
+                <ul id="slashList" class="slack-command-list"></ul>
                 <form id="msgForm" class="msgform">
                     <input type="text" id="msgInput" class="msgform-input" autocomplete="off" />
                     <a id="emojiButton" class="button"/></a>

srv/public/style.css

@@ -49,8 +49,8 @@ body { display: flex; margin: 0; padding: 0; font-family: Lato, sans-serif; heig
 
 .slack-chat-content a:visited,.slack-chat-content a:hover,.slack-chat-content a { color: #909090; }
 
-.slack-chat-control { display: inline-block; width: 100%; height: 2em; padding: 14px 0; }
-.slack-chat-control > * { display: inline-block; height: 100%; }
+.slack-chat-control { position: relative; display: inline-block; width: 100%; padding: 14px 0; }
+.slack-chat-control > * { display: inline-block; }
 .slack-context-room:not(.selected).unread, .slack-context-room:not(.selected).unread > a { font-weight: bold; color: white; }
 .slack-context-room:not(.selected).unreadHi, .slack-context-room:not(.selected).unreadHi > a { font-weight: bold; color: #4c9689; }
 .slackmsg-authorGroup { position: relative; }
@@ -128,7 +128,7 @@ body { display: flex; margin: 0; padding: 0; font-family: Lato, sans-serif; heig
 .slackmsg-attachment-actions-item { display: inline-block; }
 
 .slack-command-list:empty { display: none; }
-.slack-command-list { list-style: none; margin: 10px 10px 0 10px; padding: 0; background: #4D394B; color: #AB9BA9; max-height: 10em; overflow-x: hidden; overflow-y: auto;}
+.slack-command-list { position: absolute; top: 0; left: 0; right: 0; height: auto; list-style: none; margin: 10px 10px 0 10px; padding: 0; background: rgba(77, 57, 75, 0.9); color: #AB9BA9; max-height: 10em; overflow-x: hidden; overflow-y: auto; transform: translate(0, -100%); }
 .slack-command-item { display: flex; margin: 2px 0; }
 .slack-command-item > * { padding: 0 5px; }
 .slack-command-name { font-weight: bold; }