fix: button styles & simplyfy copy

zettca · Aug 28, 2023 · 4be80b1 · 4be80b1
1 parent dc5ff44
commit 4be80b1
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 10 deletions.
diff --git a/src/App.module.css b/src/App.module.css
@@ -10,8 +10,7 @@
 
 .main {
   display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
+  flex-flow: row wrap;
   align-items: center;
   align-content: center;
   justify-content: center;
@@ -24,14 +23,16 @@
   display: flex;
   flex-direction: column;
   align-self: flex-start;
+  gap: 0.6rem;
 }
 
 .case button {
   color: inherit;
   font: inherit;
   border: none;
   user-select: text;
-  outline: 1px solid currentColor;
+  outline-width: 1px;
+  outline-style: auto;
   padding: 2px;
   background-color: transparent;
 }

diff --git a/src/App.tsx b/src/App.tsx
@@ -22,13 +22,8 @@ const Case = (props: { label: string; value: string }) => {
 
   return (
     <div class={styles.case}>
-      <h3>{props.label}</h3>
-      <button
-        onClick={handleCopy}
-        onKeyDown={(event) => {
-          if (event.key === "Enter") handleCopy();
-        }}
-      >
+      <strong>{props.label}</strong>
+      <button onClick={handleCopy}>
         <code>{props.value}</code>
       </button>
     </div>