Using `.form-group` for toolbar and textarea appears unnecessary

and adds unwanted bottom margin.

mockup/chatbox.html

@@ -80,31 +80,27 @@
                         </div>
 
                         <form class="sendXMPPMessage">
-                            <div class="form-group">
-                                <ul class="chat-toolbar no-text-select">
-                                    <li class="toggle-toolbar-menu toggle-smiley fa fa-smile-o" title="Insert a smiley">
-                                        <div class="emoji-picker-container toolbar-menu collapsed"></div>
-                                    </li>
-                                    <li class="toggle-clear">
-                                        <a class="fa fa-trash" title="Clear all messages"></a>
-                                    </li>
-                                    <li class="toggle-toolbar-menu toggle-otr unencrypted" title="Your messages are not encrypted. Click here to enable OTR encryption.">
-                                        <span class="chat-toolbar-text">unencrypted</span>
-                                        <span class="fa fa-unlock"></span>
-                                        <ul class="toolbar-menu collapsed">
-                                            <li>
-                                                <a class="start-otr" href="#">Start encrypted conversation</a>
-                                            </li>
-                                            <li>
-                                                <a href="http://www.cypherpunks.ca/otr/help/3.2.0/levels.php" target="_blank" rel="noopener">What's this?</a>
-                                            </li>
-                                        </ul>
-                                    </li>
-                                </ul>
-                            </div>
-                            <div class="form-group">
-                                <textarea class="chat-textarea form-control" placeholder="Personal message"></textarea>
-                            </div>
+                            <ul class="chat-toolbar no-text-select">
+                                <li class="toggle-toolbar-menu toggle-smiley fa fa-smile-o" title="Insert a smiley">
+                                    <div class="emoji-picker-container toolbar-menu collapsed"></div>
+                                </li>
+                                <li class="toggle-clear">
+                                    <a class="fa fa-trash" title="Clear all messages"></a>
+                                </li>
+                                <li class="toggle-toolbar-menu toggle-otr unencrypted" title="Your messages are not encrypted. Click here to enable OTR encryption.">
+                                    <span class="chat-toolbar-text">unencrypted</span>
+                                    <span class="fa fa-unlock"></span>
+                                    <ul class="toolbar-menu collapsed">
+                                        <li>
+                                            <a class="start-otr" href="#">Start encrypted conversation</a>
+                                        </li>
+                                        <li>
+                                            <a href="http://www.cypherpunks.ca/otr/help/3.2.0/levels.php" target="_blank" rel="noopener">What's this?</a>
+                                        </li>
+                                    </ul>
+                                </li>
+                            </ul>
+                            <textarea class="chat-textarea form-control" placeholder="Personal message"></textarea>
                         </form>
                     </div>
                 </div>

mockup/chatroom.html

@@ -74,16 +74,12 @@
                                     </div>
                                 </div>
                                 <form class="sendXMPPMessage">
-                                    <div class="form-group">
-                                        <ul class="chat-toolbar no-text-select">
-                                            <li class="toggle-smiley fa fa-smile-o" title="Insert a smiley"></li>
-                                            <li class="toggle-occupants"><a class="fa fa-user-times" title="Hide the list of occupants"></a></li>
-                                            <li class="toggle-clear"><a class="fa fa-times" title="Clear all messages"></a></li>
-                                        </ul>
-                                    </div>
-                                    <div class="form-group">
-                                        <textarea class="chat-textarea form-control" placeholder="Message"></textarea>
-                                    </div>
+                                    <ul class="chat-toolbar no-text-select">
+                                        <li class="toggle-smiley fa fa-smile-o" title="Insert a smiley"></li>
+                                        <li class="toggle-occupants"><a class="fa fa-user-times" title="Hide the list of occupants"></a></li>
+                                        <li class="toggle-clear"><a class="fa fa-times" title="Clear all messages"></a></li>
+                                    </ul>
+                                    <textarea class="chat-textarea form-control" placeholder="Message"></textarea>
                                 </form>
                             </div>
 

