From 4456867bc9127374a73b823686455592af43138f Mon Sep 17 00:00:00 2001 From: David Wheatley Date: Sat, 16 Jul 2022 22:39:37 +0100 Subject: [PATCH 1/4] feat: use sticky for discussion side nav --- framework/core/less/common/App.less | 2 +- framework/core/less/forum/DiscussionPage.less | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/framework/core/less/common/App.less b/framework/core/less/common/App.less index 291c3b7945..fe651138f2 100644 --- a/framework/core/less/common/App.less +++ b/framework/core/less/common/App.less @@ -2,8 +2,8 @@ position: relative !important; padding-top: var(--header-height); padding-bottom: 50px; - overflow-x: hidden; min-height: 100vh; + max-width: 100vw; @media @phone { padding-top: var(--header-height-phone); diff --git a/framework/core/less/forum/DiscussionPage.less b/framework/core/less/forum/DiscussionPage.less index a3f53c9e15..a1821ba69f 100644 --- a/framework/core/less/forum/DiscussionPage.less +++ b/framework/core/less/forum/DiscussionPage.less @@ -25,15 +25,15 @@ @media @tablet-up { .DiscussionPage-nav { float: right; + position: sticky; + top: var(--header-height); + padding-top: 32px; &, > ul { width: 150px; } + > ul { - position: fixed; - margin-top: 30px; - z-index: 1; - > li { margin-bottom: 10px; } From fd6165e1ae7c67c8c6ee22953b6f6c8331d77791 Mon Sep 17 00:00:00 2001 From: David Wheatley Date: Sun, 17 Jul 2022 10:21:00 +0100 Subject: [PATCH 2/4] fix: extreme gap below first post --- framework/core/less/forum/Post.less | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/framework/core/less/forum/Post.less b/framework/core/less/forum/Post.less index 6fe81e8845..6c6b74af09 100644 --- a/framework/core/less/forum/Post.less +++ b/framework/core/less/forum/Post.less @@ -14,6 +14,11 @@ top: 5px; opacity: 0.5; } + + // Needed for sidebar `position: sticky` due to its `float` + &::after { + display: table-cell; + } } .Post-header { From d531d49cc1959def5e3ba59e8d0dc0d058a9019c Mon Sep 17 00:00:00 2001 From: David Wheatley Date: Sun, 17 Jul 2022 10:24:45 +0100 Subject: [PATCH 3/4] chore: hide overflow x on body --- framework/core/less/common/App.less | 1 - framework/core/less/common/scaffolding.less | 1 + 2 files changed, 1 insertion(+), 1 deletion(-) diff --git a/framework/core/less/common/App.less b/framework/core/less/common/App.less index fe651138f2..d2e55e7e72 100644 --- a/framework/core/less/common/App.less +++ b/framework/core/less/common/App.less @@ -3,7 +3,6 @@ padding-top: var(--header-height); padding-bottom: 50px; min-height: 100vh; - max-width: 100vw; @media @phone { padding-top: var(--header-height-phone); diff --git a/framework/core/less/common/scaffolding.less b/framework/core/less/common/scaffolding.less index 48280dae61..e0cafb51fc 100644 --- a/framework/core/less/common/scaffolding.less +++ b/framework/core/less/common/scaffolding.less @@ -13,6 +13,7 @@ body { font-size: 13px; line-height: 1.5; overflow-y: scroll; + overflow-x: hidden; } h1, h2, h3, h4, h5, h6 { From fa742325f9780fcaa7b8b54f5d7a498214e4b6aa Mon Sep 17 00:00:00 2001 From: David Wheatley Date: Sun, 17 Jul 2022 10:27:54 +0100 Subject: [PATCH 4/4] fix: remove clearfix instead of table-cell hack --- framework/core/less/forum/Post.less | 6 ------ 1 file changed, 6 deletions(-) diff --git a/framework/core/less/forum/Post.less b/framework/core/less/forum/Post.less index 6c6b74af09..691d8f6870 100644 --- a/framework/core/less/forum/Post.less +++ b/framework/core/less/forum/Post.less @@ -8,17 +8,11 @@ position: relative; top: 0; border-radius: var(--border-radius); - .clearfix(); &.editing { top: 5px; opacity: 0.5; } - - // Needed for sidebar `position: sticky` due to its `float` - &::after { - display: table-cell; - } } .Post-header {