changed line breaks (bad practice) into css

maybe move inline css to App.css?
austinatose · Jan 28, 2023 · 865fbdf · 865fbdf
1 parent d6b2e92
commit 865fbdf
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 10 deletions.
diff --git a/package.json b/package.json
@@ -16,7 +16,7 @@
   },
   "scripts": {
     "start": "react-scripts --openssl-legacy-provider start",
-    "build": "react-scripts --openssl-legacy provider build",
+    "build": "react-scripts --openssl-legacy-provider build",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
   },

diff --git a/src/components/racetext.js b/src/components/racetext.js
@@ -15,6 +15,7 @@ const RaceText = () => {
     return (
         <>
             <h1 className="text"
+            style={{padding: '10px'}}
             onKeyDown = {e => {
             e.preventDefault();
             const key = e.key;

diff --git a/src/pages/settings.js b/src/pages/settings.js
@@ -12,22 +12,20 @@ const Settings = () => {
       <div>
         <h1>Settings</h1>
       </div>
-      <button style={{width: "150px"}} className='start-button' onClick={() => setSentence(randomWords({ min: 3, max: 10, exactly: 15, join: ' '}))}>15 Words</button>
-      <br/>
-      <button style={{width: "150px"}} className='start-button' onClick={() => setSentence(randomWords({ min: 3, max: 10, exactly: 30, join: ' '}))}>30 Words</button>
-      <br/>
-      <button style={{width: "150px"}} className='start-button' onClick={() => setSentence(randomWords({ min: 3, max: 10, exactly: 50, join: ' '}))}>50 Words</button>
-      <br/>
+      <button style={{width: "150px", margin: "10px"}} className='start-button' onClick={() => setSentence(randomWords({ min: 3, max: 10, exactly: 15, join: ' '}))}>15 Words</button>
+      <button style={{width: "150px", margin: "10px"}} className='start-button' onClick={() => setSentence(randomWords({ min: 3, max: 10, exactly: 30, join: ' '}))}>30 Words</button>
+      <button style={{width: "150px", margin: "10px"}} className='start-button' onClick={() => setSentence(randomWords({ min: 3, max: 10, exactly: 50, join: ' '}))}>50 Words</button>
       <form>
         <label>
-          Custom text: <br/>
+          Custom text:
           <input className='custom-input' type="text" value={tempsentence} onChange={(e) => settempsentence(e.target.value)} />
         </label>
       </form>
-      <br/>
-      <button style={{width: "190px"}} className='start-button' onClick={() => setSentence(tempsentence)}>Submit Custom Text</button>
+      <button style={{width: "190px", margin: "30px"}} className='start-button' onClick={() => setSentence(tempsentence)}>Submit Custom Text</button>
     </>
   );
 }
 
 export default Settings;
+
+//TODO: move inline css to App.css