mockup/converse.html

@@ -84,31 +84,27 @@
                         </div>
 
                         <form class="sendXMPPMessage">
-                            <div class="form-group">
-                                <ul class="chat-toolbar no-text-select">
-                                    <li class="toggle-toolbar-menu toggle-smiley fa fa-smile-o" title="Insert a smiley">
-                                        <div class="emoji-picker-container toolbar-menu collapsed"></div>
-                                    </li>
-                                    <li class="toggle-clear">
-                                        <a class="fa fa-trash" title="Clear all messages"></a>
-                                    </li>
-                                    <li class="toggle-toolbar-menu toggle-otr unencrypted" title="Your messages are not encrypted. Click here to enable OTR encryption.">
-                                        <span class="chat-toolbar-text">unencrypted</span>
-                                        <span class="fa fa-unlock"></span>
-                                        <ul class="toolbar-menu collapsed">
-                                            <li>
-                                                <a class="start-otr" href="#">Start encrypted conversation</a>
-                                            </li>
-                                            <li>
-                                                <a href="http://www.cypherpunks.ca/otr/help/3.2.0/levels.php" target="_blank" rel="noopener">What's this?</a>
-                                            </li>
-                                        </ul>
-                                    </li>
-                                </ul>
-                            </div>
-                            <div class="form-group">
-                                <textarea class="chat-textarea form-control" placeholder="Personal message"></textarea>
-                            </div>
+                            <ul class="chat-toolbar no-text-select">
+                                <li class="toggle-toolbar-menu toggle-smiley fa fa-smile-o" title="Insert a smiley">
+                                    <div class="emoji-picker-container toolbar-menu collapsed"></div>
+                                </li>
+                                <li class="toggle-clear">
+                                    <a class="fa fa-trash" title="Clear all messages"></a>
+                                </li>
+                                <li class="toggle-toolbar-menu toggle-otr unencrypted" title="Your messages are not encrypted. Click here to enable OTR encryption.">
+                                    <span class="chat-toolbar-text">unencrypted</span>
+                                    <span class="fa fa-unlock"></span>
+                                    <ul class="toolbar-menu collapsed">
+                                        <li>
+                                            <a class="start-otr" href="#">Start encrypted conversation</a>
+                                        </li>
+                                        <li>
+                                            <a href="http://www.cypherpunks.ca/otr/help/3.2.0/levels.php" target="_blank" rel="noopener">What's this?</a>
+                                        </li>
+                                    </ul>
+                                </li>
+                            </ul>
+                            <textarea class="chat-textarea form-control" placeholder="Personal message"></textarea>
                         </form>
                     </div>
                 </div>
@@ -168,16 +164,12 @@
                                     </div>
                                 </div>
                                 <form class="sendXMPPMessage">
-                                    <div class="form-group">
-                                        <ul class="chat-toolbar no-text-select">
-                                            <li class="toggle-smiley fa fa-smile-o" title="Insert a smiley"></li>
-                                            <li class="toggle-occupants"><a class="fa fa-user-times" title="Hide the list of occupants"></a></li>
-                                            <li class="toggle-clear"><a class="fa fa-times" title="Clear all messages"></a></li>
-                                        </ul>
-                                    </div>
-                                    <div class="form-group">
-                                        <textarea class="chat-textarea form-control" placeholder="Message"></textarea>
-                                    </div>
+                                    <ul class="chat-toolbar no-text-select">
+                                        <li class="toggle-smiley fa fa-smile-o" title="Insert a smiley"></li>
+                                        <li class="toggle-occupants"><a class="fa fa-user-times" title="Hide the list of occupants"></a></li>
+                                        <li class="toggle-clear"><a class="fa fa-times" title="Clear all messages"></a></li>
+                                    </ul>
+                                    <textarea class="chat-textarea form-control" placeholder="Message"></textarea>
                                 </form>
                             </div>