style:fixed layout & bg issue

TahaHameed23 · Nov 12, 2023 · 061d63e · 061d63e
1 parent 189600e
commit 061d63e
Show file tree

Hide file tree

Showing 12 changed files with 12 additions and 11 deletions.
diff --git a/README.md b/README.md
@@ -13,4 +13,4 @@ Features:
 7. View other's profile. 
 8. Logout 
 
-Made using React + Vite.
+Made using React + TailwindCSS/SCSS.
diff --git a/index.html b/index.html
@@ -6,9 +6,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>DevDeck</title>
   </head>
-  <body>
-    <!-- style="background: url('./src/assets/dddepth-230.jpg') no-repeat;
-  background-size: cover;" -->
+  <body class="bg-slate-900 m-0 p-0">
     <div id="root" ></div>
     <script type="module" src="/src/main.jsx"></script>
   </body>

diff --git a/src/assets/dddepth-152.jpg b/src/assets/dddepth-152.jpg
diff --git a/src/assets/dddepth-230.jpg b/src/assets/dddepth-230.jpg
diff --git a/src/assets/dddepth-346.jpg b/src/assets/dddepth-346.jpg
diff --git a/src/assets/home-bg.webp b/src/assets/home-bg.webp
diff --git a/src/assets/login-bg.webp b/src/assets/login-bg.webp
diff --git a/src/assets/register-bg.webp b/src/assets/register-bg.webp
diff --git a/src/components/HomeComponent.jsx b/src/components/HomeComponent.jsx
@@ -1,7 +1,10 @@
 import React from 'react';
 import NewPost from './common/NewPost'
+import background from "../assets/home-bg.webp"
 export default function HomeComponent( {currentUser}) {
   return (
-    <div><NewPost currentUser={currentUser}></NewPost></div>
+    <div style={{background:`url(${background})`,backgroundRepeat: "no-repeat", backgroundSize: "cover"}}>
+      <NewPost currentUser={currentUser}></NewPost>
+    </div>
   )
 }
diff --git a/src/components/Logincompo.jsx b/src/components/Logincompo.jsx
@@ -6,7 +6,7 @@ import GoogleButton from 'react-google-button'
 import { LoadingButton } from '@mui/lab'
 import '../styles/Login.scss'
 import logo from '../assets/logo.png'
-import background from '../assets/dddepth-346.jpg'
+import background from '../assets/login-bg.webp'
 export default function Logincompo() {
   let navigate = useNavigate();
   const [credentails, setCredentials ]= useState({});
@@ -30,7 +30,7 @@ export default function Logincompo() {
   };
   const googleSignIn = () => {
     let response = GoogleSignInAPI();
-    console.log(response);
+    // console.log(response);
   }
 
   return (

diff --git a/src/components/RegisterComponent.jsx b/src/components/RegisterComponent.jsx
@@ -8,7 +8,7 @@ import { LoadingButton } from '@mui/lab';
 import { getUID } from '../helpers/getUniqueID'
 import '../styles/Login.scss'
 import logo from '../assets/logo.png'
-import background from '../assets/dddepth-152.jpg'
+import background from '../assets/register-bg.webp'
 export default function RegisterComponent() {
   let navigate = useNavigate();
   const [credentials, setCredentials ]= useState({});
@@ -43,10 +43,10 @@ export default function RegisterComponent() {
   }
   //mtahakhan2003 @gmail.com
   return (
-    <div style={{background:`url(${background})`,backgroundRepeat: "no-repeat", backgroundSize: "cover"}} className="login-wrapper bg-no-repeat bg-cover">
+    <div style={{background:`url(${background})`,backgroundRepeat: "no-repeat", backgroundSize: "cover"}} className="login-wrapper">
       <div className="header flex justify-center items-center gap-4">
       <img src={logo} className="w-10 h-8"  />
-      <span className='text-white font-bold text-3xl'>DevDeck</span>
+      <span className='brand mt-1'>DevDeck</span>
       </div>
       <div className="login-wrapper-inner">
         <h1 className="heading">Sign In</h1>

diff --git a/src/styles/Login.scss b/src/styles/Login.scss
@@ -49,7 +49,7 @@ body {
   }
 
   .sub-heading {
-    color: white;
+    color: rgb(255, 255, 255);
     font-weight: 800;
 
     margin: 1em;