Criando uma caixinha de chat

Estou criando aquelas caixinhas de diálogo.
Por enquanto tenho isso.
Depois melhoro.
Precisa de jquery e bootstrap.

<div id="chat">
    <div class="text-right">
        <i id="chat_diminuir" class="glyphicon glyphicon-minus cursor_pointer"></i>
        <i id="chat_aumentar" class="glyphicon glyphicon-plus cursor_pointer" style="display: none"></i>
    </div>
</div>
<style>
    #chat {
        position:fixed;
        right: 33px;
        bottom: 1px;
        width:300px;
        height:400px;
        border:1px solid #a6c4db;
        background:white;
        padding: 4px;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    }
</style>
<script language="JavaScript">
$(function(){
    $("#chat_diminuir").click(function(){
        $("#chat").css("width", "25px");
        $("#chat").css("height", "25px");
        $("#chat_diminuir").hide();
        $("#chat_aumentar").show();
    });
    $("#chat_aumentar").click(function(){
        $("#chat").css("width", "300px");
        $("#chat").css("height", "400px");
        $("#chat_diminuir").show();
        $("#chat_aumentar").hide();
    });
</script>