diff -r 0f3063b5e96b -r e7b44716a564 doc/css/style.css --- /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; + + } +