From 665bfee8e0df4d770aa185654fec85b16c2d53f9 Mon Sep 17 00:00:00 2001
From: lendihop <mishin.danil2017@gmail.com>
Date: Thu, 28 Nov 2024 23:11:03 +0100
Subject: [PATCH] fix some minor bugs

---
 src/app/atoms/FormField.tsx          |  2 +-
 src/app/layouts/PageLayout/index.tsx | 14 ++++++++++----
 src/app/pages/Unlock/Unlock.tsx      |  7 ++++++-
 3 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/src/app/atoms/FormField.tsx b/src/app/atoms/FormField.tsx
index aa435c437..f1f445aa4 100644
--- a/src/app/atoms/FormField.tsx
+++ b/src/app/atoms/FormField.tsx
@@ -390,7 +390,7 @@ const ErrorCaption: React.FC<ErrorCaptionProps> = ({ errorCaption }) => {
   const isPasswordStrengthIndicator = errorCaption === PASSWORD_ERROR_CAPTION;
 
   return errorCaption && !isPasswordStrengthIndicator ? (
-    <div className="pl-1 text-xs text-red-500" {...setTestID(ErrorCaptionSelectors.inputError)}>
+    <div className="pl-1 text-font-description text-error" {...setTestID(ErrorCaptionSelectors.inputError)}>
       {errorCaption}
     </div>
   ) : null;
diff --git a/src/app/layouts/PageLayout/index.tsx b/src/app/layouts/PageLayout/index.tsx
index 506ab4abb..1229f3d81 100644
--- a/src/app/layouts/PageLayout/index.tsx
+++ b/src/app/layouts/PageLayout/index.tsx
@@ -46,6 +46,7 @@ export interface PageLayoutProps extends DefaultHeaderProps, ScrollEdgesVisibili
   Header?: ComponentType;
   noScroll?: boolean;
   contentPadding?: boolean;
+  showTestnetModeIndicator?: boolean;
   contentClassName?: string;
   paperClassName?: string;
   headerChildren?: ReactNode;
@@ -56,6 +57,7 @@ const PageLayout: FC<PropsWithChildren<PageLayoutProps>> = ({
   children,
   noScroll = false,
   contentPadding = true,
+  showTestnetModeIndicator = true,
   contentClassName,
   paperClassName,
   headerChildren,
@@ -86,6 +88,7 @@ const PageLayout: FC<PropsWithChildren<PageLayoutProps>> = ({
           bottomEdgeThreshold={bottomEdgeThreshold}
           onTopEdgeVisibilityChange={onTopEdgeVisibilityChange}
           topEdgeThreshold={topEdgeThreshold}
+          showTestnetModeIndicator={showTestnetModeIndicator}
         >
           {Header ? <Header /> : <DefaultHeader {...headerProps}>{headerChildren}</DefaultHeader>}
 
@@ -125,7 +128,9 @@ const PageLayout: FC<PropsWithChildren<PageLayoutProps>> = ({
 
 export default PageLayout;
 
-type ContentPaperProps = PropsWithChildren<{ className?: string } & ScrollEdgesVisibilityProps>;
+type ContentPaperProps = PropsWithChildren<
+  { showTestnetModeIndicator?: boolean; className?: string } & ScrollEdgesVisibilityProps
+>;
 
 const ContentPaper: FC<ContentPaperProps> = ({
   children,
@@ -133,7 +138,8 @@ const ContentPaper: FC<ContentPaperProps> = ({
   bottomEdgeThreshold,
   topEdgeThreshold,
   onBottomEdgeVisibilityChange,
-  onTopEdgeVisibilityChange
+  onTopEdgeVisibilityChange,
+  showTestnetModeIndicator = true
 }) => {
   const appEnv = useAppEnv();
   const rootRef = useRef<HTMLDivElement>(null);
@@ -159,7 +165,7 @@ const ContentPaper: FC<ContentPaperProps> = ({
           className
         )}
       >
-        <TestnetModeIndicator />
+        {showTestnetModeIndicator && <TestnetModeIndicator />}
 
         {children}
 
@@ -177,7 +183,7 @@ const TestnetModeIndicator = memo(() => {
   return (
     <div
       className={clsx(
-        'flex justify-center items-center sticky z-sticky top-0 bg-success',
+        'flex justify-center items-center sticky z-sticky top-0 bg-success overflow-hidden',
         'transition-all ease-in-out duration-300',
         enabled ? 'min-h-6 h-6' : 'min-h-0 h-0'
       )}
diff --git a/src/app/pages/Unlock/Unlock.tsx b/src/app/pages/Unlock/Unlock.tsx
index 15df55c3f..070fa8dfc 100644
--- a/src/app/pages/Unlock/Unlock.tsx
+++ b/src/app/pages/Unlock/Unlock.tsx
@@ -150,7 +150,12 @@ const Unlock: FC<UnlockProps> = ({ canImportNew = true }) => {
   }, [timelock, lockLevel, setTimeLock]);
 
   return (
-    <PageLayout Header={EmptyHeader} contentPadding={false} contentClassName="relative">
+    <PageLayout
+      Header={EmptyHeader}
+      contentPadding={false}
+      contentClassName="relative"
+      showTestnetModeIndicator={false}
+    >
       <PlanetsAnimation bottomGap={bottomGap} />
       <div className="w-full min-h-full p-4 flex flex-col z-1">
         <div className="w-full aspect-[2]" />