Small spacing fixes for Mobile

damiankorcz · Jan 30, 2024 · 4203271 · 4203271
1 parent 655862e
commit 4203271
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 15 deletions.
diff --git a/src/scss/Plugins/Community/settingsSearch.scss b/src/scss/Plugins/Community/settingsSearch.scss
@@ -23,4 +23,9 @@
 	.vertical-tab-nav-item {
 		border: unset;
 	}
+}
+
+body.is-mobile.is-phone .search-input-container::before {
+	top: calc((var(--input-height) - var(--search-icon-size))/2);
+	left: var(--size-4-3);
 }
diff --git a/src/scss/Plugins/Core/commandPalette.scss b/src/scss/Plugins/Core/commandPalette.scss
@@ -31,11 +31,12 @@
 		background-color: var(--background-secondary);
 		border-top: var(--window-border);
 	}
+}
 
-	.suggestion-item.mod-complex .suggestion-hotkey {
-		font-weight: 600;
-		border-radius: var(--radius-s);
-	}
+.suggestion-item.mod-complex .suggestion-hotkey {
+	margin-left: var(--size-4-2);
+	font-weight: 600;
+	border-radius: var(--radius-s);
 }
 
 .prompt-input-container {
@@ -62,6 +63,6 @@ input.prompt-input {
 	&:hover,
 	&:focus,
 	&:focus-visible {
-		border: 1px solid var(--window-border-color);;
+		border: 1px solid var(--window-border-color);
 	}
 }
diff --git a/src/scss/User Interface/Sidebar/navHeader.scss b/src/scss/User Interface/Sidebar/navHeader.scss
@@ -75,8 +75,10 @@
 }
 
 // Position Bottom
-:is(.pt-nav-header-left-sidebar-position-bottom .workspace-split.mod-left-split,
-.pt-nav-header-right-sidebar-position-bottom .workspace-split.mod-right-split, .pt-nav-header-left-sidebar-position-bottom .workspace-drawer.mod-left, .pt-nav-header-right-sidebar-position-bottom .workspace-drawer.mod-right) {
+.pt-nav-header-left-sidebar-position-bottom .workspace-drawer.mod-left,
+.pt-nav-header-left-sidebar-position-bottom .workspace-split.mod-left-split,
+.pt-nav-header-right-sidebar-position-bottom .workspace-drawer.mod-right,
+.pt-nav-header-right-sidebar-position-bottom .workspace-split.mod-right-split {
 	.nav-header {
 		position: absolute;
 		bottom: calc(var(--size-2-3) + var(--scroll-bar-size));
@@ -96,16 +98,11 @@
 		padding: var(--size-4-1);
 		pointer-events: auto;
 		background: var(--background-secondary-blur);
+		-webkit-backdrop-filter: blur(var(--blur-intensity));
+		backdrop-filter: blur(var(--blur-intensity));
 		border: 1px solid var(--window-border-color);
 		border-radius: var(--radius-m);
 		box-shadow: var(--shadow-l);
-		-webkit-backdrop-filter: blur(var(--blur-intensity));
-		backdrop-filter: blur(var(--blur-intensity));
-	}
-
-	&.is-mobile .nav-buttons-container,
-	&.is-mobile .workspace-leaf-content[data-type="dangling-links"] .nav-header {
-		padding: var(--size-4-2);
 	}
 
 	.workspace-leaf-content[data-type="dangling-links"] .nav-header {
@@ -122,4 +119,11 @@
 	:is(.nav-files-container, .workspace-leaf-content[data-type="tag"] .tag-container, .workspace-leaf-content[data-type="backlink"] .backlink-pane, .workspace-leaf-content[data-type="starred"] .item-list, .workspace-leaf-content[data-type="dictionary-view"] .contents, .workspace-leaf-content[data-type="dangling-links"] .view-content .container, .workspace-leaf-content[data-type="bookmarks"] .view-content > div, .workspace-leaf-content[data-type=all-properties] .view-content, .workspace-leaf-content[data-type=properties] .view-content) {
 		padding-bottom: calc(38px + 2 * var(--scroll-bar-size));
 	}
+}
+
+.pt-nav-header-left-sidebar-position-bottom.is-mobile .workspace-drawer.mod-left .nav-buttons-container,
+.pt-nav-header-right-sidebar-position-bottom.is-mobile .workspace-drawer.mod-right .nav-buttons-container,
+.pt-nav-header-left-sidebar-position-bottom.is-mobile .workspace-drawer.mod-left .workspace-leaf-content[data-type="dangling-links"] .nav-header,
+.pt-nav-header-right-sidebar-position-bottom.is-mobile .workspace-drawer.mod-right .workspace-leaf-content[data-type="dangling-links"] .nav-header {
+	padding: var(--size-4-2);
 }
diff --git a/src/scss/User Interface/mobileAdjustments.scss b/src/scss/User Interface/mobileAdjustments.scss
@@ -162,7 +162,7 @@ body.is-mobile {
 
 		// The default offset does not account for the margin
 		.search-input-container:before {
-			top: calc((var(--input-height) - var(--search-icon-size) + var(--size-4-1)) / 2);
+			top: calc((var(--input-height) - var(--search-icon-size) + var(--size-4-2)) / 2);
 		}
 	}