fix: add ellipsis for overflowing rpc labels (#87)

paradigmxyz · Dec 9, 2023 · 38a57f5 · 38a57f5
1 parent 4639514
commit 38a57f5
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 1 deletion.
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
@@ -293,7 +293,7 @@ function RpcUrl() {
           borderRadius="round"
           style={{ minWidth: 8, minHeight: 8 }}
         />
-        <Text size="12px" wrap={false} width="full">
+        <Text size="12px" wrap={false} width="full" style={{overflow: "hidden", textOverflow: "ellipsis"}}>
           {network.rpcUrl.replace(/https?:\/\//, '')}
         </Text>
       </Inline>

diff --git a/src/screens/networks.tsx b/src/screens/networks.tsx
@@ -166,6 +166,7 @@ function NetworkRow({
                   color={data ? 'text' : 'text/tertiary'}
                   size="12px"
                   wrap={false}
+                  style={{overflow: "hidden", textOverflow: "ellipsis"}}
                 >
                   {network.rpcUrl.replace(/https?:\/\//, '')}
                 </Text>