test workflow file

src/components/MainApp.jsx

@@ -30,6 +30,7 @@ function MainApp() {
   const { rooms } = useHotel();
   const { conversations } = useHotel();
   const { users } = useHotel();
+  const { items } = useHotel();
 
   const [view, setView] = useState(VIEW.ROOMS)
 

src/components/login.css

@@ -0,0 +1,40 @@
+.loginBlock {
+
+    width: 320px;
+    padding: 2rem;
+    background: var(--card);
+    border-radius: 8px ;
+
+    display: flex;
+    flex-direction: column;
+    gap: 1.5rem;
+
+}
+
+.loginWrapper {
+    min-height: 100vh;
+    width: 100vw;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+}
+
+.loginBlock form {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+}
+
+.loginBlock input,
+.loginBlock button {
+    width: auto;
+    padding: 0.75rem ;
+    font-size: 1rem;
+}
+
+.loginBlock > div {
+    display: flex;
+    gap: 1rem;
+    justify-content: space-between;
+}

src/components/login.jsx

@@ -1,6 +1,8 @@
 import { API_BASE } from "../config";
 
 import { useState } from "react";
+import "./login.css";
+
 
 export default function Login({ onLogin }) {
   const [username, setUsername] = useState("");
@@ -116,25 +118,31 @@ export default function Login({ onLogin }) {
 
   return (
     <>
-      <form onSubmit={handleSubmit}>
-        <input
-          type="text"
-          placeholder="Username"
-          value={username}
-          onChange={(e) => setUsername(e.target.value)}
-        />
-        <input
-          type="password"
-          placeholder="Password"
-          value={password}
-          onChange={(e) => setPassword(e.target.value)}
-        />
-        <button type="submit">Login</button>
-        {error && <p style={{ color: "red" }}>{error}</p>}
-      </form>
-      <div>
-        <button onClick={LoginTest1} >login test 1</button>
-        <button onClick={LoginTest2} >login test 2</button>
+    <div className="loginWrapper">
+      <div className="loginBlock">
+        <form onSubmit={handleSubmit}>
+          <input
+            type="text"
+            placeholder="Username"
+            value={username}
+            onChange={(e) => setUsername(e.target.value)}
+          />
+          <input
+            type="password"
+            placeholder="Password"
+            value={password}
+            onChange={(e) => setPassword(e.target.value)}
+          />
+          <button type="submit">Login</button>
+          {error && <p style={{ color: "red" }}>{error}</p>}
+        </form>
+       
+    
+     <div>
+          <button onClick={LoginTest1} >login test 1</button>
+          <button onClick={LoginTest2} >login test 2</button>
+          </div>
+        </div>
         </div>
     </>