Fix close button

src/ui/IframeDialog.tsx

@@ -84,7 +84,7 @@ export const IframeDialog = forwardRef<HTMLIFrameElement, IframeModalProps>(
     if (!isModal) {
       return isDialogOpen ? (
         <div id="nfw-connect-iframe-container" className="nfw-iframe-container">
-          <X onClick={handleDialogClose} />
+          <X onClick={handleDialogClose} className="nfw-close-button" />
           {iframeElement}
         </div>
       ) : null;

src/ui/styles.css

@@ -116,3 +116,10 @@
   height: 100%;
   border: none;
 }
+
+.nfw-close-button {
+  position: absolute;
+  top: 10px;
+  right: 10px;
+  cursor: pointer;
+}

src/ui/styles.output.css

@@ -645,23 +645,10 @@ body {
   z-index: 50;
 }
 
-.z-10 {
-  z-index: 10;
-}
-
-.mx-auto {
-  margin-left: auto;
-  margin-right: auto;
-}
-
 .mt-24 {
   margin-top: 6rem;
 }
 
-.mt-4 {
-  margin-top: 1rem;
-}
-
 .flex {
   display: flex;
 }
@@ -674,10 +661,6 @@ body {
   display: none;
 }
 
-.h-2 {
-  height: 0.5rem;
-}
-
 .h-4 {
   height: 1rem;
 }
@@ -686,38 +669,10 @@ body {
   height: auto;
 }
 
-.h-full {
-  height: 100%;
-}
-
-.h-\[200px\] {
-  height: 200px;
-}
-
-.h-\[500px\] {
-  height: 500px;
-}
-
-.h-\[60\%\] {
-  height: 60%;
-}
-
-.h-\[70\%\] {
-  height: 70%;
-}
-
-.max-h-\[700px\] {
-  max-height: 700px;
-}
-
 .w-4 {
   width: 1rem;
 }
 
-.w-\[100px\] {
-  width: 100px;
-}
-
 .w-\[375px\] {
   width: 375px;
 }
@@ -752,10 +707,6 @@ body {
   overflow: hidden;
 }
 
-.rounded-full {
-  border-radius: 9999px;
-}
-
 .rounded-sm {
   border-radius: calc(var(--radius) - 4px);
 }
@@ -777,14 +728,6 @@ body {
   background-color: rgb(0 0 0 / 0.8);
 }
 
-.bg-muted {
-  background-color: hsl(var(--muted));
-}
-
-.p-0 {
-  padding: 0px;
-}
-
 .opacity-70 {
   opacity: 0.7;
 }
@@ -845,6 +788,13 @@ body {
   border: none;
 }
 
+.nfw-close-button {
+  position: absolute;
+  top: 10px;
+  right: 10px;
+  cursor: pointer;
+}
+
 .hover\:opacity-100:hover {
   opacity: 1;
 }
@@ -936,4 +886,4 @@ body {
   .sm\:rounded-lg {
     border-radius: var(--radius);
   }
-}
+}