diff --git a/frontend/code/src/components/Home/LeaderBoard.tsx b/frontend/code/src/components/Home/LeaderBoard.tsx index 1f558d3..a9e6348 100644 --- a/frontend/code/src/components/Home/LeaderBoard.tsx +++ b/frontend/code/src/components/Home/LeaderBoard.tsx @@ -2,8 +2,8 @@ import { Chart } from './assets/Chart' import { Table } from './assets/Table' export const LeaderBoard = () => { return ( -
-
+
+
Leader Board
diff --git a/frontend/code/src/components/Home/assets/Daimond.tsx b/frontend/code/src/components/Home/assets/Daimond.tsx new file mode 100644 index 0000000..df87ded --- /dev/null +++ b/frontend/code/src/components/Home/assets/Daimond.tsx @@ -0,0 +1,8 @@ +export const Daimond = () => { + return ( + + + + + ) +} diff --git a/frontend/code/src/components/Home/assets/Data.Json b/frontend/code/src/components/Home/assets/Data.Json deleted file mode 100644 index e69de29..0000000 diff --git a/frontend/code/src/components/Home/assets/Table.tsx b/frontend/code/src/components/Home/assets/Table.tsx index 3d51338..daf9753 100644 --- a/frontend/code/src/components/Home/assets/Table.tsx +++ b/frontend/code/src/components/Home/assets/Table.tsx @@ -1,6 +1,6 @@ import { Trophy } from './Trophy' import { useState,useEffect } from 'react' - +import { Daimond } from './Daimond' @@ -9,25 +9,21 @@ export const Table = () => { const [users, setUsers] = useState([]) useEffect( () => { - - const fetchdata = async() =>{ - for (let i = 0 ; i < 10 ; i++) - { - let response = await fetch(`https://randomuser.me/api/`) - let data = await response.json() - if (data.results && data.results.length > 0) { - const newUser = data.results[0]; - setUsers((oldUsers : any) => [...oldUsers, newUser]); - console.log(newUser) - } - } - } - - fetchdata().catch(console.error) - + const fetchdata = async() =>{ + + let response = await fetch(`https://randomuser.me/api/`) + let data = await response.json() + if (data.results && data.results.length > 0) { + const newUser = data.results[0]; + setUsers((oldUsers : any) => [...oldUsers, newUser]); + console.log(newUser) + } + + } + fetchdata().catch(console.error) },[]) return ( -
+
@@ -36,28 +32,28 @@ export const Table = () => - + {users.map((x: any, index: number) => ( - + ))} diff --git a/frontend/code/src/components/Home/index.tsx b/frontend/code/src/components/Home/index.tsx index df0d1d1..4d3f81e 100644 --- a/frontend/code/src/components/Home/index.tsx +++ b/frontend/code/src/components/Home/index.tsx @@ -6,12 +6,12 @@ import { LeaderBoard } from './LeaderBoard' export const Home : FC = () : JSX.Element =>{ return ( -
+
- bg hero + bg hero
-
+
diff --git a/frontend/code/src/components/Layout/Assets/Message.tsx b/frontend/code/src/components/Layout/Assets/Message.tsx index dac2a77..5faa87e 100644 --- a/frontend/code/src/components/Layout/Assets/Message.tsx +++ b/frontend/code/src/components/Layout/Assets/Message.tsx @@ -3,8 +3,8 @@ export const Message = () => {
- - + +
) diff --git a/frontend/code/src/components/Layout/Assets/Out.tsx b/frontend/code/src/components/Layout/Assets/Out.tsx index 8be25e0..28789d4 100644 --- a/frontend/code/src/components/Layout/Assets/Out.tsx +++ b/frontend/code/src/components/Layout/Assets/Out.tsx @@ -3,7 +3,7 @@ export const Out = () => { return (
- +
diff --git a/frontend/code/src/components/Layout/index.tsx b/frontend/code/src/components/Layout/index.tsx index 717678e..eb8b3d4 100644 --- a/frontend/code/src/components/Layout/index.tsx +++ b/frontend/code/src/components/Layout/index.tsx @@ -21,7 +21,7 @@ export const Layout : FC = (Content) : JSX.Element =>
-
+
@@ -62,7 +62,7 @@ tart ">
-
+
{Content.children}
diff --git a/frontend/code/src/index.css b/frontend/code/src/index.css index 8d3f436..e14c019 100644 --- a/frontend/code/src/index.css +++ b/frontend/code/src/index.css @@ -1,6 +1,20 @@ @tailwind base; @tailwind components; @tailwind utilities; +@layer utilities { + @variants responsive { + /* Hide scrollbar for Chrome, Safari and Opera */ + .no-scrollbar::-webkit-scrollbar { + display: none; + } + + /* Hide scrollbar for IE, Edge and Firefox */ + .no-scrollbar { + -ms-overflow-style: none; /* IE and Edge */ + scrollbar-width: none; /* Firefox */ + } + } + } @import url('https://fonts.googleapis.com/css2?family=Lexend+Peta:wght@400;700&display=swap'); @import url("https://fonts.googleapis.com/css2?family=Poppins&display=swap"); @import url('https://fonts.googleapis.com/css2?family=Lexend+Peta:wght@400;700&family=Montserrat:wght@700&display=swap'); diff --git a/frontend/code/src/index.tsx b/frontend/code/src/index.tsx index 1d3d132..ecf1f53 100644 --- a/frontend/code/src/index.tsx +++ b/frontend/code/src/index.tsx @@ -13,7 +13,6 @@ const root = ReactDOM.createRoot( document.getElementById('root') as HTMLElement ); root.render( - }> @@ -25,7 +24,6 @@ root.render( - ); // If you want to start measuring performance in your app, pass a function diff --git a/frontend/code/tailwind.config.js b/frontend/code/tailwind.config.js index ba08f8d..694da59 100644 --- a/frontend/code/tailwind.config.js +++ b/frontend/code/tailwind.config.js @@ -35,7 +35,7 @@ module.exports = { "secondary": "#6A4CFC", - "accent": "#aedd1f", + "accent": "#1A1C26", "neutral": "#161922",
Score
- + {index}
-
-
- Avatar Tailwind CSS Component -
+
+
+ Avatar Tailwind CSS Component
-
{x.name.first}
+ +
{x.name.first}
24 14