added class for search with toc

assets/js/theme/design-system/search.js

@@ -15,6 +15,9 @@ class Search {
     }
 
     listen() {
+        if (document.body.querySelector(".toc-cta")) {
+            this.button.classList.add('in-page-with-toc');
+        }
         this.button.addEventListener('click', () => {
             this.toggle(true);      
             this.removedItems = this.element.querySelector('.pagefind-ui__suppressed', '.pagefind-ui__search-clear');

assets/sass/_theme/design-system/search.sass

@@ -14,9 +14,10 @@
         line-height: inherit
         margin-left: px2rem(8)
     @include media-breakpoint-down(md)
-        border-bottom: 1px solid #adb5bd
-        padding: $spacing1 0
-        width: 100%
+        &:not(.pagefind-fixed)
+            border-bottom: 1px solid #adb5bd
+            padding: $spacing1 0
+            width: 100%
 .search__close
     @include icon-block(close, after)
     position: fixed
@@ -29,7 +30,7 @@
         margin-left: $spacing0
         width: px2rem(15)
     @include media-breakpoint-down(md)
-        right: 0
+        right: $spacing1
         top: half($spacing0)
 #search
     background: $color-background
@@ -155,4 +156,9 @@
     min-width: calc(#{$spacing3} * 3)
     &::after
         position: absolute
-        right: $spacing0
\ No newline at end of file
+        right: $spacing0
+    @include media-breakpoint-down(md)
+        left: 0
+        width: 100vw
+        &.in-page-with-toc
+            bottom: px2rem(44)