Merge pull request #30 from hytech-racing/sizing-fix

Sizing fix
hytech-racing · Oct 9, 2024 · 30b5d33 · 30b5d33
2 parents cb408ab + 86781ed
commit 30b5d33
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 12 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -25,11 +25,11 @@ export default function App() {
               <DataTable data={filteredData} />
             </div>
 
-            <div className="preview-contain-result">
-              <PreviewCard />
-            </div>
+            <SearchBar setFilteredData={setFilteredData} />
+          </div>
+          <div className="preview-contain-result">
+            <PreviewCard />
           </div>
-          <SearchBar setFilteredData={setFilteredData} />
         </div>
       </div>
 

diff --git a/src/css/App.css b/src/css/App.css
@@ -22,11 +22,17 @@
     flex: 1;
     height: 500px;
     padding-top: 50px;
+    flex-direction: column;
+}
+
+.results-container {
+    display: flex;
+    flex-direction: row;
 }
 
 .footer {
-    padding: 2em;
     text-align: center;
     background: #9b8b5de5;
     color: white;
-}
+}
+
diff --git a/src/css/SearchBar.css b/src/css/SearchBar.css
@@ -16,8 +16,12 @@
 
 .Search {
   display: flex;
+  max-width: 360px;
+  font-size: 15px;
+
 }
 
+
 .search-filter-container {
   background-color: #f8f9fa;
   padding: 20px;
@@ -29,7 +33,7 @@
 }
 
 .search-filter-container h1 {
-  font-size: 1.8em;
+  font-size: 25px;
   text-align: center;
   color: #333;
   margin-bottom: 20px;
@@ -40,7 +44,6 @@
   padding: 12px;
   border-radius: 30px;
   border: 1px solid #ddd;
-  font-size: 1em;
   outline: none;
   transition: box-shadow 0.2s ease-in-out;
 }
@@ -60,16 +63,13 @@
 .filter-options label {
   display: flex;
   flex-direction: column;
-  font-size: 1em;
   color: #555;
   margin-bottom: 10px;
   flex: 1 1 48%;
 }
 
 .filter-select {
-  margin-top: 8px;
   padding: 10px;
-  font-size: 1em;
   border-radius: 10px;
   border: 1px solid #ddd;
   background-color: #fff;
@@ -82,7 +82,6 @@
 }
 
 .date-picker {
-  margin-top: 8px;
   padding: 10px;
   font-size: 1em;
   border-radius: 10px;