orioltf
8/22/2013 - 2:01 PM

#CSS #WebEnhnacer: Change Github appearance to better use big screens (while still working on smaller ones). Add theese CSS changes to Styli

#CSS #WebEnhnacer: Change Github appearance to better use big screens (while still working on smaller ones). Add theese CSS changes to Stylish Chrome/Firefox extensions or similar ones. The filename shows where should be applied.

help.github.com.css
content_copyfile_download
body #content-wrapper .site {
  width: auto;
  max-width: 100em;
}
github.com.css
content_copyfile_download
.container {
  width: auto;
	max-width: 100em;
}

/* Block formating context */
.repository-with-sidebar .repository-content, 
.repository-with-sidebar.with-full-navigation .repository-content, 
.discussion-timeline, 
body.page-profile .profilecols .last,
.repo-settings-content {
	width: auto;
	float: none;
	overflow: hidden;
}
/* Block formating context */

.repository-with-sidebar .repository-content,
.discussion-timeline {
	padding-right: 20px;
}
body.page-profile .profilecols .last,
.repo-settings-content {
	padding-left: 20px;
}

.news {width: 80%;}
.dashboard-sidebar {width: 19%;}

.discussion-timeline-cols .main {width: 60%;}
.discussion-timeline-cols .sidebar {width: 40%;}
.discussion-timeline-cols .sidebar .color-label-list > li {float: left; width: 50%;}

.discussion-sidebar {
	margin-top: 20px;
	width: 20%;
}

.bootcamp ul li {
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
	width: 24%;
	margin-right: 1%;
}

@media all and (min-width: 90em) {
	.repolist > li {
		width: 46%;
		float: left;
		-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
		-moz-box-sizing: border-box;    /* Firefox, other Gecko */
		box-sizing: border-box;         /* Opera/IE 8+ */
		margin: 0 2% 20px;
		overflow: hidden;
	}
    .repolist > li:nth-child(16) {
		clear: left;
	}
	.repolist > li:nth-child(16),
	.repolist > li:nth-child(17),
	.repolist > li:nth-child(18) {
		margin-top: 2em;
	}
	.repolist > li.simple {
		width: 29%;	
	}
	.repolist > li.simple .repo-stats {
		margin-top: 1.8em;
	}
  .repolist .description {
		max-height: 1.4em;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
}

@media all and (min-width: 90em) {
	.news .alert {
		width: 46%;
		float: left;
		-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
		-moz-box-sizing: border-box;    /* Firefox, other Gecko */
		box-sizing: border-box;         /* Opera/IE 8+ */
		margin-left: 2%;
		margin-right: 2%;
		overflow: hidden;
		min-height: 2em;
	}
}