From 545b8e2b6e140d5aa3f46d7632bd38eee3d68667 Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Sat, 19 Feb 2022 22:20:53 -0800
Subject: [PATCH] bs5: fix filter editor spacing

---
 .../filter-editor/filter-editor.component.html           | 6 +++---
 .../filter-editor/filter-editor.component.scss           | 9 +++++++++
 src-ui/src/theme.scss                                    | 1 +
 3 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.html b/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.html
index 94c694aeb..892947ae4 100644
--- a/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.html
+++ b/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.html
@@ -2,8 +2,8 @@
    <div class="col mb-2 mb-xl-0">
      <div class="form-inline d-flex align-items-center">
          <div class="input-group input-group-sm flex-fill w-auto">
-           <div class="input-group-prepend" ngbDropdown>
-            <button class="btn btn-outline-primary" ngbDropdownToggle>{{textFilterTargetName}}</button>
+           <div ngbDropdown>
+            <button class="btn btn-sm btn-outline-primary" ngbDropdownToggle>{{textFilterTargetName}}</button>
             <div class="dropdown-menu shadow" ngbDropdownMenu>
               <button *ngFor="let t of textFilterTargets" ngbDropdownItem [class.active]="textFilterTarget == t.id" (click)="changeTextFilterTarget(t.id)">{{t.name}}</button>
             </div>
@@ -51,7 +51,7 @@
    </div>
    <div class="w-100 d-xl-none"></div>
    <div class="col col-xl-auto mb-2 mb-xl-0">
-     <button class="btn btn-link btn-sm px-0 mx-0 ms-xl-n4" [disabled]="!rulesModified" (click)="resetSelected()">
+     <button class="btn btn-link btn-sm px-0 mx-0 ms-xl-n3" [disabled]="!rulesModified" (click)="resetSelected()">
        <svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-x me-1" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
          <path fill-rule="evenodd" d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z"/>
        </svg><ng-container i18n>Reset filters</ng-container>
diff --git a/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.scss b/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.scss
index 05df7b213..d34afd57c 100644
--- a/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.scss
+++ b/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.scss
@@ -8,3 +8,12 @@
     min-height: 1em;
   }
 }
+
+.input-group .dropdown .btn {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+
+.me-2 {
+  margin-right: 0.7rem !important; // tweak to make room for badges
+}
diff --git a/src-ui/src/theme.scss b/src-ui/src/theme.scss
index defe95cfa..e01e3cdc3 100644
--- a/src-ui/src/theme.scss
+++ b/src-ui/src/theme.scss
@@ -1,6 +1,7 @@
 $paperless-green: #17541f;
 $primary: #17541f;
 $primaryFaded: #d1ddd2;
+$enable-negative-margins: true;
 
 .bg-body {
   background-color: #fff;