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

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