From cac6d3b4d92908915ade3fe22df263da2b903557 Mon Sep 17 00:00:00 2001
From: Jermolene <jeremy@jermolene.com>
Date: Sat, 8 Aug 2015 08:39:37 +0100
Subject: [PATCH] Improve sidebar behaviour on narrow screens
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Now the sidebar is a fixed overlay. It is scrollable, taking up 50% of
the height of the screen, so that the underlying page can be partially
seen.

There’s more to be done: on narrow screens we probably want the sidebar
to be hidden by default.
---
 themes/tiddlywiki/vanilla/base.tid | 20 +++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/themes/tiddlywiki/vanilla/base.tid b/themes/tiddlywiki/vanilla/base.tid
index e32bbf8c0..7acfecf84 100644
--- a/themes/tiddlywiki/vanilla/base.tid
+++ b/themes/tiddlywiki/vanilla/base.tid
@@ -606,10 +606,28 @@ button.tc-untagged-label {
 
 	.tc-sidebar-header {
 		padding: 14px;
-		min-height: 32px;
+		<<if-no-sidebar "
+		    padding: inherit;
+		">>
 		margin-top: {{$:/themes/tiddlywiki/vanilla/metrics/storytop}};
 	}
 
+	.tc-sidebar-scrollable {
+		position: fixed;
+		overflow-y: auto;
+		overflow-x: auto;
+		-webkit-overflow-scrolling: touch;
+	    z-index: 1000;
+	    background-color: <<colour page-background>>;
+	    width: 100%;
+	    max-height: 100%;
+		<<if-no-sidebar "
+		    width: auto;
+		    max-height: auto;
+		">>
+	}
+
+
 	.tc-story-river {
 		position: relative;
 		padding: 0;