projects.mako.cc - scuttle/blob - scuttle.css

   1 /* BASE */
   2
   3 * {
   4   font-family: helvetica, arial, sans-serif;
   5 }
   6 a {
   7   color: #47A;
   8   text-decoration: none;
   9 }
  10 a:hover {
  11   color: #258;
  12   text-decoration: underline;
  13 }
  14 a img {
  15   border: 0;
  16 }
  17 body {
  18   background-color: #FFF;
  19   margin: 0;
  20   padding: 0;
  21 }
  22 input[type=submit] {
  23   background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFF), to(#DDD));
  24   border: 1px solid #CCC;
  25   border-radius: 5px;
  26   font-size: 13px;
  27   padding: 4px 12px;
  28   text-shadow: #FFF 1px 1px 0px;
  29   -moz-border-radius: 5px;
  30 }
  31 input[type=submit]:active {
  32   background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#DDD), to(#FFF));
  33 }
  34 input[type=submit]:hover {
  35   border-color: #666;
  36 }
  37 input[type=text],
  38 input[type=password],
  39 select,
  40 textarea {
  41   border: 1px solid #CCC;
  42   border-radius: 3px;
  43   font-size: 13px;
  44   padding: 4px 5px;
  45   -moz-border-radius: 3px;
  46 }
  47 p.error,
  48 p.success {
  49   border: 1px solid;
  50   font-size: small;
  51   margin: .5em;
  52   padding: .5em;
  53   width: 70%;
  54 }
  55 p.error {
  56   background: #FCC;
  57   border-color: #966;
  58   color: #633;
  59 }
  60 p.success {
  61   background: #CFC;
  62   border-color: #696;
  63   color: #363;
  64 }
  65 td#availability {
  66   color: #285;
  67   font-weight: bold;
  68 }
  69 td#availability.not-available {
  70   color: #F00;
  71 }
  72 textarea {
  73   font-size: small;
  74   padding: .2em;
  75 }
  76 th {
  77   padding-right: 1em;
  78   text-align: right;
  79 }
  80
  81 /* HEADER */
  82
  83 div#header {
  84   background: #FFF url('bg_header.png') bottom repeat-x;
  85   border-bottom: 3px solid #9CD;
  86   clear: both;
  87 }
  88 div#header:after {
  89   content: ".";
  90   display: block;
  91   height: 0;
  92   clear: both;
  93   visibility: hidden;
  94 }
  95 * html div#header {
  96   height: 1%;
  97 }
  98 h1 {
  99   float: left;
 100   font-size: x-large;
 101   font-weight: bold;
 102   margin: 0;
 103   padding: 1em;
 104   text-transform: lowercase;
 105 }
 106 html > body h1 {
 107   background: url('logo.png') no-repeat 10px;
 108   padding-left: 75px;
 109 }
 110 html > body div#header.popup h1 {
 111   background: url('logo_24.png') no-repeat 10px;
 112   padding: .5em .5em .5em 50px;
 113 }
 114 h1 a {
 115   color: #000;
 116   text-shadow: 2px 2px 2px #9CD;
 117 }
 118 h1 a:hover {
 119   color: #000;
 120 }
 121 h2 {
 122   background: #666 url('bg_bar.png') center center repeat-x;
 123   border-bottom: 3px solid #DDD;
 124   clear: both;
 125   color: #DDD;
 126   font-size: medium;
 127   letter-spacing: .1em;
 128   margin: 0 0 1em 0;
 129   padding: .5em 1em;
 130   text-shadow: 1px 1px 1px #333;
 131   text-transform: lowercase;
 132 }
 133
 134 /* NAVIGATION */
 135
 136 ul#navigation {
 137   list-style-type: none;
 138   margin: 0;
 139   padding: 1.9em 1em;
 140   text-transform: lowercase;
 141   width: auto;
 142 }
 143 ul#navigation a {
 144   font-size: medium;
 145   font-weight: bold;
 146   padding: .2em .5em;
 147 }
 148 ul#navigation a:hover {
 149   background: #7AD;
 150   color: #FFF;
 151 }
 152 ul#navigation li {
 153   float: left;
 154 }
 155 ul#navigation li.access {
 156   float: right;
 157 }
 158
 159 /* BOOKMARKS */
 160
 161 ol#bookmarks {
 162   list-style-type: none;
 163   margin: 0;
 164   padding: 0 1em;
 165   width: 70%;
 166 }
 167 html > body ol#bookmarks {
 168   margin: 0 1em;
 169   padding: 0;
 170 }
 171 div.link a {
 172   color: blue;
 173   font-size: medium;
 174 }
 175 div.link a:visited {
 176   color: purple;
 177 }
 178 div.meta {
 179   color: #285;
 180 }
 181 div.meta span {
 182   color: #F00;
 183 }
 184 li.xfolkentry {
 185   border-bottom: 1px solid #DDD;
 186   margin-bottom: 0;
 187   padding: 1em .5em;
 188 }
 189 html > body li.xfolkentry {
 190   border-bottom: 1px dotted #AAA;
 191 }
 192 li.xfolkentry div {
 193   padding: .1em;
 194 }
 195 li.xfolkentry.deleted {
 196   opacity: .5;
 197 }
 198 li.xfolkentry.private {
 199   border-left: 3px solid #F00;
 200 }
 201 li.xfolkentry.shared {
 202   border-left: 3px solid #FA0;
 203 }
 204
 205 /* SIDEBAR */
 206
 207 div#sidebar {
 208   font-size: small;
 209   position: absolute;
 210   right: 1em;
 211   top: 10em;
 212   width: 25%;
 213 }
 214 div#sidebar a {
 215   color: #995;
 216 }
 217 div#sidebar a:hover {
 218   color: #773;
 219 }
 220 div#sidebar div {
 221   background: #FFF url('bg_sidebar.png') bottom repeat-x;
 222   border: 1px solid #CC8;
 223   color: #555;
 224   margin-bottom: 1em;
 225 }
 226 div#sidebar h2 {
 227   background: transparent;
 228   border: 0;
 229   color: #995;
 230   letter-spacing: 0;
 231   margin: 0;
 232   padding: .5em 0;
 233   text-shadow: none;
 234 }
 235 div#sidebar hr {
 236   display: none;
 237 }
 238 div#sidebar p {
 239   margin: 1em;
 240 }
 241 div#sidebar p.tags a {
 242   margin: 0;
 243 }
 244 div#sidebar table {
 245   margin: .5em .5em 0 .5em;
 246 }
 247 div#sidebar table td {
 248   padding-bottom: .25em;
 249   padding-right: .5em;
 250 }
 251 div#sidebar ul {
 252   list-style-type: none;
 253   margin: 0;
 254   padding: .5em;
 255 }
 256 div#sidebar ul li {
 257   margin: .5em 0;
 258 }
 259
 260 /* TAGS */
 261
 262 p.tags {
 263   line-height: 2.25em;
 264   margin: 2em 10%;
 265   text-align: justify;
 266   vertical-align: middle;
 267 }
 268 p.tags a,
 269 p.tags span {
 270   color: #47A;
 271   margin-right: .5em;
 272 }
 273 p.tags span:hover {
 274   cursor: pointer;
 275   text-decoration: underline;
 276 }
 277 p.tags span.selected {
 278   background: #CEC;
 279 }
 280
 281 /* PROFILE */
 282
 283 table.profile th {
 284   width: 10em;
 285 }
 286
 287 /* OTHER GUFF */
 288
 289 dd {
 290   background: #CEC;
 291   border-right: 4px solid #ACA;
 292   color: #464;
 293   padding: 6px;
 294 }
 295 dd a {
 296   color: #464;
 297 }
 298 dd a:hover {
 299   color: #000 !important;
 300   text-decoration: underline !important;
 301 }
 302
 303 dl {
 304   font-size: small;
 305   margin: 1em;
 306   width: 70%;
 307 }
 308 dl#profile dd {
 309   background: #CDE;
 310   border-color: #ABC;
 311   color: #247;
 312 }
 313 dl#profile dt {
 314   background: #BCE;
 315   border-color: #9AC;
 316   color: #245;
 317   display: block;
 318   font-weight: bold;
 319   padding: 6px;
 320 }
 321 dl#profile a {
 322   color: #446;
 323 }
 324 dl#profile a:hover {
 325   color: #000 !important;
 326   text-decoration: underline !important;
 327 }
 328 dl#meta dd {
 329   line-height: 1.5em;
 330 }
 331 dl#meta dt {
 332   background: #BDB;
 333   color: #353;
 334   display: block;
 335   font-weight: bold;
 336   padding: 6px;
 337 }
 338 dt {
 339   border-right: 4px solid #9B9;
 340 }
 341 dt a {
 342   background: #BDB;
 343   color: #353;
 344   display: block;
 345   font-weight: bold;
 346   padding: 6px;
 347 }
 348 dt a:hover {
 349   background: #ACA;
 350   border: 0;
 351 }
 352 form {
 353   margin: 0;
 354 }
 355 form#search {
 356   background: #FFF;
 357   color: #555;
 358   font-size: small;
 359   margin-bottom: 1em;
 360 }
 361 form label,
 362 form td,
 363 form th {
 364   font-size: small;
 365 }
 366 form table {
 367   margin: 0 1em;
 368 }
 369 h3 {
 370   background: #DDD;
 371   color: #555;
 372   font-size: small;
 373   letter-spacing: .2em;
 374   margin: 2em 1em 1em 1em;
 375   padding: .5em .75em;
 376   text-shadow: 1px 1px 1px #FFF;
 377 }
 378 li {
 379   font-size: small;
 380   margin-bottom: .5em;
 381 }
 382 p {
 383   font-size: small;
 384   margin: 1em;
 385 }
 386 p#sort {
 387   color: #CCC;
 388   font-size: small;
 389   float: right;
 390   margin: 0;
 391   position: absolute;
 392   right: 0;
 393   top: 6.9em;
 394 }
 395 html > body p#sort {
 396   margin-right: .75em;
 397 }
 398 p#sort a {
 399   background: #AAA;
 400   color: #555;
 401   font-weight: normal;
 402   margin-right: .5em;
 403   padding: 0 1em;
 404   border-radius: .25em;.
 405 }
 406 html > body p#sort a {
 407   margin-right: 0;
 408 }
 409 p#sort a:hover {
 410   background: #CCC;
 411   text-decoration: none !important;
 412 }
 413 p#sort span {
 414   display: none;
 415 }
 416 p.paging {
 417   font-size: small;
 418   margin-left: 1em;
 419 }
 420 p.paging a,
 421 p.paging span.disable {
 422   background: #888;
 423   color: #FFF;
 424   display: inline;
 425   margin-right: .5em;
 426   padding: .25em 1em;
 427 }
 428 p.paging a:hover {
 429   background: #666;
 430 }
 431 p.paging span {
 432   display: none;
 433 }
 434 p.paging span.disable {
 435   background: #DDD;
 436   color: #AAA;
 437 }
 438 div.collapsible p.tags {
 439   line-height: 2.25em;
 440   margin: 1em 2em;
 441 }
 442 th label {
 443   padding-right: 1em;
 444 }
 445 ul {
 446   margin-right: 1em;
 447   width: 75%;
 448 }