From a0aa0065b6fd53fbe150609e1add855ff1021133 Mon Sep 17 00:00:00 2001
From: Matthew Russell <mattrussell36@gmail.com>
Date: Mon, 12 Feb 2024 11:05:37 -0800
Subject: [PATCH] chore: align viewing as banner

---
 .../components/protocol-upgrade-in-progress-notification.tsx  | 3 +--
 .../components/notification-banner/notification-banner.tsx    | 4 +---
 libs/ui-toolkit/src/components/viewing-as-user/index.tsx      | 4 ++--
 3 files changed, 4 insertions(+), 7 deletions(-)

diff --git a/libs/proposals/src/components/protocol-upgrade-in-progress-notification.tsx b/libs/proposals/src/components/protocol-upgrade-in-progress-notification.tsx
index 7f0bf72e7..d7bc3a0c7 100644
--- a/libs/proposals/src/components/protocol-upgrade-in-progress-notification.tsx
+++ b/libs/proposals/src/components/protocol-upgrade-in-progress-notification.tsx
@@ -4,7 +4,6 @@ import {
   ExternalLink,
   Intent,
   NotificationBanner,
-  SHORT,
 } from '@vegaprotocol/ui-toolkit';
 import type { StoredNextProtocolUpgradeData } from '../lib';
 import {
@@ -70,7 +69,7 @@ export const ProtocolUpgradeInProgressNotification = () => {
   if (!upgradeInProgress) return null;
 
   return (
-    <NotificationBanner intent={Intent.Danger} className={SHORT}>
+    <NotificationBanner intent={Intent.Danger}>
       <div className="uppercase">
         {t('The network is being upgraded to {{vegaReleaseTag}}', {
           vegaReleaseTag,
diff --git a/libs/ui-toolkit/src/components/notification-banner/notification-banner.tsx b/libs/ui-toolkit/src/components/notification-banner/notification-banner.tsx
index e20299184..6b8bbdbf8 100644
--- a/libs/ui-toolkit/src/components/notification-banner/notification-banner.tsx
+++ b/libs/ui-toolkit/src/components/notification-banner/notification-banner.tsx
@@ -4,8 +4,6 @@ import { Intent } from '../../utils/intent';
 import { Icon, VegaIcon, VegaIconNames } from '../icon';
 import type { HTMLAttributes } from 'react';
 
-export const SHORT = '!px-1 !py-1 min-h-fit';
-
 interface NotificationBannerProps {
   intent?: Intent;
   children?: React.ReactNode;
@@ -23,7 +21,7 @@ export const NotificationBanner = ({
   return (
     <div
       className={classNames(
-        'flex items-center border-b px-2',
+        'flex items-center border-b pl-3 pr-2',
         'text-xs leading-tight font-normal',
         {
           'bg-vega-light-100 dark:bg-vega-dark-100 ': intent === Intent.None,
diff --git a/libs/ui-toolkit/src/components/viewing-as-user/index.tsx b/libs/ui-toolkit/src/components/viewing-as-user/index.tsx
index 7713f4ce0..7eaddf37e 100644
--- a/libs/ui-toolkit/src/components/viewing-as-user/index.tsx
+++ b/libs/ui-toolkit/src/components/viewing-as-user/index.tsx
@@ -1,4 +1,4 @@
-import { NotificationBanner, SHORT } from '../notification-banner';
+import { NotificationBanner } from '../notification-banner';
 import { Intent } from '../../utils/intent';
 import { TradingButton } from '../trading-button';
 import { useT } from '../../use-t';
@@ -23,7 +23,7 @@ export const ViewingAsBanner = ({
 }: ViewingAsBannerProps) => {
   const t = useT();
   return (
-    <NotificationBanner intent={Intent.None} className={SHORT}>
+    <NotificationBanner>
       <div className="flex items-baseline justify-between">
         <span data-testid="view-banner">
           {t('Viewing as Vega user: {{pubKey}}', {