fixed the chat modal

public/css/style.less

@@ -141,15 +141,10 @@ footer.footer {
 }
 
 #chat-content {
-	width:95%;
 	height:200px;
 	resize:none;
 }
 
-#chat-message-input {
-	width:95%;
-}
-
 #content{
 	padding-bottom:20px;
 }

public/src/forum/accountedit.js

@@ -12,6 +12,7 @@ $(document).ready(function() {
 
 		$('#upload-progress-bar').css('width', '0%');
 		$('#upload-progress-box').show();
+		$('#upload-progress-box').removeClass('hide');
 
 		if(!$('#userPhotoInput').val()) {
 			error('select an image to upload!');
@@ -159,6 +160,7 @@ $(document).ready(function() {
 		updateImages();
 
 		$('#change-picture-modal').modal('show');
+		$('#change-picture-modal').removeClass('hide');
 
 		return false;
 	});
@@ -197,6 +199,7 @@ $(document).ready(function() {
 
 		$('#change-picture-modal').modal('hide');
 		$('#upload-picture-modal').modal('show');
+		$('#upload-picture-modal').removeClass('hide');
 
 		hideAlerts();
 

public/src/forum/topic.js

@@ -281,17 +281,16 @@
 	});
 
 	$('.topic-buttons').delegate('.chat', 'click', function(e) {
-		var username = $(this).parents('li').attr('data-username');
-		var touid = $(this).parents('li').attr('data-uid');
+		var username = $(this).parents('li.row').attr('data-username');
+		var touid = $(this).parents('li.row').attr('data-uid');
 
 		if(username === app.username || !app.username)
 			return;
 
-
 		require(['chat'], function(chat) {
 			var chatModal = chat.createModalIfDoesntExist(username, touid);
-			chatModal.show();
-			chat.bringModalToTop(chatModal);
+			chatModal.modal();
+			chat.bringModalToTop(chatModal); // I don't think this is necessary
 		});
 	});
 

public/templates/footer.tpl

@@ -14,17 +14,26 @@
 		</div>
 	</div>
 
-	<div id="chat-modal" class="modal hide" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
-		<div class="modal-header">
-			<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
-			<h3 id="myModalLabel">Chat with <span id="chat-with-name"></span></h3>
-		</div>
-		<div class="modal-body">
-			<textarea id="chat-content" cols="40" rows="10" readonly></textarea><br/>
-			<input id="chat-message-input" type="text" name="chat-message" placeholder="type chat message here press enter to send"/><br/>
-			<button type="button" id="chat-message-send-btn" href="#" class="btn btn-primary">Send</button>
-		</div>
-	</div>
+
+	<div id="chat-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+		<div class="modal-dialog">
+			<div class="modal-content">
+				<div class="modal-header">
+					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+					<h3 id="myModalLabel">Chat with <span id="chat-with-name"></span></h3>
+				</div>
+				<div class="modal-body">
+					<textarea class="form-control" id="chat-content" cols="40" rows="10" readonly></textarea><br/>
+					<input id="chat-message-input" type="text" class="form-control" name="chat-message" placeholder="type chat message, here press enter to send"/>
+				</div>
+				<div class="modal-footer">
+					<button type="button" id="chat-message-send-btn" href="#" class="btn btn-primary btn-lg btn-block
+					">Send</button>
+				</div>
+			</div><!-- /.modal-content -->
+		</div><!-- /.modal-dialog -->
+	</div><!-- /.modal -->
+
 
 	<div id="alert_window"></div>