summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorDirk Engling <erdgeist@erdgeist.org>2016-08-14 19:05:39 +0200
committerDirk Engling <erdgeist@erdgeist.org>2016-08-14 19:05:39 +0200
commit1360d0ae38c2907ebd2cc93c64960c391ab1a09d (patch)
treeb0395cd2c5c210449b331e9c54a71e0f4aa0ed2e
parentcc0425ae328e00f0a0f7ad0ab5031aff554acb13 (diff)
Make resizing work on older smaller phones, too
-rw-r--r--style.css48
1 files changed, 45 insertions, 3 deletions
diff --git a/style.css b/style.css
index 9f28aa7..221ac14 100644
--- a/style.css
+++ b/style.css
@@ -83,6 +83,7 @@ h2 {
83 min-width: 480px; 83 min-width: 480px;
84 width: 50%; 84 width: 50%;
85 max-width: 640px; 85 max-width: 640px;
86
86 margin: 0.5em auto 0 auto; 87 margin: 0.5em auto 0 auto;
87} 88}
88 89
@@ -121,7 +122,7 @@ h2 {
121} 122}
122 123
123.block-step1, 124.block-step1,
124.block-step8 { 125.block-step8 , .block-step8 h2 {
125 background-color: #F1F2E3; 126 background-color: #F1F2E3;
126 color: black !important; 127 color: black !important;
127} 128}
@@ -414,8 +415,8 @@ input[type=checkbox]:not(old):checked + label > span:before {
414 margin-left : 90px; 415 margin-left : 90px;
415} 416}
416 417
417#wrapper.step1 .block-step1 .juice, 418#wrapper.stepcancel .block-stepcancel .juice,
418#wrapper.stepcancel .block-stepcancel .juice { 419#wrapper.step1 .block-step1 .juice {
419 max-height: 350px; 420 max-height: 350px;
420} 421}
421 422
@@ -449,6 +450,47 @@ input[type=checkbox]:not(old):checked + label > span:before {
449 max-height: 450px; 450 max-height: 450px;
450} 451}
451 452
453/* On older phones our blocks need to accomodate
454 for zoomed fonts */
455@media only screen and (max-device-width: 480px) {
456#wrapper.stepcancel .block-stepcancel .juice,
457#wrapper.step1 .block-step1 .juice {
458 max-height: 450px !important;
459}
460
461#wrapper.step2 .block-step2 .juice {
462 max-height: 950px;
463}
464
465#wrapper.step3 .block-step3 .juice {
466 max-height: 950px;
467}
468
469#wrapper.step4 .block-step4 .juice {
470 max-height: 1050px;
471}
472
473#wrapper.step5 .block-step5 .juice {
474 max-height: 1050px;
475}
476
477#wrapper.step6 .block-step6 .juice {
478 max-height: 850px;
479}
480
481#wrapper.step7 .block-step7 .juice {
482 max-height: 450px;
483}
484
485#wrapper.step8 .block-step8 .juice,
486#wrapper.step8 .block-step8
487{
488 max-height: 450px;
489}
490
491
492}
493
452.credits { 494.credits {
453 margin-left: auto; 495 margin-left: auto;
454 margin-right: auto; 496 margin-right: auto;