From a968f35c4057493300b2eff17c99a76fb780ba0c Mon Sep 17 00:00:00 2001
From: Terry Truong <terry06890@gmail.com>
Date: Mon, 16 Jan 2023 01:24:09 +1100
Subject: Add settings for hiding event lines and baseline

---
 src/components/SettingsModal.vue | 32 +++++++++++++++++++++-----------
 1 file changed, 21 insertions(+), 11 deletions(-)

(limited to 'src/components/SettingsModal.vue')

diff --git a/src/components/SettingsModal.vue b/src/components/SettingsModal.vue
index bb82016..3e56373 100644
--- a/src/components/SettingsModal.vue
+++ b/src/components/SettingsModal.vue
@@ -26,17 +26,27 @@
 		</div>
 		<div class="pb-2" :class="borderBClasses">
 			<h2 class="font-bold md:text-xl text-center pt-1 md:pt-2 md:pb-1">Display</h2>
-			<div class="px-2">
-				<label> <input type="checkbox" v-model="store.reqImgs"
-					@change="onSettingChg('reqImgs')"/> Only show events with images </label>
-			</div>
-			<div class="px-2">
-				<label> <input type="checkbox" v-model="store.showEventCounts"
-					@change="onSettingChg('showEventCounts')"/> Show event count indicators </label>
-			</div>
-			<div class="px-2">
-				<label> <input type="checkbox" v-model="store.showMinorTicks"
-					@change="onSettingChg('showMinorTicks')"/> Show minor tick labels </label>
+			<div class="grid grid-cols-2">
+				<div class="px-2 col-span-2">
+					<label> <input type="checkbox" v-model="store.reqImgs"
+						@change="onSettingChg('reqImgs')"/> Only events with images </label>
+				</div>
+				<div class="px-2">
+					<label> <input type="checkbox" v-model="store.showMinorTicks"
+						@change="onSettingChg('showMinorTicks')"/> Minor tick text </label>
+				</div>
+				<div class="px-2">
+					<label> <input type="checkbox" v-model="store.showEventLines"
+						@change="onSettingChg('showEventLines')"/> Event lines </label>
+				</div>
+				<div class="px-2">
+					<label> <input type="checkbox" v-model="store.showEventCounts"
+						@change="onSettingChg('showEventCounts')"/> Event density </label>
+				</div>
+				<div class="px-2">
+					<label> <input type="checkbox" v-model="store.showBaseLine"
+						@change="onSettingChg('showBaseLine')"/> Baseline </label>
+				</div>
 			</div>
 		</div>
 		<div v-if="store.touchDevice == false" class="pb-2" :class="borderBClasses">
-- 
cgit v1.2.3

