@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro);

body{
	background: #eee !important;
	font-family: 'Source Sans Pro', Arial, Helvetica, sans-serif !important;
}

a{
	text-decoration: none;
}

.boardlist{
	box-sizing: border-box !important;
	position: fixed !important;
	z-index: 99999 !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	margin-top: 0 !important;
	padding: 1em !important;
	color: #222 !important;
	background: #fff !important;
	border: none !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

img.banner,
img.board_image{
	border: none !important;
}

.board_image,
.board_image + header{
	margin-top: 3.75em !important;
	margin-bottom: 1em !important;
	float: left !important;
}

.board_image + header{
	margin-left: 1em !important;
}

header,
header h1,
header .subtitle{
	text-align: left !important;
}

.board_image + header + .banner{
	width: 100% !important;
	float: left !important;
	margin-top: 0 !important;
	margin-left: 0 !important;
	padding: 0.5em 0 !important;
	background-color: #666 !important;
}

form[name=post]{
	box-sizing: border-box !important;
	position: fixed !important;
	bottom: 0 !important;
	right: 0 !important;
	background: #fff !important;
	margin-bottom: 0 !important;
	padding: 1em !important;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.3) !important;
}

form[name=post] input[type="text"],
form[name=post] textarea{
	width: 100% !important;
	padding: 0.5em !important;
	box-sizing: border-box !important;
}

form table tr th{
	color: #fff !important;
	background: #222 !important;
}

#expand-all-images,
#shrink-all-images,
#treeview{
	right: 1em !important;
	position: absolute !important;
}

#expand-all-images{
	margin-top: 4em !important;
}

#treeview{
	margin-top: 5em !important;
}

#shrink-all-images{
	margin-top: 6em !important;
}

#expand-all-images + hr,
#shrink-all-images + hr{
	opacity: 0 !important;
	margin: 0 !important;
}

#treeview + hr{
	opacity: 0 !important;
	clear: both !important;
}

#options_handler{
	margin-top: 3em !important;
}

[id^=thread]{
	background: #f8f8f8 !important;
	margin-bottom: 1em !important;
	padding: 1em 1em 0 1em !important;
	border: none !important;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2) !important;
}

[id^=thread] hr{
	display: none !important;
}

[id^=thread] div.post.reply {
	margin: 0.5em 1em !important;
	padding: 0.5em !important;
	color: #222 !important;
	background: #fff !important;
	border: none !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

[id^=thread] div.post.reply.highlighted {
	background: #fec !important;
}

p.intro.thread-hidden{
	padding-bottom: 1em !important;
}

#vechan-reply,
#update_thread{
	float: right;
	margin-right: 0.25em !important;
	cursor: pointer !important;
}

#update_thread{
	padding-left: 0 !important;
}

#update_secs{
	color: #900 !important;
}

.theme-catalog header{
	margin-top: 4em !important;
}

.theme-catalog div.threads{
	text-align: left !important;
}

#options_div,
.pages,
.theme-catalog div.thread{
	color: #222 !important;
	word-break: break-all !important;
	background: #fff !important;
	border: none !important;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

#options_tablist{
	border-right: 1px solid rgba(0, 0, 0, 0.1) !important;
}

.boardlist.bottom,
.sub[data-description='1'],
.sub[data-description='2'],
.sub[data-description='3'],
#quick-reply{
	display: none !important;
}

#favorite-star{
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) !important;
}

pre.prettyprint.prettyprinted{
	display: block !important;
	overflow-x: scroll !important;
}

a{
	transition: all 250ms ease;
}

textarea{
	max-width: none !important;
}

$(function () {
	// force all boards to have Yotsuba B as their theme
	// since v8ch's theme is based on it
	(function (theme) {
		var stylesheets = JSON.parse(localStorage.board_stylesheets);
		var keys = Object.keys(stylesheets);

		for (var i = 0; i < keys.length; i++) {
			stylesheets[keys[i]] = theme;
		};

		localStorage.board_stylesheets = JSON.stringify(stylesheets);

		if (!document.getElementById('stylesheet')) {
			var s = document.createElement('link');
			s.rel = 'stylesheet';
			s.type = 'text/css';
			s.id = 'stylesheet';
			var x = document.getElementsByTagName('head')[0];
			x.appendChild(s);
		}

		document.getElementById('stylesheet').href = styles[theme];

		$(window).trigger('stylesheet', theme);
	})('Yotsuba B');

	// // v8ch settings injection and functionality
	// (function() {
	// 	var tab = Options.add_tab('v8ch', 'cog', _('v8ch'));

	// 	var checkValue = function(option) {
	// 		if (localStorage.setItem('v8ch-' + option, $('input [name="' + option + '"]').find('input').is(':checked'))) {
	// 			return 'checked';
	// 		} else {
	// 			return '';
	// 		}
	// 	};

	// 	var options = {
	// 		// stickyHeader: $('<label><input type="checkbox" name="stickyHeader" ' + checkValue('stickyHeader') + '> Sticky Header</label><br>').appendTo(tab.content),
	// 		clickNoToReply: $('<label><input type="checkbox" name="clickNoToReply" ' + checkValue('clickNoToReply') + '> Click No.XXXX to reply</label>').appendTo(tab.content)
	// 	}
	// 	var keys = Object.keys(options);

	// 	var refreshSettings = function () {
	// 		for (var i = 0; i < keys.length; i++) {
	// 			localStorage.getItem('v8ch-' + keys[i]);
	// 		}
	// 	}

	// 	var submit = $("<input type='button' value='" + _("Update v8ch") + "'>")
	// 		.css({position: "absolute",height: 25,bottom: 5,width: "calc(100% - 10px)",left: 5,right: 5})
	// 		.click(function() {
	// 			refreshSettings();
	// 		})
	// 		.appendTo(tab.content);
	// })();

	if (active_page && (active_page !== 'catalog')) {
		// add a Reply button (which toggles the quick reply visibility) on the header
		(function () {
			var optionsAnchor = $('.boardlist a[title="Options"]');

			optionsAnchor.after('<a role="button" id="vechan-reply">[Reply]</a>&nbsp;');
		})();

		// Move the thread watcher on the header
		(function () {
			$("#update_thread").detach().appendTo(".boardlist");
		})();

		// quick reply functionality
		(function () {
			var postForm = $('form[name=post]');
			var reply = $('#vechan-reply');
			postForm.css('display', 'none');

			var replyState = false;

			var hideReply = function () {
					postForm.slideUp(300);
					reply.html('[Reply]');
					replyState = false;
			};

			var displayReply = function () {
					postForm.slideDown(300);
					reply.html('[Hide Reply]');
					replyState = true;
			};

			reply.on('click', function () {
				if (replyState) {
					hideReply();
				} else {
					displayReply();
				}
			});

			// if (localStorage.getItem('v8ch-clickNoToReply') === 'true') {
				var postNumberAchors = $('.intro a.post_no + a.post_no');

				postNumberAchors.on('click', function () {
					displayReply();
				});

				$('input[value="New Reply"]').on('click', function () {
						hideReply();
				});
			// }
		})();
	}

	if (active_page && active_page === 'index') {
		// Turn the current page's number on the pagination area a link
		(function () {
			$('.pages > a.selected').attr('href', location);
		})();
	}
});