feat: collection level headers and authorization (#3505)

Co-authored-by: Andrew Bastin <andrewbastin.k@gmail.com>

packages/hoppscotch-ui/src/assets/scss/histoire.scss

@@ -22,6 +22,7 @@
   --lower-tertiary-sticky-fold: 7.125rem;
   --lower-fourth-sticky-fold: 9.188rem;
   --sidebar-primary-sticky-fold: 2rem;
+  --properties-primary-sticky-fold: 2.05rem;
 }
 
 @mixin dark-theme {

packages/hoppscotch-ui/src/components/smart/Modal.vue

@@ -59,7 +59,7 @@
             </div>
             <div
               class="flex flex-col overflow-y-auto max-h-[55vh]"
-              :class="{ 'p-4': !fullWidth }"
+              :class="{ 'p-4': !fullWidth && !fullWidthBody }"
             >
               <slot name="body"></slot>
             </div>
@@ -117,6 +117,7 @@ withDefaults(
     dimissible: boolean
     placement: string
     fullWidth: boolean
+    fullWidthBody: boolean
     styles: string
     closeText: string | null
   }>(),
@@ -126,6 +127,7 @@ withDefaults(
     dimissible: true,
     placement: "top",
     fullWidth: false,
+    fullWidthBody: false,
     styles: "sm:max-w-lg",
     closeText: null,
   }