github.com/insionng/yougam@v0.0.0-20170714101924-2bc18d833463/public/root/css/uniform.css (about) 1 /* 2 3 Uniform Theme: Uniform Default 4 Version: 1.6 5 By: Josh Pyles 6 License: MIT License 7 --- 8 For use with the Uniform plugin: 9 http://pixelmatrixdesign.com/uniform/ 10 --- 11 Generated by Uniform Theme Generator: 12 http://pixelmatrixdesign.com/uniform/themer.html 13 14 */ 15 16 /* Global Declaration */ 17 18 div.selector, 19 div.selector span, 20 div.checker span, 21 div.radio span, 22 div.uploader, 23 div.uploader span.action, 24 div.button, 25 div.button span { 26 background-image: url(../img/sprite.png); 27 background-repeat: no-repeat; 28 -webkit-font-smoothing: antialiased; 29 } 30 31 .selector, 32 .radio, 33 .checker, 34 .uploader, 35 .button, 36 .selector *, 37 .radio *, 38 .checker *, 39 .uploader *, 40 .button *{ 41 margin: 0; 42 padding: 0; 43 } 44 45 /* INPUT & TEXTAREA */ 46 47 48 49 input.text:focus, 50 input.email:focus, 51 input.password:focus, 52 textarea.uniform:focus { 53 } 54 55 /* SPRITES */ 56 57 /* Select */ 58 59 div.selector { 60 background-position: -483px -130px; 61 line-height: 26px; 62 height: 26px; 63 } 64 65 div.selector span { 66 background-position: right 0px; 67 height: 26px; 68 line-height: 26px; 69 } 70 71 div.selector select { 72 /* change these to adjust positioning of select element */ 73 top: 0px; 74 left: 0px; 75 } 76 77 div.selector:active, 78 div.selector.active { 79 background-position: -483px -156px; 80 } 81 82 div.selector:active span, 83 div.selector.active span { 84 background-position: right -26px; 85 } 86 87 div.selector.focus, div.selector.hover, div.selector:hover { 88 background-position: -483px -182px; 89 } 90 91 div.selector.focus span, div.selector.hover span, div.selector:hover span { 92 background-position: right -52px; 93 } 94 95 div.selector.focus:active, 96 div.selector.focus.active, 97 div.selector:hover:active, 98 div.selector.active:hover { 99 background-position: -483px -208px; 100 } 101 102 div.selector.focus:active span, 103 div.selector:hover:active span, 104 div.selector.active:hover span, 105 div.selector.focus.active span { 106 background-position: right -78px; 107 } 108 109 div.selector.disabled { 110 background-position: -483px -234px; 111 } 112 113 div.selector.disabled span { 114 background-position: right -104px; 115 } 116 117 /* Checkbox */ 118 119 div.checker { 120 width: 19px; 121 height: 19px; 122 } 123 124 div.checker input { 125 width: 19px; 126 height: 19px; 127 } 128 129 div.checker span { 130 background-position: 0px -260px; 131 height: 19px; 132 width: 19px; 133 } 134 135 div.checker:active span, 136 div.checker.active span { 137 background-position: -19px -260px; 138 } 139 140 div.checker.focus span, 141 div.checker:hover span { 142 background-position: -38px -260px; 143 } 144 145 div.checker.focus:active span, 146 div.checker:active:hover span, 147 div.checker.active:hover span, 148 div.checker.focus.active span { 149 background-position: -57px -260px; 150 } 151 152 div.checker span.checked { 153 background-position: -76px -260px; 154 } 155 156 div.checker:active span.checked, 157 div.checker.active span.checked { 158 background-position: -95px -260px; 159 } 160 161 div.checker.focus span.checked, 162 div.checker:hover span.checked { 163 background-position: -114px -260px; 164 } 165 166 div.checker.focus:active span.checked, 167 div.checker:hover:active span.checked, 168 div.checker.active:hover span.checked, 169 div.checker.active.focus span.checked { 170 background-position: -133px -260px; 171 } 172 173 div.checker.disabled span, 174 div.checker.disabled:active span, 175 div.checker.disabled.active span { 176 background-position: -152px -260px; 177 } 178 179 div.checker.disabled span.checked, 180 div.checker.disabled:active span.checked, 181 div.checker.disabled.active span.checked { 182 background-position: -171px -260px; 183 } 184 185 /* Radio */ 186 187 div.radio { 188 width: 18px; 189 height: 18px; 190 } 191 192 div.radio input { 193 width: 18px; 194 height: 18px; 195 } 196 197 div.radio span { 198 height: 18px; 199 width: 18px; 200 background-position: 0px -279px; 201 } 202 203 div.radio:active span, 204 div.radio.active span { 205 background-position: -18px -279px; 206 } 207 208 div.radio.focus span, 209 div.radio:hover span { 210 background-position: -36px -279px; 211 } 212 213 div.radio.focus:active span, 214 div.radio:active:hover span, 215 div.radio.active:hover span, 216 div.radio.active.focus span { 217 background-position: -54px -279px; 218 } 219 220 div.radio span.checked { 221 background-position: -72px -279px; 222 } 223 224 div.radio:active span.checked, 225 div.radio.active span.checked { 226 background-position: -90px -279px; 227 } 228 229 div.radio.focus span.checked, div.radio:hover span.checked { 230 background-position: -108px -279px; 231 } 232 233 div.radio.focus:active span.checked, 234 div.radio:hover:active span.checked, 235 div.radio.focus.active span.checked, 236 div.radio.active:hover span.checked { 237 background-position: -126px -279px; 238 } 239 240 div.radio.disabled span, 241 div.radio.disabled:active span, 242 div.radio.disabled.active span { 243 background-position: -144px -279px; 244 } 245 246 div.radio.disabled span.checked, 247 div.radio.disabled:active span.checked, 248 div.radio.disabled.active span.checked { 249 background-position: -162px -279px; 250 } 251 252 /* Uploader */ 253 254 div.uploader { 255 background-position: 0px -297px; 256 height: 28px; 257 } 258 259 div.uploader span.action { 260 background-position: right -409px; 261 height: 24px; 262 line-height: 24px; 263 } 264 265 div.uploader span.filename { 266 height: 24px; 267 /* change this line to adjust positioning of filename area */ 268 margin: 2px 0px 2px 2px; 269 line-height: 24px; 270 } 271 272 div.uploader.focus, 273 div.uploader.hover, 274 div.uploader:hover { 275 background-position: 0px -353px; 276 } 277 278 div.uploader.focus span.action, 279 div.uploader.hover span.action, 280 div.uploader:hover span.action { 281 background-position: right -437px; 282 } 283 284 div.uploader.active span.action, 285 div.uploader:active span.action { 286 background-position: right -465px; 287 } 288 289 div.uploader.focus.active span.action, 290 div.uploader:focus.active span.action, 291 div.uploader.focus:active span.action, 292 div.uploader:focus:active span.action { 293 background-position: right -493px; 294 } 295 296 div.uploader.disabled { 297 background-position: 0px -325px; 298 } 299 300 div.uploader.disabled span.action { 301 background-position: right -381px; 302 } 303 304 div.button { 305 background-position: 0px -523px; 306 } 307 308 div.button span { 309 background-position: right -643px; 310 } 311 312 div.button.focus, 313 div.button:focus, 314 div.button:hover, 315 div.button.hover { 316 background-position: 0px -553px; 317 } 318 319 div.button.focus span, 320 div.button:focus span, 321 div.button:hover span, 322 div.button.hover span { 323 background-position: right -673px; 324 } 325 326 div.button.active, 327 div.button:active { 328 background-position: 0px -583px; 329 } 330 331 div.button.active span, 332 div.button:active span { 333 background-position: right -703px; 334 color: #555; 335 } 336 337 div.button.disabled, 338 div.button:disabled { 339 background-position: 0px -613px; 340 } 341 342 div.button.disabled span, 343 div.button:disabled span { 344 background-position: right -733px; 345 color: #bbb; 346 cursor: default; 347 } 348 349 /* PRESENTATION */ 350 351 /* Button */ 352 353 div.button { 354 height: 30px; 355 } 356 357 div.button span { 358 margin-left: 13px; 359 height: 22px; 360 padding-top: 8px; 361 font-weight: bold; 362 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 363 font-size: 12px; 364 letter-spacing: 1px; 365 text-transform: uppercase; 366 padding-left: 2px; 367 padding-right: 15px; 368 } 369 370 /* Select */ 371 div.selector { 372 width: 190px; 373 font-size: 12px; 374 } 375 376 div.selector select { 377 min-width: 190px; 378 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 379 font-size: 12px; 380 border: solid 1px #fff; 381 } 382 383 div.selector span { 384 padding: 0px 25px 0px 2px; 385 cursor: pointer; 386 } 387 388 div.selector span { 389 color: #666; 390 width: 158px; 391 text-shadow: 0 1px 0 #fff; 392 } 393 394 div.selector.disabled span { 395 color: #bbb; 396 } 397 398 /* Checker */ 399 div.checker { 400 margin-right: 5px; 401 } 402 403 /* Radio */ 404 div.radio { 405 margin-right: 3px; 406 } 407 408 /* Uploader */ 409 div.uploader { 410 width: 190px; 411 cursor: pointer; 412 } 413 414 div.uploader span.action { 415 width: 85px; 416 text-align: center; 417 text-shadow: #fff 0px 1px 0px; 418 background-color: #fff; 419 font-size: 11px; 420 font-weight: bold; 421 } 422 423 div.uploader span.filename { 424 color: #777; 425 width: 82px; 426 border-right: solid 1px #bbb; 427 font-size: 11px; 428 } 429 430 div.uploader input { 431 width: 190px; 432 } 433 434 div.uploader.disabled span.action { 435 color: #aaa; 436 } 437 438 div.uploader.disabled span.filename { 439 border-color: #ddd; 440 color: #aaa; 441 } 442 /* 443 444 CORE FUNCTIONALITY 445 446 Not advised to edit stuff below this line 447 ----------------------------------------------------- 448 */ 449 450 .selector, 451 .checker, 452 .button, 453 .radio, 454 .uploader { 455 display: -moz-inline-box; 456 display: inline-block; 457 vertical-align: middle; 458 zoom: 1; 459 *display: inline; 460 } 461 462 .selector select:focus, .radio input:focus, .checker input:focus, .uploader input:focus { 463 outline: 0; 464 } 465 466 /* Button */ 467 468 div.button a, 469 div.button button, 470 div.button input { 471 position: absolute; 472 } 473 474 div.button { 475 cursor: pointer; 476 position: relative; 477 } 478 479 div.button span { 480 display: -moz-inline-box; 481 display: inline-block; 482 line-height: 1; 483 text-align: center; 484 } 485 486 /* Select */ 487 488 div.selector { 489 position: relative; 490 padding-left: 10px; 491 overflow: hidden; 492 } 493 494 div.selector span { 495 display: block; 496 overflow: hidden; 497 text-overflow: ellipsis; 498 white-space: nowrap; 499 } 500 501 div.selector select { 502 position: absolute; 503 opacity: 0; 504 filter: alpha(opacity:0); 505 height: 25px; 506 border: none; 507 background: none; 508 } 509 510 /* Checker */ 511 512 div.checker { 513 position: relative; 514 } 515 516 div.checker span { 517 display: -moz-inline-box; 518 display: inline-block; 519 text-align: center; 520 } 521 522 div.checker input { 523 opacity: 0; 524 filter: alpha(opacity:0); 525 display: inline-block; 526 background: none; 527 } 528 529 /* Radio */ 530 531 div.radio { 532 position: relative; 533 } 534 535 div.radio span { 536 display: -moz-inline-box; 537 display: inline-block; 538 text-align: center; 539 } 540 541 div.radio input { 542 opacity: 0; 543 filter: alpha(opacity:0); 544 text-align: center; 545 display: inline-block; 546 background: none; 547 } 548 549 /* Uploader */ 550 551 div.uploader { 552 position: relative; 553 overflow: hidden; 554 cursor: default; 555 } 556 557 div.uploader span.action { 558 float: left; 559 display: inline; 560 padding: 2px 0px; 561 overflow: hidden; 562 cursor: pointer; 563 } 564 565 div.uploader span.filename { 566 padding: 0px 10px; 567 float: left; 568 display: block; 569 overflow: hidden; 570 text-overflow: ellipsis; 571 white-space: nowrap; 572 cursor: default; 573 position:relative; 574 } 575 576 div.uploader input { 577 opacity: 0; 578 filter: alpha(opacity:0); 579 position: absolute; 580 top: 0; 581 right: 0; 582 bottom: 0; 583 float: right; 584 height: 25px; 585 border: none; 586 cursor: default; 587 }