From 46bb7603198a8fd239052d0074b5b33bd6295878 Mon Sep 17 00:00:00 2001
From: Akash-Kumar-Sen <akashkumarsen4@gmail.com>
Date: Sun, 7 Aug 2022 13:45:32 +0530
Subject: [PATCH] Ensure page explorer header item aligns with toggle on sm
 device

- fixes #8939
---
 CHANGELOG.txt                                        | 1 +
 client/src/components/PageExplorer/PageExplorer.scss | 4 ++--
 docs/releases/4.0.md                                 | 1 +
 3 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.txt b/CHANGELOG.txt
index fefd824006..6fcbfca16c 100644
--- a/CHANGELOG.txt
+++ b/CHANGELOG.txt
@@ -154,6 +154,7 @@ Changelog
  * Fix: Ensure that the fields on login and password reset forms are visible in forced colors mode (Paarth Agarwal)
  * Fix: Missing a outline on dropdown content and malformed tooltip arrow in forced colors mode (Anuja Verma, LB (Ben) Johnston)
  * Fix: Layout issues with reports (including form submissions listings) on md device widths (Akash Kumar Sen, LB (Ben) Johnston)
+ * Fix: Layout issue with page explorer's inner header item on small device widths (Akash Kumar Sen)
 
 
 3.0.1 (16.06.2022)
diff --git a/client/src/components/PageExplorer/PageExplorer.scss b/client/src/components/PageExplorer/PageExplorer.scss
index 5f4ab9f23b..8d0afe37ef 100644
--- a/client/src/components/PageExplorer/PageExplorer.scss
+++ b/client/src/components/PageExplorer/PageExplorer.scss
@@ -44,8 +44,8 @@ $explorer-header-horizontal-padding: 10px;
   display: grid;
   grid-template-columns: 1fr auto;
   align-items: center;
-  margin-inline-start: $sidebar-toggle-spacing * 2 + $sidebar-toggle-size;
-  height: $sidebar-toggle-spacing * 2 + $sidebar-toggle-size;
+  margin-inline-start: $mobile-nav-indent;
+  height: $mobile-nav-indent;
 
   @include media-breakpoint-up(sm) {
     margin-inline-start: initial;
diff --git a/docs/releases/4.0.md b/docs/releases/4.0.md
index 0cbe9eeb86..d829990b6e 100644
--- a/docs/releases/4.0.md
+++ b/docs/releases/4.0.md
@@ -210,6 +210,7 @@ The bulk of these enhancements have been from Paarth Agarwal, who has been doing
  * Prevent comment buttons from overlapping with fields (Thibaud Colas)
  * Resolve MySQL search compatibility issue with Django 4.1 (Andy Chosak)
  * Resolve layout issues with reports (including form submissions listings) on md device widths (Akash Kumar Sen, LB (Ben) Johnston)
+ * Resolve Layout issue with page explorer's inner header item on small device widths (Akash Kumar Sen)
 
 
 ## Upgrade considerations