[SG-451] [Defect] - Safari Extension Does Not Display Icon for Long Named Orgs (#3145)

* chore: added strings for disabled org messages

* chore: added icon display

* chore: added prevent filter check

* chore: code changes for desktop

* chore: browser

* fix: float icon

* fix: float right icon

* fix: vary elipsis size

apps/desktop/src/app/modules/vault-filter/components/organization-filter.component.html

@@ -92,13 +92,15 @@
             >
               <i class="bwi bwi-fw bwi-business" aria-hidden="true"></i>
               &nbsp;{{ organization.name }}
+            </button>
+            <span class="ml-auto">
               <i
                 *ngIf="!organization.enabled"
-                class="bwi bwi-fw bwi-exclamation-triangle text-danger"
+                class="bwi bwi-fw bwi-exclamation-triangle text-danger mr-auto"
                 aria-label="{{ 'organizationIsDisabled' | i18n }}"
                 appA11yTitle="{{ 'organizationIsDisabled' | i18n }}"
               ></i>
-            </button>
+            </span>
           </span>
         </li>
       </ul>

apps/desktop/src/scss/base.scss

@@ -136,3 +136,9 @@ div:not(.modal)::-webkit-scrollbar-thumb,
 .cdk-virtual-scroll-content-wrapper {
   width: 100%;
 }
+
+//taken from bootstrap for replicating functionality
+.ml-auto,
+.mx-auto {
+  margin-left: auto !important;
+}