From d0a1d248ca3b6155d42a091ee8b6b8e6699b7b16 Mon Sep 17 00:00:00 2001
From: Abu Bilal <abu_bilal@sh.hn>
Date: Thu, 7 May 2026 21:52:59 +0300
Subject: [PATCH] add setting to control the bottom offset

---
 main.ts    | 64 ++++++++++++++++++++++++++++++++++++++++++++++++++++--
 styles.css | 36 +++++++++++++++---------------
 2 files changed, 80 insertions(+), 20 deletions(-)

diff --git a/main.ts b/main.ts
index a841d0e..be09f90 100644
--- a/main.ts
+++ b/main.ts
@@ -1,13 +1,27 @@
-import { Editor, MarkdownView, Plugin, Platform, Notice } from 'obsidian';
+import { App, Editor, MarkdownView, Plugin, Platform, Notice, PluginSettingTab, Setting } from 'obsidian';
+
+interface DoubleRowToolbarSettings {
+	bottomOffset: number;
+}
+
+const DEFAULT_SETTINGS: DoubleRowToolbarSettings = {
+	bottomOffset: 25
+}
 
 export default class DoubleRowToolbarPlugin extends Plugin {
+	settings: DoubleRowToolbarSettings;
+
 	async onload() {
+		await this.loadSettings();
 
 		if (Platform.isDesktop) {
 			new Notice("'Double row toolbar' plugin is not supported on desktop devices.");
 			return;
 		}
 
+		// Apply the stored setting immediately on load
+		this.applyOffset();
+
 		this.addCommand({
 			id: "delete-current-line",
 			name: "Delete current line",
@@ -17,9 +31,55 @@ export default class DoubleRowToolbarPlugin extends Plugin {
 				editor.focus();
 			}
 		});
+
+		this.addSettingTab(new DoubleRowToolbarSettingTab(this.app, this));
 	}
 
-	onunload() { }
+	async loadSettings() {
+		this.settings = Object.assign({}, DEFAULT_SETTINGS, await this.loadData());
+	}
+
+	async saveSettings() {
+		await this.saveData(this.settings);
+		this.applyOffset();
+	}
+
+	// This updates the CSS variable you defined in styles.css
+	applyOffset() {
+		document.documentElement.style.setProperty('--double_row_mobile_toolbar_bottom_offset', `${this.settings.bottomOffset}px`);
+	}
+
+	onunload() {
+		// Optional: Clean up the variable when plugin is disabled
+		document.documentElement.style.removeProperty('--double_row_mobile_toolbar_bottom_offset');
+	}
 }
 
+class DoubleRowToolbarSettingTab extends PluginSettingTab {
+	plugin: DoubleRowToolbarPlugin;
 
+	constructor(app: App, plugin: DoubleRowToolbarPlugin) {
+		super(app, plugin);
+		this.plugin = plugin;
+	}
+
+	display(): void {
+		const { containerEl } = this;
+		containerEl.empty();
+
+		containerEl.createEl('h2', { text: 'Double Row Toolbar Settings' });
+
+		new Setting(containerEl)
+			.setName('Bottom Offset')
+			.setDesc('Adjust the distance from the bottom of the screen (Default: 25px).')
+			.addSlider(slider => slider
+				.setLimits(0, 100, 1) // Adjust range as needed
+				.setValue(this.plugin.settings.bottomOffset)
+				.onChange(async (value) => {
+					this.plugin.settings.bottomOffset = value;
+					await this.plugin.saveSettings();
+				})
+				.setDynamicTooltip()
+			);
+	}
+}
\ No newline at end of file
diff --git a/styles.css b/styles.css
index 8f97242..43e0f98 100644
--- a/styles.css
+++ b/styles.css
@@ -1,22 +1,22 @@
-  .mobile-toolbar {
+.mobile-toolbar {
     .mobile-toolbar-options-container {
-      height: 100%;
-      .mobile-toolbar-options-list-container {
-        border-radius: 5px;
-        bottom: 25px;
-        position: relative;
-        height: 70px;
+        height: 100%;
+        .mobile-toolbar-options-list-container {
+            border-radius: 5px;
+            /* The TS code above will override the 25px fallback */
+            bottom: var(--double_row_mobile_toolbar_bottom_offset, 25px);
+            position: relative;
+            height: 70px;
 
-        .mobile-toolbar-options-list {
-          padding-bottom: 2px;
-          padding-top: 2px;
-          display: grid !important;
-          grid-template-rows: 1fr 1fr;
-          grid-auto-flow: column;
-          row-gap: 4px;
-          height: 100%;
+            .mobile-toolbar-options-list {
+                padding-bottom: 2px;
+                padding-top: 2px;
+                display: grid !important;
+                grid-template-rows: 1fr 1fr;
+                grid-auto-flow: column;
+                row-gap: 4px;
+                height: 100%;
+            }
         }
-      }
-
     }
-  }
+}
\ No newline at end of file