[CL-550] Fix popup layout padding and adjust views with extra bottom space (#13562)

* [CL-550] Fix popup layout padding and adjust views with extra bottom space

* simplify css

* fix add/edit item page

* cr changes

* fix failing test

---------

Co-authored-by: Will Martin <contact@willmartian.com>

apps/browser/src/auth/popup/settings/account-security.component.html

@@ -95,7 +95,7 @@
       </bit-card>
     </bit-section>
 
-    <bit-section>
+    <bit-section disableMargin>
       <bit-section-header>
         <h2 bitTypography="h6">{{ "otherOptions" | i18n }}</h2>
       </bit-section-header>

apps/browser/src/autofill/popup/settings/autofill.component.html

@@ -209,7 +209,7 @@
         </bit-form-field>
       </bit-card>
     </bit-section>
-    <bit-section>
+    <bit-section [disableMargin]="!blockBrowserInjectionsByDomainEnabled">
       <bit-section-header>
         <h2 bitTypography="h6">{{ "additionalOptions" | i18n }}</h2>
       </bit-section-header>
@@ -270,7 +270,7 @@
         </bit-form-field>
       </bit-card>
     </bit-section>
-    <bit-section *ngIf="blockBrowserInjectionsByDomainEnabled">
+    <bit-section *ngIf="blockBrowserInjectionsByDomainEnabled" disableMargin>
       <bit-item>
         <a bit-item-content routerLink="/blocked-domains">{{ "blockedDomains" | i18n }}</a>
         <i slot="end" class="bwi bwi-angle-right bwi-lg row-sub-icon" aria-hidden="true"></i>

apps/browser/src/autofill/popup/settings/notifications.component.html

@@ -47,7 +47,7 @@
         </bit-form-control>
       </bit-card>
     </bit-section>
-    <bit-section>
+    <bit-section disableMargin>
       <bit-item>
         <a bit-item-content routerLink="/excluded-domains">{{ "excludedDomains" | i18n }}</a>
         <i slot="end" class="bwi bwi-angle-right row-sub-icon" aria-hidden="true"></i>

apps/browser/src/platform/popup/layout/popup-page.component.html

@@ -19,7 +19,7 @@
     [ngClass]="{ 'tw-invisible': loading }"
   >
     <div
-      class="tw-max-w-screen-sm tw-mx-auto tw-flex-1 tw-flex tw-flex-col tw-size-full"
+      class="tw-max-w-screen-sm tw-mx-auto tw-flex-1 tw-flex tw-flex-col tw-w-full"
       [ngClass]="{ 'tw-p-3 bit-compact:tw-p-2': !disablePadding }"
     >
       <ng-content></ng-content>