From e3efe8c18ed46afc55c42afc1a0884bc11c9494a Mon Sep 17 00:00:00 2001
From: Shane Melton <smelton@bitwarden.com>
Date: Fri, 17 May 2024 13:52:42 -0700
Subject: [PATCH] [PM-6825] Use tailwind for vault icon styling

---
 apps/desktop/src/scss/misc.scss                       | 11 +++++++++++
 libs/angular/src/vault/components/icon.component.html |  3 ++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/apps/desktop/src/scss/misc.scss b/apps/desktop/src/scss/misc.scss
index 8ed6a9b54b..ccc0af8fa4 100644
--- a/apps/desktop/src/scss/misc.scss
+++ b/apps/desktop/src/scss/misc.scss
@@ -577,6 +577,17 @@ app-vault-view .box-footer {
   user-select: auto;
 }
 
+/* override for vault icon in desktop */
+app-vault-icon > div {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  float: left;
+  height: 36px;
+  width: 34px;
+  margin-left: -5px;
+}
+
 /* tweak for inconsistent line heights in cipher view */
 .box-footer button,
 .box-footer a {
diff --git a/libs/angular/src/vault/components/icon.component.html b/libs/angular/src/vault/components/icon.component.html
index fd91d4095c..976c6ea421 100644
--- a/libs/angular/src/vault/components/icon.component.html
+++ b/libs/angular/src/vault/components/icon.component.html
@@ -1,9 +1,10 @@
-<div class="icon" aria-hidden="true">
+<div class="tw-flex tw-justify-center tw-items-center" aria-hidden="true">
   <ng-container *ngIf="data$ | async as data">
     <img
       [src]="data.image"
       [appFallbackSrc]="data.fallbackImage"
       *ngIf="data.imageEnabled && data.image"
+      class="tw-max-h-6 tw-max-w-6 tw-rounded-md"
       alt=""
       decoding="async"
       loading="lazy"