Aug
25
2015

Unity Answers Custom CSS Style

An article by mgear

Custom CSS style for new Unity Answers website (using Stylish plugin)

Features:
– General cleaning up of clutter
– Add all line numbers to code
– More towards stackoverflow style & fonts
– …

Before

After (using custom style)

Custom.css: *still work in progress..

	@namespace url(http://www.w3.org/1999/xhtml);
	@-moz-document domain("answers.unity3d.com")
	{
	/* http://unitycoder.com/blog/2015/08/25/unity-answers-custom-css-style/ */

	/* ————— page ————— */

	/* page padding */
	.main{
	padding: 0px !important;
	}

	/* compact topnavs */

	.header-wrapper {
	display: none !important;
	}

	#section-header {
	display: none !important;
	}


	/* cleanup sidebar */
	.sidebarTwo{
	width: 330px; /optional /
	font-size-adjust: 0.45 !important;
	}

	.widget .widget-content {
	padding: 0px !important;
	}

	.sidebarTwo>div:first-child {
	display: none !important;
	}

	/* related questions */
	div.span4.sidebarTwo div div.widget div.widget-content p a
	{
	float:right !important;
	}

	/* TODO: number of answers at front, without "answer" */
	/*
	div.span4.sidebarTwo div div.widget div.widget-content p:not(a)
	{
	color:red !important;
	}*/


	/* ————— original post ————— */

	/* post fonts */
	.question-body{
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
	font-size: 15px;
	line-height: 1.3;
	}


	/* topic title */
	.question h1 {
	font-size: 20px !important;
	padding-bottom: 5px;
	}

	/* clean up poster info */
	.post-gravatar.question-gravatar{
	display: none !important;
	}

	/* more space for post */
	.post {
	padding-right: 0px !important;
	/* TODO: move reply users faces to right, so can set all padding to 0px */
	}


	/* display all line numbers */
	li.L0, li.L1, li.L2, li.L3, li.L5, li.L6, li.L7, li.L8 {
	list-style-type:inherit;
	}

	/* smaller linenums, adjust color */
	.linenums{
	font-size: 10px !important;
	color: #aaa;
	}

	/* code font, border off, rounding off */
	code, pre {
	font-family: Consolas,Menlo,Monaco,Lucida Console,Liberation Mono,DejaVu Sans Mono,Bitstream Vera Sans Mono,Courier New,monospace,sans-serif;
	border-radius: 0px;
	border: none !important;
	}

	/* no alternate line colors */
	li.L0, li.L2, li.L4, li.L6, li.L8 {
	background-color: #eeeeee;
	}

	/* report button – TODO */
	/*.icon-cog{
	background-image: url("https://www.assetstore.unity3d.com/images/sprites.png");
	background-position: -102px 0px;
	opacity: 0.7;
	}*/

	/* post answer button to right */
	.form-actions{
	float:right !important;
	}

	/* smaller hints */
	.help-inline{
	font-size: 10px;
	color:#888 !important;
	font-style: italic;
	}

	}