ui: align button and request result with action name (#66)

MetaMask · Sep 14, 2023 · 4eb80c3 · 4eb80c3
1 parent 09087a8
commit 4eb80c3
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 4 deletions.
diff --git a/packages/site/src/components/Buttons.tsx b/packages/site/src/components/Buttons.tsx
@@ -74,8 +74,9 @@ const ActionButton = styled.button`
   width: 95%;
   background-color: #0376c9;
   border-radius: 999px;
+  border: none;
   padding: 5px 20px;
-  margin: 8px 2.5% 8px 16px;
+  margin: 8px 2.5% 8px 8px;
 
   &:hover {
     background-color: #0376ff;

diff --git a/packages/site/src/components/Method.tsx b/packages/site/src/components/Method.tsx
@@ -20,7 +20,7 @@ const InputTitle = styled.p`
 `;
 
 const StyledSelect = styled.select`
-  width: 95%;
+  width: calc(95% - 16px);
   padding-top: 8px;
   padding-bottom: 10px;
   margin: 8px 2.5% 8px 16px;
@@ -36,7 +36,7 @@ const StyledSelectItem = styled.option`
 `;
 
 const TextField = styled.input`
-  width: 95%;
+  width: calc(95% - 16px);
   padding: 10px;
   margin: 8px 2.5% 8px 16px;
   background: transparent;
@@ -47,7 +47,7 @@ const TextField = styled.input`
 
 const CopyableContainer = styled.div`
   width: 95%;
-  margin: 0px 2.5% 8px 16px;
+  margin: 0px 2.5% 8px 8px;
 `;
 
 export type MethodProps = {