From 6a326a12bec5040e7820c2fb8753d58ea2025f9e Mon Sep 17 00:00:00 2001
From: dragonwocky <thedragonring.bod@gmail.com>
Date: Wed, 28 Oct 2020 17:50:55 +1100
Subject: [PATCH] #177 made extra padding at the bottom in focus mode
 toggleable

---
 repo/focus-mode/mod.js     | 20 +++++++++++++++++++-
 repo/focus-mode/styles.css | 22 ++++++++++++----------
 2 files changed, 31 insertions(+), 11 deletions(-)

diff --git a/repo/focus-mode/mod.js b/repo/focus-mode/mod.js
index 10994ac..5546cbd 100644
--- a/repo/focus-mode/mod.js
+++ b/repo/focus-mode/mod.js
@@ -13,6 +13,24 @@ module.exports = {
   name: 'focus mode',
   desc:
     'hide the titlebar/menubar if the sidebar is closed (will be shown on hover).',
-  version: '0.1.1',
+  version: '0.2.0',
   author: 'arecsu',
+  options: [
+    {
+      key: 'padded',
+      label: 'add padding to bottom of the page',
+      description: `will only take effect when the sidebar is hidden. aims to make the canvas\
+        as symmetrical/consistent as possible: if there is empty space on 3 sides, the 4th should follow.z`,
+      type: 'toggle',
+      value: true,
+    },
+  ],
+  hacks: {
+    'renderer/preload.js': (store, __exports) => {
+      document.addEventListener('readystatechange', (event) => {
+        if (document.readyState !== 'complete') return false;
+        if (store().padded) document.body.dataset.focusmode = 'padded';
+      });
+    },
+  },
 };
diff --git a/repo/focus-mode/styles.css b/repo/focus-mode/styles.css
index c71829f..032761f 100644
--- a/repo/focus-mode/styles.css
+++ b/repo/focus-mode/styles.css
@@ -5,16 +5,6 @@
  * under the MIT license
  */
 
-/* add space at the bottom of the main frame when sidebar is hidden
-  * -- matches space at top for titlebar */
-.notion-dark-theme .notion-frame {
-  transition: height 100ms ease 0s;
-}
-.notion-sidebar-container[style*='width: 0px;'] + .notion-frame {
-  height: calc(
-    100% - (var(--configured--dragarea_height, 10px) + 45px)
-  ) !important;
-}
 .notion-sidebar-container[style*='width: 0px;'] + .notion-frame .notion-topbar {
   opacity: 0 !important;
   transition: opacity 200ms ease-in-out !important;
@@ -24,3 +14,15 @@
   .notion-topbar:hover {
   opacity: 1 !important;
 }
+/* add space at the bottom of the main frame when sidebar is hidden
+* -- matches space at top for titlebar */
+[data-focusmode='padded'] .notion-dark-theme .notion-frame {
+  transition: height 100ms ease 0s;
+}
+[data-focusmode='padded']
+  .notion-sidebar-container[style*='width: 0px;']
+  + .notion-frame {
+  height: calc(
+    100% - (var(--configured--dragarea_height, 10px) + 45px)
+  ) !important;
+}