From 613da5dd87bd297f6e05fe4bb27e62270205a5aa Mon Sep 17 00:00:00 2001 From: Joe Wreschnig Date: Mon, 1 Sep 2014 01:23:59 +0200 Subject: [PATCH] Keep back/press on controls in a fixed header when standalone. --- abilities.html | 7 +++---- allevents.html | 13 ++++-------- cards.html | 10 +++------ heroik.css | 57 ++++++++++++++++++++++++++++++++++---------------- heroik.html | 2 +- scenario.html | 12 ++++------- variants.html | 7 +++---- 7 files changed, 57 insertions(+), 51 deletions(-) diff --git a/abilities.html b/abilities.html index b0e9776..b9f395f 100644 --- a/abilities.html +++ b/abilities.html @@ -28,11 +28,10 @@ Special Abilities - Hero: Immortal King -
+
+ ◀ Return +
- - ◀ Return -

Special Abilities

diff --git a/allevents.html b/allevents.html index 6591e8c..7a0444e 100644 --- a/allevents.html +++ b/allevents.html @@ -32,19 +32,14 @@ - -
+
+ ◀ Return +
-
- - ◄ Return - -
+

Fate Chart Events

-

Fate Chart Events

Canonical

diff --git a/cards.html b/cards.html index b7079c3..4ed3189 100644 --- a/cards.html +++ b/cards.html @@ -30,14 +30,10 @@ Expansion Cards - Hero: Immortal King -
+
+ ◀ Return +
-
- - ◄ Return - -

Promotional Cards

Ykesha
diff --git a/heroik.css b/heroik.css index d58402f..40bb1ae 100644 --- a/heroik.css +++ b/heroik.css @@ -66,10 +66,6 @@ html { height: 100%; } -@media (max-width: 639px) { - html { font-size: 14px; } -} - body { background-color: black; min-height: 100%; @@ -77,10 +73,6 @@ body { box-sizing: border-box; } -body.standalone { - padding-top: 20px; -} - main { background-color: white; max-width: 25.2em; @@ -91,8 +83,12 @@ main { box-sizing: border-box; } -body.standalone main { - padding-top: 0.5em; +body.standalone header + main { + padding-top: 5em; +} + +body.standalone header:empty + main { + padding-top: 2em; } table { @@ -252,6 +248,15 @@ input[type=checkbox] { box-shadow: 0.0625em 0.0625em 0.0625em 0.0625em #888; } + +.standalone header .button { + box-shadow: 0 0 0.5em 0.0625em #aaa; +} + +.standalone header .button:active { + box-shadow: 0 0 0 0 #aaa; +} + main > div, main > noscript { text-align: center; margin-bottom: 1rem; @@ -711,18 +716,27 @@ table { bottom: 1.8%; } -#statusbar { - display: none; - position: fixed; +header { left: 0; top: 0; right: 0; - height: 20px; - background-color: black; + margin: auto; + max-width: 25.2em; + background-color: white; + padding: 0.5em; + box-sizing: border-box; + z-index: 2; } -body.standalone #statusbar { - display: block; +body.standalone header:empty { + padding: 0; + padding-top: 20px; +} + +body.standalone header { + position: fixed; + padding-top: 20px; + background-color: black; } h1, h2, [onclick], label { @@ -737,13 +751,20 @@ h1, h2, [onclick], label { cursor: pointer; } +@media (max-width: 639px) { + html { font-size: 14px; } + header .button { + padding: 0 0.2em; + } +} + @media print { @page { size: 3.5in 7in; margin: 0.5em; } - .no-print { + header, .no-print { display: none !important; } diff --git a/heroik.html b/heroik.html index 9a78696..64cd2e3 100644 --- a/heroik.html +++ b/heroik.html @@ -28,7 +28,7 @@ Hero: Immortal King -
+

Find a Dungeon

Difficulty

diff --git a/scenario.html b/scenario.html index 73cd6f9..5959411 100644 --- a/scenario.html +++ b/scenario.html @@ -30,18 +30,14 @@ Scenario - Hero: Immortal King -
-
-
- - ◄ Finished! - +
+ ◀ Finished! Press On ▼ -
+ +

The Boiling Forest

diff --git a/variants.html b/variants.html index a6baea7..9eb90ea 100644 --- a/variants.html +++ b/variants.html @@ -29,11 +29,10 @@ Variants - Hero: Immortal King -
+
+ ◀ Return +
- - ◀ Return -

Canon Variants

Advanced Solitaire

    -- 2.30.2
Fate ChartEvent