diff --git a/Frontend/index.html b/Frontend/index.html index a867caf..2173674 100644 --- a/Frontend/index.html +++ b/Frontend/index.html @@ -4,7 +4,7 @@ - Saket + Assmeble
diff --git a/Frontend/package.json b/Frontend/package.json index ce265b5..e334ac9 100644 --- a/Frontend/package.json +++ b/Frontend/package.json @@ -24,6 +24,6 @@ "eslint-plugin-react-refresh": "^0.4.7", "postcss": "^8.4.39", "tailwindcss": "^3.4.4", - "vite": "^5.3.2" + "vite": "^5.3.3" } } diff --git a/Frontend/src/App.jsx b/Frontend/src/App.jsx index c816918..6bcee72 100644 --- a/Frontend/src/App.jsx +++ b/Frontend/src/App.jsx @@ -1,13 +1,18 @@ import React from 'react' import Body from './components/Body' -import Header from './components/Header' +// import Header from './components/Header' + + const App = () => { return ( -
-
- -
+ ) } -export default App \ No newline at end of file +export default App + + + + + + \ No newline at end of file diff --git a/Frontend/src/components/Body.jsx b/Frontend/src/components/Body.jsx index f507c10..1f0f9c5 100644 --- a/Frontend/src/components/Body.jsx +++ b/Frontend/src/components/Body.jsx @@ -1,22 +1,60 @@ import React from 'react' - -const body = () => { +import { SiValorant } from "react-icons/si"; +import { SiPubg } from "react-icons/si"; +import Header from './Header'; +const Body = () => { return (
-
-
- background -
-
-
- -
+
+
+
+ + + +
+
) } -export default body \ No newline at end of file +export default Body diff --git a/Frontend/src/components/Header.jsx b/Frontend/src/components/Header.jsx index b1262cc..684388e 100644 --- a/Frontend/src/components/Header.jsx +++ b/Frontend/src/components/Header.jsx @@ -1,9 +1,9 @@ import React from 'react' const Header = () => { - return ( -
-
+ return ( +
+
@@ -21,8 +21,8 @@ const Header = () => {
-
- ) +
+ ) } -export default Header \ No newline at end of file +export default Header diff --git a/Frontend/src/index.css b/Frontend/src/index.css index 2634c6e..5902f21 100644 --- a/Frontend/src/index.css +++ b/Frontend/src/index.css @@ -2,16 +2,91 @@ @tailwind components; @tailwind utilities; *{ - - margin: 0%; - padding: 0%; - box-sizing: border-box; - font-family: SF PRO DISPLAY;} - html, - body { - height: 100%; - width: 100%; + margin : 0; + padding : 0; + font-family :'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; } + +.body{ + background-image: url("https://cdn.discordapp.com/attachments/1241785032725631079/1257564641433878568/vite.png?ex=6684ddd6&is=66838c56&hm=06cdcfad5d2e4f69e071e0856571babec173b898564b3d73533184c869400a65&"); + background-size: 100% 100%; + background-repeat: no-repeat; +} +.page{ + height : 100vh; + width: 100vw; + margin-bottom: 0px; +} +img{ + width : 100%; + height : 100%; +} + /* sign in box */ + +.sign-in-box{ + background-color: white; + height : 60vh; + width : 23vw; + border-radius : 20px; + padding : 20px; + position : absolute; + top : 20%; + left : 65%; + opacity : 90%; +} +.sign-in-box-heading{ + text-align: center; + margin-bottom : 10px; +} +.input-text{ + width : 90%; + margin: 15px 12px; + height : 35px; + border-radius : 10px; + text-align: center; + font-weight: bold; + border : none; + color : rgb(0, 0, 0); + background-color : rgb(234, 231, 231) +} +#checkbox{ + margin : 15px 15px; + transform :scale(1.5); + border : 6px solid rgb(143, 73, 26); +} +.sign-in-button{ + width : 90%; + margin : 15px 12px; + height : 35px; + background-color: rgb(143, 73, 26); + color : white; + border-radius : 20px; + border : none; +} +.sign-in-div{ + display: flex; + justify-content : space-between; + margin: 15px 15px; + font-weight : bold; +} +.line{ + border-bottom: 1px solid rgb(143, 73, 26); + margin : 4px 15px; +} +.end-text{ + text-align: center; + font-size : 12px; + margin : 15px; +} + + /* footer */ .footer-list{ + color : white; display : flex; + gap : 100px; + padding : 10px; + position: absolute; + bottom: 7%; + list-style-type: none; + padding : 0 20px; } \ No newline at end of file