doc/css/style.css
changeset 72 e7b44716a564
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/doc/css/style.css	Tue Dec 06 19:46:00 2011 +0100
@@ -0,0 +1,975 @@
+
+body {
+	
+	background-color: #eee;
+	color: #111;
+	margin: 0px;
+	padding: 0px;
+	font-family: "DroidSans", "Trebuchet MS", sans-serif;
+	line-height: 1.6em;
+	font-size: 1.3em;
+	
+}
+
+	#head-container {
+		
+		display: block;
+		position: relative;
+		width: 100%;
+		height: 90px;
+		
+		background: #111 url(../images/head.png) top left repeat-x;
+		
+	}
+	
+		#head {
+			
+			display: block;
+			position: relative;
+			width: 960px;
+			height: 90px;
+			margin: 0px auto;			
+			
+		}
+			
+			#head #logo {
+			
+				display: block;
+				position: absolute;
+				left: 0px;
+				bottom: 10px;
+				width: 200px;
+				height: 70px;
+			
+			}
+
+				#head #logo a {
+					
+					display: block;
+					position: relative;
+					width: 200px;
+					padding-left: 70px;
+					height: 70px;
+					background: url(../images/netzguerilla-3.png) 0px 0px no-repeat;
+					text-decoration: none;
+					
+				}
+
+				#head #logo a span {
+			
+					display: none;
+			
+				}
+				
+			#head #menu {
+				
+				display: block;
+				position: absolute;
+				right: 0px;
+				bottom: 0px;
+				margin: 0px;
+				padding: 0px;
+				
+			}
+
+				#head #menu li {
+					
+					display: inline-block;
+					position: relative;
+					margin: 0px;
+					padding: 0px;
+					
+				}
+				
+					#head #menu li a {
+					
+						display: block;
+						position: relative;
+						
+						color: #c03;
+						text-decoration: none;
+						text-transform: uppercase;
+						padding: 0px 7px;
+						background: #333 url(../images/fade-top.png) bottom left repeat-x;
+						margin-left: 5px;
+						font-size: .8em;
+						font-weight: bold;
+						
+						-webkit-border-top-left-radius: 4px;
+						-webkit-border-top-right-radius: 4px;
+						-moz-border-radius-topleft: 4px;
+						-moz-border-radius-topright: 4px;
+						border-top-left-radius: 4px;
+						border-top-right-radius: 4px;
+						
+					}
+					
+						#head #menu li a:hover {
+						
+							background: #c03 url(../images/fade-top.png) bottom left repeat-x;
+							color: #fff;
+							
+						}
+
+						#head #menu li a.active {
+							
+							background-color: #eee;
+							background-image: none;
+							color: #000;
+							
+						}
+					
+	#content-container {
+		
+		display: block;
+		position: relative;
+		
+	}
+		#content { 
+		
+			padding: 20px 0px;		
+			
+		}
+	
+		#main {}
+		
+			#main h2 {
+				
+				display: block;
+				position: relative;
+				color: #a01;
+				font-size: 1.8em;
+				line-height: 1.4em;
+				margin-bottom: 15px;
+				text-shadow: 0px 0px 5px #fff;
+				
+			}
+			
+			#main h3 {
+			
+				display: block;
+				position: relative;
+				color: #b02;
+				font-size: 1.4em;
+				line-height: 1.4em;
+				margin: 10px 0px;
+			
+			}
+			
+			#main h4 {
+			
+				display: block;
+				position: relative;
+				color: #a01;
+				font-size: 1.3em;
+				line-height: 1.4em;
+				margin: 10px 0px;
+			
+			}
+			
+			#main h5 {
+			
+				display: block;
+				position: relative;
+				color: #900;
+				font-size: 1.2em;
+				line-height: 1.4em;
+				margin: 10px 0px;
+			
+			}
+			
+			#main .item {
+				
+				display: block;
+				position: relative;
+				
+				padding: 30px 40px;
+				
+				border-radius: 15px;
+				-o-border-radius: 15px;
+				-moz-border-radius: 15px;
+				-webkit-border-radius: 15px;
+
+				-moz-box-shadow: 0px 0px 20px #eee;
+				-o-box-shadow: 0px 0px 20px #eee;
+				-webkit-box-shadow: 0px 0px 20px #eee;
+				box-shadow: 0px 0px 20px #eee;
+				
+				background-color: #fff;
+				margin-bottom: 20px;
+				font-size: .9em;
+				
+			}
+			
+				#main .item p {
+					
+					margin: 5px 0px;
+					
+				}
+						
+				#main .item a {
+					
+					text-decoration: none;
+					color: #b02;
+					
+				}
+				
+				#main .item ol {
+					
+					list-style-type: none;
+					list-style-position: inside;
+					
+				}
+				
+					#main .item ol li {
+						
+						margin-left: 2em;
+						
+					}
+																			
+				#main .item table {
+
+					width: 100%;
+					margin: 0px;
+
+					-webkit-border-radius: 5px;
+					-moz-border-radius: 5px;
+					border-radius: 5px;
+
+					-moz-box-shadow: 0px 0px 15px #ccc;
+					-o-box-shadow: 0px 0px 15px #ccc;
+					-webkit-box-shadow: 0px 0px 15px #ccc;
+					box-shadow: 0px 0px 15px #ccc;
+
+
+				}
+				
+					#main .item table.docs {
+				
+						font-size: .8em;
+
+					}
+
+					#main .item table.docs td {
+				
+						font-weight: bold;
+						padding-right: 0.2em;
+						min-width: 120px;
+
+					}
+
+					#main .item table.docs td+td {
+				
+						font-weight: normal;
+						padding-right: 0.2em;
+						min-width: 80px;
+
+					}
+
+					#main .item table.docs td+td+td {
+					
+						font-weight: normal;
+						padding-right: 0em;
+						white-space: normal;
+
+					}
+
+					#main .item table td {
+
+						background-color: #eee;
+						line-height: 1.7em;
+
+					}
+
+					#main .item table thead tr td {
+
+						background-color: #c03;
+						color: #fff;
+						font-size: .8em;
+						padding: 5px;
+
+					}
+
+					#main .item table tbody tr td {
+
+						color: #222;
+						vertical-align: top;
+
+					}
+
+					#main .item table tbody tr td.content {
+
+						padding: 10px;
+						font-size: .8em;
+						
+					}
+
+					#main .item table tbody tr td.content strong.title {
+
+						display: inline-block;
+						position: relative;
+						max-width: 140px;
+						overflow: hidden;
+						
+					}
+
+					#main .item table tbody tr td.content span.meta {
+
+						display: block;
+						position: relative;
+						max-width: 140px;
+						overflow: hidden;
+						line-height: 1.4em;
+						font-size: .8em;
+						
+					}
+
+					#main .item table tbody tr td.content span.hate {
+
+						display: block;
+						position: relative;
+						line-height: 1.4em;
+						border: 1px solid #ccc;
+						padding: 10px;
+						text-align: justify;
+						
+					}
+					#main .item table tbody tr:nth-child(odd) td {
+
+						background-color: #f9f9f9;
+
+					}
+
+					#main .item table tbody tr:nth-child(even) td {
+
+						background-color: #f6f6f6;
+
+					}
+
+					#main .item table tr td:first-child {
+
+						padding-left: 5px;
+
+					}
+
+					#main .item table tr td:last-child {
+
+						padding-right: 5px;
+
+					}
+
+					#main .item table tr td.controls {
+
+						width: 80px;
+						text-align: right;
+
+					}
+
+					#main .item table tr td.controls a {
+
+						display: inline-block;
+						width: 20px;
+						height: 20px;
+						overflow: hidden;
+						text-indent: 30px;
+						background-color: #eee;
+
+						-moz-box-shadow: 0px 0px 5px #ccc;
+						-o-box-shadow: 0px 0px 5px #ccc;
+						-webkit-box-shadow: 0px 0px 5px #ccc;
+						box-shadow: 0px 0px 5px #ccc;
+
+						-webkit-border-radius: 3px;
+						-moz-border-radius: 3px;
+						border-radius: 3px;
+
+						vertical-align: bottom;
+						margin: 0px 0px 4px 2px;
+
+						background-image: url(../images/icons/bug.png);
+						background-position: center center;
+						background-repeat: no-repeat;
+
+					}	
+
+						#main .item table tr td.controls a:hover {
+
+							background-color: #c03;
+
+						}
+
+						#main .item table tr td.controls a.edit {
+
+							background-image: url(../images/icons/pencil.png);		
+
+						}
+
+						#main .item table tr td.controls a.delete {
+
+							background-image: url(../images/icons/bin.png);		
+
+						}
+
+						#main .item table tr td.controls a.details {
+
+							background-image: url(../images/icons/zoom.png);		
+
+						}
+
+						#main .item table tr td.controls a.accept {
+
+							background-image: url(../images/icons/accept.png);		
+
+						}
+
+					/* round corners */
+
+					#main .item table thead tr:first-child td:first-child {
+
+						-webkit-border-top-left-radius: 5px;
+						-moz-border-radius-topleft: 5px;
+						border-top-left-radius: 5px;								
+
+					}
+
+					#main .item table thead tr:first-child td:last-child {
+
+						-webkit-border-top-right-radius: 5px;
+						-moz-border-radius-topright: 5px;
+						border-top-right-radius: 5px;								
+
+					}
+
+					#main .item table tbody tr:last-child td:first-child {
+
+						-webkit-border-bottom-left-radius: 5px;
+						-moz-border-radius-bottomleft: 5px;
+						border-bottom-left-radius: 5px;								
+
+					}
+
+					#main .item table tbody tr:last-child td:last-child {
+
+						-webkit-border-bottom-right-radius: 5px;
+						-moz-border-radius-bottomright: 5px;
+						border-bottom-right-radius: 5px;								
+
+					}
+					
+					#main .item code.copyme {
+						
+						display: block;
+						margin: 0px 0px 10px;
+						padding: 10px;
+						line-height: 1em;
+						border: 1px solid #ccc;
+						background-color: #eee;
+						
+					}
+					
+				/* main view */
+				
+				#main .hate-pagination {
+					
+					display: block;
+					position: relative;
+					line-height: 1.2em;
+					padding: 10px 0px;
+					
+				}
+
+					#main .hate-pagination-back {
+					
+						display: block;
+						position: relative;
+						width: 300px;
+						text-align: left;
+						float: left;
+					
+					}
+
+					#main .hate-pagination-forward {
+					
+						display: block;
+						position: relative;
+						width: 300px;
+						text-align: right;
+						float: right;
+					
+					}
+
+				#main .ad-item {
+
+					display: block;
+					position: relative;
+					border-bottom: 1px solid #ccc;
+					line-height: 1.2em;
+					padding: 20px 0px;
+					text-align: center;
+
+				}
+
+				#main .hate-item {
+					
+					display: block;
+					position: relative;
+					border-bottom: 1px solid #ccc;
+					line-height: 1.2em;
+					padding: 10px 0px;
+					
+				}
+				
+					#main .hate-item .hate-item-icon {
+				
+						display: block;
+						position: relative;
+						width: 48px;
+						padding: 5px 0px 5px 10px;
+						float: left;
+				
+					}
+
+					#main .hate-item .hate-item-main {
+					
+						display: block;
+						position: relative;
+						width: 550px;
+						float: right;
+					
+					}
+				
+					#main .hate-item .hate-item-author {
+					
+						display: block;
+						position: relative;
+						font-size: .8em;
+						font-weight: bold;
+						color: #222;
+					
+					}
+
+						#main .hate-item .hate-item-author a {
+						
+							color: #222;
+							
+						}
+				
+					#main .hate-item .hate-item-content {
+					
+						display: block;
+						position: relative;
+						font-size: .8em;
+						font-weight: normal;
+						color: #444;
+					
+					}
+				
+					#main .hate-item .hate-item-meta {
+					
+						display: block;
+						position: relative;
+						font-size: .6em;
+						color: #666;
+					
+					}
+				
+					#main .hate-item .hate-item-meta a {
+
+						color: #666;
+
+					}
+					
+					#main .hate-item .hate-item-meta a.facepalm {
+
+						display: inline-block;
+						padding-left: 20px;
+						line-height: 16px;
+						background: url(../images/icons/facepalm.png) top left no-repeat;
+
+					}
+					
+					#main .hate-item:hover .hate-item-meta a.facepalm {
+
+						background: url(../images/icons/facepalm-hl.png) top left no-repeat;
+						
+					}
+
+					#main .hate-item .hate-item-meta span.godwin {
+
+						display: inline-block;
+						padding-left: 20px;
+						line-height: 16px;
+						background: url(../images/icons/godwinbonus.png) top left no-repeat;
+
+					}					
+					
+				#main .hate-item:hover {
+					
+					background-color: #fce;
+					
+				}
+					
+					#main .hate-item:hover a {
+					
+						color: #c03;
+					
+					}
+					
+				#main .hate-detail {
+
+					display: block;
+					position: relative;
+					border-bottom: 1px solid #ccc;
+					line-height: 1.2em;
+					padding: 10px 0px;
+
+				}
+
+					#main .hate-detail .hate-item-icon {
+
+						display: block;
+						position: relative;
+						width: 48px;
+						padding: 5px 0px;
+						float: left;
+
+					}
+
+					#main .hate-detail .hate-item-main {
+
+						display: block;
+						position: relative;
+
+					}
+
+					#main .hate-detail .hate-item-author {
+
+						display: block;
+						position: relative;
+						font-size: 1.2em;
+						line-height: 50px;
+						font-weight: bold;
+						color: #222;
+						width: 560px;
+						float: right;
+
+					}
+
+					#main .hate-detail .hate-item-content {
+
+						display: block;
+						position: relative;
+						font-size: 1.2em;
+						line-height: 1.4em;
+						font-weight: normal;
+						color: #444;
+						padding: 10px 0px;
+
+					}
+
+					#main .hate-detail .hate-item-meta {
+
+						display: block;
+						position: relative;
+						font-size: .8em;
+						color: #666;
+
+					}
+
+					#main .hate-detail .hate-item-meta a {
+
+						color: #666;
+
+					}
+
+						#main .hate-detail .hate-item-meta a.facepalm {
+
+							display: inline-block;
+							padding-left: 20px;
+							line-height: 16px;
+							background: url(../images/icons/facepalm.png) top left no-repeat;
+
+						}
+					
+						#main .hate-detail:hover .hate-item-meta a.facepalm {
+
+							background: url(../images/icons/facepalm-hl.png) top left no-repeat;
+						
+						}
+						
+						#main .hate-detail .hate-item-meta span.godwin {
+
+							display: inline-block;
+							padding-left: 20px;
+							line-height: 16px;
+							background: url(../images/icons/godwinbonus.png) top left no-repeat;
+
+						}					
+						
+
+				/* special stuff */
+				
+				#main span.redacted {
+					
+					display: inline-block;
+					background-color: #333;
+					color: #c03;
+					line-height: 1.1em;
+					padding: 0px 5px;
+					
+				}
+				
+				#main code.apikey {
+					
+					font-size: 1.1em; 
+					background-color: #a01; 
+					color: #fff; 
+					display: inline-block; 
+					padding: 0px 5px;
+					
+				}
+				
+				#main a.bookmarklet {
+					
+					font-size: 1.4em; 
+					background-color: #ccc; 
+					color: #666; 
+					border: 1px solid #666;
+					display: inline-block; 
+					padding: 5px 10px;					
+					
+					-webkit-border-radius: 10px;
+					-moz-border-radius: 10px;
+					border-radius: 10px;
+					
+				}
+				
+			#main form input[type=text],
+			#main form input[type=password] {
+
+				display: block;
+				position: relative;
+				border: 1px solid #999;
+				font-size: .9em;
+				padding: 3px;
+
+				border-radius: 5px;
+				-o-border-radius: 5px;
+				-moz-border-radius: 5px;
+				-webkit-border-radius: 5px;
+
+			}
+
+			#main form input[type=submit] {
+
+				display: block;
+				position: relative;
+				border: 1px solid #ccc;
+				color: #111;
+				font-size: .9em;
+				padding: 2px;
+
+				border-radius: 5px;
+				-o-border-radius: 5px;
+				-moz-border-radius: 5px;
+				-webkit-border-radius: 5px;
+
+
+			}
+
+			#main form span.input {
+
+				display: inline-block;
+				position: relative;
+				border: 1px solid #999;
+				font-size: .9em;
+				padding: 0px 2px;
+				background-color: #fff;
+				border-radius: 5px;
+				-o-border-radius: 5px;
+				-moz-border-radius: 5px;
+				-webkit-border-radius: 5px;
+
+
+			}
+
+				#main form span.input input[type=text] {
+
+					display: inline-block;
+					position: relative;
+					border-width: 0px;
+					font-size: 1em;
+					padding: 0px;
+					background-color: #fff;
+
+				}
+
+				#main form span.input input[type=text].right {
+
+					text-align: right;
+
+				}
+
+				#main form span.input input.size-2 {
+
+					width: 1.5em !important;
+
+				}
+
+				#main form span.input input.size-4 {
+
+					width: 2.5em !important;
+
+				}
+
+			#main form label {
+
+				display: block;
+				position: relative;
+				font-size: .75em;
+				color: #666;
+
+			}
+
+			#main form textarea {
+
+				display: block;
+				position: relative;
+				border: 1px solid #999;
+				font-size: .9em;
+				font-family: sans-serif;
+				padding: 3px;
+
+				border-radius: 5px;
+				-o-border-radius: 5px;
+				-moz-border-radius: 5px;
+				-webkit-border-radius: 5px;
+
+			}
+
+
+			#main form fieldset {
+
+				border: 1px solid #ccc;
+				padding: 5px;
+				margin: 5px 0px;
+
+			}
+
+				#main form fieldset legend {
+
+					font-size: .75em;
+					color: #666;
+
+				}
+				
+		#sidebar {}
+		
+			#sidebar h3 {
+				
+				display: block;
+				position: relative;
+				color: #fff;
+				font-size: 1.2em;
+				line-height: 1.4em;
+				margin: 5px 0px;
+				
+			}
+
+			#sidebar .item {
+				
+				display: block;
+				position: relative;
+				
+				padding: 0px 10px;
+				
+				border-radius: 10px;
+				-o-border-radius: 10px;
+				-moz-border-radius: 10px;
+				-webkit-border-radius: 10px;
+
+				-moz-box-shadow: 0px 0px 20px #eee;
+				-o-box-shadow: 0px 0px 20px #eee;
+				-webkit-box-shadow: 0px 0px 20px #eee;
+				box-shadow: 0px 0px 20px #eee;
+				
+				background-color: #333;
+				margin-bottom: 20px;
+				font-size: .8em;			
+				
+			}
+			
+				#sidebar .center {
+				
+					text-align: center;
+				
+				}
+			
+				#sidebar .counter-item .content {
+					
+					font-size: 3em;
+					color: #c03;
+					font-weight: bold;
+					line-height: 1em;
+					padding-bottom: 5px;
+					text-align: center;
+					
+				}
+				
+				#sidebar .submenu-item {
+					
+					background-color: #ddd;
+					
+				}
+
+					#sidebar .submenu-item ul {}
+
+						#sidebar .submenu-item ul li {}
+
+							#sidebar .submenu-item ul li+li {
+								
+								border-top: 1px dotted #999;
+								
+							}
+
+							#sidebar .submenu-item ul a {
+								
+								color: #c03;
+								text-decoration: none;
+								text-transform: uppercase;
+								
+							}
+							
+								#sidebar .submenu-item ul a:hover {
+									
+									color: #a01;
+									
+								}
+
+	#foot-container {
+		
+		display: block;
+		position: relative;
+		background: #222;
+		color: #ddd;
+		
+	}
+	
+		#foot {
+			
+			display: block;
+			position: relative;
+			width: 960px;
+			margin: 0px auto;
+			padding: 20px;
+			font-size: .8em;
+			
+		}
+		
+			#foot a {
+				
+				text-decoration: none;
+				color: #c03;
+				
+			}
+