fix some styles issues b00tc4mp#178

Debi312 · Aug 29, 2024 · ee5952e · ee5952e
1 parent 2d54f73
commit ee5952e
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 9 deletions.
diff --git a/staff/debora-garcia/project/app/src/global.css b/staff/debora-garcia/project/app/src/global.css
@@ -43,20 +43,35 @@
 
 @layer components {
   .registerForm {
-    @apply flex flex-col items-center;
+    @apply flex flex-col items-center gap-2;
   }
   .loginForm {
-    @apply flex flex-col items-center;
+    @apply flex flex-col items-center gap-2;
   }
 
   .account-prompt {
-    @apply w-[300px] flex justify-end items-center gap-3 
+    @apply w-[300px] flex justify-end items-center gap-3;
   }
   .account-prompt p {
-    @apply text-[#7b7a7a63] 
+    @apply text-[#2d2a2a63];
   }
- 
+
   .sign-up-link {
     @apply font-bold;
   }
+
+  .app-title {
+    @apply text-[--third-color] font-semibold;
+  }
+
+  .registerForm .link-button {
+    @apply bg-[white] w-[100px] border-[--third-color] text-[--third-color] text-center border rounded-md px-4 py-2 transition-colors duration-300 ease-in-out;
+  }
+
+  .registerForm Button {
+    @apply  bg-[--third-color] text-white rounded-md px-4 py-2 transition-colors duration-300 ease-in-out;
+  }
+  .loginForm Button {
+    @apply  bg-[--third-color] text-white rounded-md px-4 py-2 transition-colors duration-300 ease-in-out;
+  }
 }
diff --git a/staff/debora-garcia/project/app/src/views/Feed/Post.jsx b/staff/debora-garcia/project/app/src/views/Feed/Post.jsx
@@ -51,7 +51,7 @@ export default function Post({ post, onPostLikeToggled }) {
                 <time>{getTimeDifference(post.date)}</time>
                 </div>
             <div className="post-body">
-                <img src={post.image} alt={post.description} className="post-image" />
+                <img src={post?.image} className="post-image" />
                 <p>{post.description}</p>
                 <div className="post-footer-buttons">
                     <Button onClick={() => handleToggleLikePost(post)} className="like-button">

diff --git a/staff/debora-garcia/project/app/src/views/Login.jsx b/staff/debora-garcia/project/app/src/views/Login.jsx
@@ -42,6 +42,7 @@ export default function Login() {
 
     return <>
         <form className="loginForm" onSubmit={handleLoginSubmit} >
+            <h1 className="app-title">LEVEL UP</h1>
             <h4>WELLCOME BACK!</h4>
             <p>Be part of our team</p>
 

diff --git a/staff/debora-garcia/project/app/src/views/Register.css b/staff/debora-garcia/project/app/src/views/Register.css
@@ -0,0 +1 @@
+
diff --git a/staff/debora-garcia/project/app/src/views/Register.jsx b/staff/debora-garcia/project/app/src/views/Register.jsx
@@ -3,7 +3,7 @@ import { SystemError } from 'com/errors'
 
 import logic from "../logic"
 import useContext from '../useContext'
-
+import "./Register.css"
 import Button from "../components/Button"
 import Field from "../components/Field"
 import Heading from "../components/Heading"
@@ -60,8 +60,7 @@ export default function Register() {
             <Field id="password" type="password" placeholder="Password"></Field>
             <Field id="passwordRepeat" type="password" placeholder="Confirm Password"></Field>
             <Button type="submit">Sign up</Button>
-            <Link onClick={handleLoginClick}>Login</Link>
-
+            <Link onClick={handleLoginClick} className="link-button">Login</Link>
         </form>
     )
 }