Style Enter button

Nonhuman-Nonsense · Mar 21, 2024 · 328ca69 · 328ca69
1 parent dfed07f
commit 328ca69
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 19 deletions.
diff --git a/client/src/App.css b/client/src/App.css
@@ -86,22 +86,16 @@ h4 {
   display: flex;
 }
 
-.food-button {
-  margin-left: 5px;
-  margin-right: 5px;
-  background-color: black;
-  width: 75px;
-  height: 75px;
-  border-radius: 50%;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
-.food-button img {
-  width: 80%;
-  height: 80%;
-  object-fit: cover;
+.outline-button {
+  font-family: "Tinos", serif;
+  font-style: normal;
+  font-size: 34px;
+  font-weight: normal;
+  color: white;
+  background-color: transparent;
+  border: 2px solid white;
+  border-radius: 25px;
+  padding: 0px 22px 0px 22px;
   cursor: pointer;
 }
 

diff --git a/client/src/components/Setup.jsx b/client/src/components/Setup.jsx
@@ -26,11 +26,11 @@ function Setup() {
   return (
     <div style={welcomeStyle}>
       <div>
-        <h4 className="sub-sub-sub-header">
+        <h4>
           Welcome to the Council of Foods - an assembly of diverse
           <br /> foods, addressing the broken food system through debate.
         </h4>
-        <h4 className="sub-sub-sub-header">
+        <h4>
           To begin a meeting, decide on a topic & pick which foods will be{" "}
           <br /> participating!
         </h4>
@@ -54,7 +54,7 @@ function Setup() {
           ))}
         </div>
       </div>
-      <button>Enter</button>
+      <button className="outline-button">Enter</button>
     </div>
   );
 }