From 8ef27713f14a07cfcd628341c3b1aa09b35ccbda Mon Sep 17 00:00:00 2001
From: Robyn MacCallum <robyntmaccallum@gmail.com>
Date: Wed, 25 May 2022 10:18:00 -0400
Subject: [PATCH] [SG-345] Switch in-line "+"  add org button to more explicit
 version (#1703)

* switch in-line plus add org button to more explicit version

* Add spaces to line up text better
---
 .../organization-filter.component.html        | 35 +++++++++----------
 src/scss/vault-filters.scss                   |  8 -----
 2 files changed, 17 insertions(+), 26 deletions(-)

diff --git a/src/app/modules/vault-filter/components/organization-filter.component.html b/src/app/modules/vault-filter/components/organization-filter.component.html
index e45db370560..0c4bf90eb1e 100644
--- a/src/app/modules/vault-filter/components/organization-filter.component.html
+++ b/src/app/modules/vault-filter/components/organization-filter.component.html
@@ -14,7 +14,7 @@
           <span class="filter-buttons">
             <a href="#" routerLink="/create-organization" class="filter-button">
               <i class="bwi bwi-plus bwi-fw" aria-hidden="true"></i>
-              {{ "newOrganization" | i18n }}
+              &nbsp;{{ "newOrganization" | i18n }}
             </a>
           </span>
         </li>
@@ -45,14 +45,6 @@
         >
           &nbsp;{{ organizationGrouping.name | i18n }}
         </button>
-        <a
-          href="#"
-          routerLink="/create-organization"
-          class="text-muted ml-auto create-organization-link"
-          appA11yTitle="{{ 'newOrganization' | i18n }}"
-        >
-          <i class="bwi bwi-plus bwi-fw" aria-hidden="true"></i>
-        </a>
       </div>
       <ul id="organization-filters" *ngIf="!isCollapsed" class="filter-options">
         <li
@@ -75,6 +67,14 @@
             </ng-container>
           </span>
         </li>
+        <li class="filter-option">
+          <span class="filter-buttons">
+            <a href="#" routerLink="/create-organization" class="filter-button">
+              <i class="bwi bwi-plus bwi-fw" aria-hidden="true"></i>
+              &nbsp;{{ "newOrganization" | i18n }}
+            </a>
+          </span>
+        </li>
       </ul>
     </ng-container>
     <ng-container *ngSwitchCase="'singleOrganizationAndPersonalOwnershipPolicies'">
@@ -110,15 +110,6 @@
         >
           &nbsp;{{ organizationGrouping.name | i18n }}
         </button>
-        <a
-          href="#"
-          routerLink="/create-organization"
-          class="text-muted ml-auto create-organization-link"
-          appA11yTitle="{{ 'newOrganization' | i18n }}"
-          *ngIf="!(displayMode === 'singleOrganizationPolicy')"
-        >
-          <i class="bwi bwi-plus bwi-fw" aria-hidden="true"></i>
-        </a>
       </div>
       <ul id="organization-filters" *ngIf="!isCollapsed" class="filter-options">
         <li class="filter-option" [ngClass]="{ active: activeFilter.myVaultOnly }">
@@ -149,6 +140,14 @@
             </ng-container>
           </span>
         </li>
+        <li class="filter-option" *ngIf="!(displayMode === 'singleOrganizationPolicy')">
+          <span class="filter-buttons">
+            <a href="#" routerLink="/create-organization" class="filter-button">
+              <i class="bwi bwi-plus bwi-fw" aria-hidden="true"></i>
+              &nbsp;{{ "newOrganization" | i18n }}
+            </a>
+          </span>
+        </li>
       </ul>
     </ng-container>
   </ng-container>
diff --git a/src/scss/vault-filters.scss b/src/scss/vault-filters.scss
index 292eff57f10..301497ea5b3 100644
--- a/src/scss/vault-filters.scss
+++ b/src/scss/vault-filters.scss
@@ -14,14 +14,6 @@
     font-size: $font-size-base;
   }
 
-  a.create-organization-link {
-    &:hover {
-      @include themify($themes) {
-        color: themed("iconHover") !important;
-      }
-    }
-  }
-
   button {
     @extend .no-btn;
   }