| LEFT | RIGHT |
|---|
| 1 body { | 1 body { |
| 2 margin: 0; | 2 margin: 0; |
| 3 font-family: Helvetica, Arial, sans-serif; | 3 font-family: Helvetica, Arial, sans-serif; |
| 4 font-size: 16px; | 4 font-size: 16px; |
| 5 } | 5 } |
| 6 pre, | 6 pre, |
| 7 code { | 7 code { |
| 8 font-family: Menlo, monospace; | 8 font-family: Menlo, monospace; |
| 9 font-size: 14px; | 9 font-size: 14px; |
| 10 } | 10 } |
| (...skipping 380 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 391 position: relative; | 391 position: relative; |
| 392 top: -40px; | 392 top: -40px; |
| 393 margin-bottom: -120px; | 393 margin-bottom: -120px; |
| 394 } | 394 } |
| 395 h2 { clear: right; } | 395 h2 { clear: right; } |
| 396 | 396 |
| 397 div.play { | 397 div.play { |
| 398 padding: 0 20px 40px 20px; | 398 padding: 0 20px 40px 20px; |
| 399 } | 399 } |
| 400 div.play pre, | 400 div.play pre, |
| 401 div.play textarea { | 401 div.play textarea, |
| 402 div.play .lines { |
| 402 padding: 0; | 403 padding: 0; |
| 403 margin: 0; | 404 margin: 0; |
| 404 font-family: Menlo, monospace; | 405 font-family: Menlo, monospace; |
| 405 font-size: 14px; | 406 font-size: 14px; |
| 406 } | 407 } |
| 407 div.play .input { | 408 div.play .input { |
| 408 padding: 10px; | 409 padding: 10px; |
| 409 margin-top: 10px; | 410 margin-top: 10px; |
| 410 height: 300px; | |
| 411 | 411 |
| 412 -webkit-border-top-left-radius: 5px; | 412 -webkit-border-top-left-radius: 5px; |
| 413 -webkit-border-top-right-radius: 5px; | 413 -webkit-border-top-right-radius: 5px; |
| 414 -moz-border-radius-topleft: 5px; | 414 -moz-border-radius-topleft: 5px; |
| 415 -moz-border-radius-topright: 5px; | 415 -moz-border-radius-topright: 5px; |
| 416 border-top-left-radius: 5px; | 416 border-top-left-radius: 5px; |
| 417 border-top-right-radius: 5px; | 417 border-top-right-radius: 5px; |
| 418 |
| 419 overflow: hidden; |
| 418 } | 420 } |
| 419 div.play .input textarea { | 421 div.play .input textarea { |
| 420 width: 100%; | 422 width: 100%; |
| 421 height: 100%; | 423 height: 100%; |
| 422 border: none; | 424 border: none; |
| 423 outline: none; | 425 outline: none; |
| 424 resize: none; | 426 resize: none; |
| 427 |
| 428 overflow: hidden; |
| 425 } | 429 } |
| 426 div.play .output { | 430 div.play .output { |
| 427 border-top: none !important; | 431 border-top: none !important; |
| 428 | 432 |
| 429 padding: 10px; | 433 padding: 10px; |
| 430 » height: 100px; | 434 » max-height: 200px; |
| 431 overflow: auto; | 435 overflow: auto; |
| 432 | 436 |
| 433 -webkit-border-bottom-right-radius: 5px; | 437 -webkit-border-bottom-right-radius: 5px; |
| 434 -webkit-border-bottom-left-radius: 5px; | 438 -webkit-border-bottom-left-radius: 5px; |
| 435 -moz-border-radius-bottomright: 5px; | 439 -moz-border-radius-bottomright: 5px; |
| 436 -moz-border-radius-bottomleft: 5px; | 440 -moz-border-radius-bottomleft: 5px; |
| 437 border-bottom-right-radius: 5px; | 441 border-bottom-right-radius: 5px; |
| 438 border-bottom-left-radius: 5px; | 442 border-bottom-left-radius: 5px; |
| 439 } | 443 } |
| 440 div.play .output pre { | 444 div.play .output pre { |
| (...skipping 16 matching lines...) Expand all Loading... |
| 457 div.play .buttons { | 461 div.play .buttons { |
| 458 float: right; | 462 float: right; |
| 459 padding: 20px 0 10px 0; | 463 padding: 20px 0 10px 0; |
| 460 text-align: right; | 464 text-align: right; |
| 461 } | 465 } |
| 462 div.play .buttons a { | 466 div.play .buttons a { |
| 463 height: 16px; | 467 height: 16px; |
| 464 margin-left: 5px; | 468 margin-left: 5px; |
| 465 padding: 10px; | 469 padding: 10px; |
| 466 cursor: pointer; | 470 cursor: pointer; |
| 467 } | 471 } |
| LEFT | RIGHT |
|---|
