UserScript for Chat Stack Exchange, that adds dark theme and sidebar-hiding

SaltySailorChat.user.js

// ==UserScript==
// @name         Salty Sailor Chat
// @version      0.1
// @description  chat goodness, e.g. sidebar hiding, dark theme
// @author       Jarrod Dixon
// @include      /https?://chat\..*stackexchange.com/rooms/\d+/.*/
// ==/UserScript==

(function() {
    'use strict';

    toggleableSidebar();
	darkTheme();
        
    function toggleableSidebar() {
		var $con = $('#container'),
			$side = $('#sidebar');
		
		$con.addClass('sidebar-hidden');
		$side.click(function(e) {
			var $clicked = $(e.target);
			if ($clicked.is('a, input') || $clicked.closest('form').length) {
				return;
			}
			$con.toggleClass('peek'); 
		});
		
		$('head').append(`
<style>
#container.sidebar-hidden #sidebar  { width: 20px; background-color: #333; border-left: 1px solid #555; cursor: pointer; }
#container.sidebar-hidden #sidebar-content { display:none; }
#container.sidebar-hidden #main { width: 93%; }

#container.sidebar-hidden.peek #sidebar { display: fixed; width: 50%; }
#container.sidebar-hidden.peek #sidebar-content { display: block; }
</style>
`);	
    }
    
    
    
    function darkTheme() {
		var styles = `
<style>

#input-area {
    background: #252525 !important;
}

#input {
    color: #aaa !important;
    background-color: #252525 !important;
}

#sidebar {
    color: #aaa !important;
}

#starred-posts li {
    border-bottom: 1px solid #555 !important;
    margin: 5px 0 !important;
    margin-bottom: 0px !important;
}

#widgets > .sidebar-widget:nth-child(2), #room-files {
    display: none !important;
}

.catchup-marker {
    border-top-style: none !important;
}

.chat-input textarea {
    background-color: #333 !important;
    color: #bbb !important;
}

.flair, .username {
    color: #999 !important;
}

.mention {
    color: #222 !important;
}

.messages, .timestamp {
    background-color: #222 !important;
    border-color: transparent !important;
}

#container, .messages, .timestamp {
    color: #bbb !important;
}

.neworedit {
    background-color: #444  !important;
    color: #bbb !important;
}

.ob-exception-detail {
    background-color: #444 !important;
    color: #ccc !important;
}

.ob-status-text, .ob-blog-meta, .ob-blog-text, .ob-message, .ob-post-body, .ob-exception-info, .ob-exception-type, .ob-exception-time, .ob-exception-server, .ob-exception-url {
    color: #bbb !important;
}

.sidebar-widget * {
    color: #888 !important;
}

.onebox {
    background-color: #444 !important;
    color: #bbb !important;
}

.profiler-results, #debug-message-container, #footer-logo {
    display: none !important;
}

.reply-parent, .reply-child {
    background-color: #666 !important;
    color: #fff !important;
}

.system-message-container .system-message {
    color: #777 !important;
    font-weight: normal !important;
}

.user-3 .messages {
    background-color: #31516B !important;
}

a, .username {
    color: #72B1FF !important;
}

body, .odd td {
    background: none !important;
    background-color: #111 !important;
}

body, textarea {
    font-family: arial !important;
}

</style>
`;
		$('head').append(styles);
	}
    
})();