ui

crates/lanspread-tauri-deno-ts/src/App.css

@@ -121,6 +121,25 @@ h1.align-center {
   justify-content: center;
 }
 
+.no-directory-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 40px 20px;
+  gap: 20px;
+}
+
+.no-directory-message {
+  color: #8892b0;
+  font-size: 18px;
+  text-align: center;
+}
+
+.no-directory-button {
+  margin-top: 10px;
+}
+
 .search-input {
   width: 100%;
   max-width: 400px;

crates/lanspread-tauri-deno-ts/src/App.tsx

@@ -282,8 +282,13 @@ const App = () => {
                         </div>
                     </div>
                     ) : (
-                        <div className="search-container">
+                        <div className="no-directory-container">
-                        Please set a game directory to start scanning for games...
+                            <div className="no-directory-message">
+                                Please set a game directory to start scanning for games...
+                            </div>
+                            <div className="no-directory-button">
+                                <button onClick={dialogGameDir} className="settings-button">Set Game Directory</button>
+                            </div>
                         </div>
                     )}
                 </div>