-
-
SAMPARK
-
- We connect slum and orphange kids with local colleges and NGOs to end
- poverty.
-
-
Donate
+
+
+
SAMPARK
+
+ We connect slum and orphange kids with local colleges and NGOs to
+ end poverty.
+
+
Donate
+
-
>
);
}
diff --git a/src/components/HeroSection/styles.css b/src/components/HeroSection/styles.css
index b5d6880..69b7c79 100644
--- a/src/components/HeroSection/styles.css
+++ b/src/components/HeroSection/styles.css
@@ -1,14 +1,13 @@
-.navbar{
+.navbar {
margin-bottom: 5rem;
}
-
-
.hero-section {
width: 99vw;
height: 100vh;
/* background-color: black; */
background-image: url('../../assets/Images/homeImg.jpg');
+ /* clip-path: polygon(0 0, 90% 0%, 100% 100%, 0% 100%); */
display: flex;
align-items: center;
justify-content: center;
@@ -17,7 +16,6 @@
color: white;
}
-
.hero-section h1 {
font-size: 4rem;
font-family: 'Tilt Neon', cursive;
@@ -54,4 +52,3 @@
text-align: center;
font-family: 'futura-pt', sans-serif;
}
-
diff --git a/src/components/HomeHeader/HomeHeader.tsx b/src/components/HomeHeader/HomeHeader.tsx
new file mode 100644
index 0000000..5e688d0
--- /dev/null
+++ b/src/components/HomeHeader/HomeHeader.tsx
@@ -0,0 +1,77 @@
+import { useState } from 'react';
+import {
+ createStyles,
+ Header,
+ Container,
+ Group,
+ Burger,
+ Paper,
+ Transition,
+ Image,
+} from '@mantine/core';
+import { useDisclosure } from '@mantine/hooks';
+import SamparkLogo from '../../assets/Images/samparklogotransparent.png';
+import useStyles from './styles';
+
+const HEADER_HEIGHT = '5rem';
+
+interface HeaderResponsiveProps {
+ links: { link: string; label: string }[];
+}
+
+const links: any = [
+ { link: '#gallery', label: 'Gallery' },
+ { link: '#', label: 'Blogs' },
+ { link: '#', label: 'Values' },
+ { link: '#', label: 'Contact' },
+];
+
+const HomeHeader = () => {
+ const [opened, { toggle, close }] = useDisclosure(false);
+ const [active, setActive] = useState(links[0].link);
+ const { classes, cx } = useStyles();
+
+ const items = links.map((link: any) => (
+
{
+ event.preventDefault();
+ setActive(link.link);
+ close();
+ }}
+ >
+ {link.label}
+
+ ));
+
+ return (
+
+
+
+ {/* */}
+
+ {items}
+
+
+
+
+
+ {(styles) => (
+
+ {items}
+
+ )}
+
+
+
+ );
+};
+
+export default HomeHeader;
diff --git a/src/components/HomeHeader/styles.ts b/src/components/HomeHeader/styles.ts
new file mode 100644
index 0000000..820f6b6
--- /dev/null
+++ b/src/components/HomeHeader/styles.ts
@@ -0,0 +1,76 @@
+import { createStyles } from '@mantine/styles';
+const HEADER_HEIGHT = '5rem';
+
+const useStyles = createStyles((theme) => ({
+ root: {
+ position: 'absolute',
+ zIndex: 1,
+ backgroundColor: 'transparent',
+ border: 'none',
+ },
+
+ dropdown: {
+ position: 'absolute',
+ top: HEADER_HEIGHT,
+ left: 0,
+ right: 0,
+ zIndex: 0,
+ borderTopRightRadius: 0,
+ borderTopLeftRadius: 0,
+ borderTopWidth: 0,
+ overflow: 'hidden',
+
+ [theme.fn.largerThan('sm')]: {
+ display: 'none',
+ },
+ },
+
+ header: {
+ display: 'flex',
+ justifyContent: 'space-between',
+ alignItems: 'center',
+ height: '100%',
+ },
+
+ links: {
+ [theme.fn.smallerThan('sm')]: {
+ display: 'none',
+ },
+ },
+
+ burger: {
+ [theme.fn.largerThan('sm')]: {
+ display: 'none',
+ },
+ },
+
+ link: {
+ color: theme.white,
+ display: 'block',
+ lineHeight: 1,
+ padding: `.3rem 1rem`,
+ // borderRadius: theme.radius.sm,
+ textDecoration: 'none',
+ // color: theme.colorScheme === 'dark' ? theme.colors.dark[0] : theme.colors.gray[7],
+ fontSize: theme.fontSizes.lg,
+ fontWeight: 300,
+
+ // '&:hover': {
+ // backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[0],
+ // },
+
+ [theme.fn.smallerThan('sm')]: {
+ borderRadius: 0,
+ padding: theme.spacing.md,
+ },
+ },
+
+ // linkActive: {
+ // '&, &:hover': {
+ // backgroundColor: theme.fn.variant({ variant: 'light', color: theme.primaryColor }).background,
+ // color: theme.fn.variant({ variant: 'light', color: theme.primaryColor }).color,
+ // },
+ // },
+}));
+
+export default useStyles;
diff --git a/src/components/HomeOurValues/OurValues.tsx b/src/components/HomeOurValues/OurValues.tsx
index 5f6b068..9ca40f1 100644
--- a/src/components/HomeOurValues/OurValues.tsx
+++ b/src/components/HomeOurValues/OurValues.tsx
@@ -1,14 +1,19 @@
-import { Grid, Container, Text, Title, Paper, createStyles } from '@mantine/core';
+import {
+ Grid,
+ Container,
+ Text,
+ Title,
+ Paper,
+ createStyles,
+} from '@mantine/core';
// const child =
;
const useStyles = createStyles(() => ({
- grid:{
- backgroundColor:'red'
+ grid: {
+ backgroundColor: 'red',
},
}));
-
-
export function OurValues() {
const { classes, cx } = useStyles();
@@ -19,9 +24,9 @@ export function OurValues() {
-
+
INTERCONNECTION
-
+
Our liberty is bound together. No person, community, or ecosystem
exists in isolation, which means we need each other, and we need
to learn from each other. It also means the safety and wellbeing
diff --git a/src/components/HomeOurValues/OurValues1.tsx b/src/components/HomeOurValues/OurValues1.tsx
index 461ef03..874b670 100644
--- a/src/components/HomeOurValues/OurValues1.tsx
+++ b/src/components/HomeOurValues/OurValues1.tsx
@@ -1,16 +1,13 @@
-import React from 'react'
-import './Values.css'
+import React from 'react';
+import './Values.css';
function OurValues1() {
return (
-
- OUR VALUES
-
+
OUR VALUES
-
-
+
1
@@ -20,11 +17,10 @@ function OurValues1() {
of people are inextricably linked to the safety and wellbeing of
our natural world.
-
-
-
-
2
-
+
+
+
2
+
Our liberty is bound together. No person, community, or ecosystem
exists in isolation, which means we need each other, and we need
@@ -32,11 +28,11 @@ function OurValues1() {
of people are inextricably linked to the safety and wellbeing of
our natural world.
-
+
-
-
3
-
+
+
3
+
Our liberty is bound together. No person, community, or ecosystem
exists in isolation, which means we need each other, and we need
@@ -44,15 +40,13 @@ function OurValues1() {
of people are inextricably linked to the safety and wellbeing of
our natural world.
-
+
-
-
-
-
INTEGRITY
-
+
+
INTEGRITY
+
Our liberty is bound together. No person, community, or ecosystem
exists in isolation, which means we need each other, and we need
@@ -60,10 +54,10 @@ function OurValues1() {
of people are inextricably linked to the safety and wellbeing of
our natural world.
-
-
-
INTEGRITY
-
+
+
+
INTEGRITY
+
Our liberty is bound together. No person, community, or ecosystem
exists in isolation, which means we need each other, and we need
@@ -71,11 +65,11 @@ function OurValues1() {
of people are inextricably linked to the safety and wellbeing of
our natural world.
+
-
- )
+ );
}
-export default OurValues1
+export default OurValues1;
diff --git a/src/components/HomeOurValues/Values.css b/src/components/HomeOurValues/Values.css
index afd7a23..3e259d4 100644
--- a/src/components/HomeOurValues/Values.css
+++ b/src/components/HomeOurValues/Values.css
@@ -1,87 +1,79 @@
-.values-heading{
- margin: 2rem 0 1rem 0;
- font-size: 3rem;
- font-family: 'Poppins', sans-serif;
- /* font-family: ; */
+.values-heading {
+ margin: 2rem 0 1rem 0;
+ font-size: 3rem;
+ font-family: 'Poppins', sans-serif;
+ /* font-family: ; */
}
-
-.values-container{
- display: flex;
- flex-direction: column;
- margin: 2rem;
- font-family: 'Golos Text', sans-serif;;
- /* flex-wrap: wrap; */
+.values-container {
+ display: flex;
+ flex-direction: column;
+ margin: 2rem;
+ font-family: 'Golos Text', sans-serif;
+ /* flex-wrap: wrap; */
}
-.values-box-1{
- display: flex;
- flex-direction: row;
- margin:3rem 7rem 3rem 7rem;
+.values-box-1 {
+ display: flex;
+ flex-direction: row;
+ margin: 3rem 7rem 3rem 7rem;
}
-.values-box-2{
- display: flex;
- flex-direction: row;
- margin:0 20rem 0 20rem ;
-
+.values-box-2 {
+ display: flex;
+ flex-direction: row;
+ margin: 0 20rem 0 20rem;
}
-.values-content p{
- margin-top: .5rem;
+.values-content p {
+ margin-top: 0.5rem;
}
-.values-content{
-
- padding: 1rem 2rem 2rem 2rem;
- margin: 0 1rem;
- background-color: rgb(64 70 76);
- border-radius: 1rem;
- color: aliceblue;
+.values-content {
+ padding: 1rem 2rem 2rem 2rem;
+ margin: 0 1rem;
+ background-color: rgb(64 70 76);
+ border-radius: 1rem;
+ color: aliceblue;
}
-
-@media only screen and (max-width: 1350px){
- .values-box-2{
- margin:0 12rem 0 12rem ;
- }
+@media only screen and (max-width: 1350px) {
+ .values-box-2 {
+ margin: 0 12rem 0 12rem;
+ }
}
-@media only screen and (max-width: 1100px){
- .values-box-2{
-
- margin:0 7rem 0 7rem ;
-
- }
- .values-box-1{
-
- margin:3rem 5rem 3rem 5rem ;
-
- }
+@media only screen and (max-width: 1100px) {
+ .values-box-2 {
+ margin: 0 7rem 0 7rem;
+ }
+ .values-box-1 {
+ margin: 3rem 5rem 3rem 5rem;
+ }
}
-@media only screen and (max-width: 1000px){
- .values-box-1{
- margin:3rem 1rem 3rem 1rem ;
- }
+@media only screen and (max-width: 1000px) {
+ .values-box-1 {
+ margin: 3rem 1rem 3rem 1rem;
+ }
}
@media only screen and (max-width: 900px) {
- .values-box-1{
- flex-direction: column;
- margin: 3rem 0 0 0 ;
- }
- .values-container{
- margin: 2rem;
- }
- .values-content{
- margin: 0 0 2rem 0;
- }
- .values-content-2{
- margin-left: 2rem;
- }
+ .values-box-1 {
+ flex-direction: column;
+ margin: 3rem 0 0 0;
}
+ .values-container {
+ margin: 2rem;
+ }
+ .values-content {
+ margin: 0 0 2rem 0;
+ }
+ .values-content-2 {
+ margin-left: 2rem;
+ }
+}
- @media only screen and (max-width: 800px) {
- .values-box-2{
- flex-direction: column;
- margin: 0;
- }
- .values-content-2{
- margin-left: 0rem;
- }
- }
\ No newline at end of file
+@media only screen and (max-width: 800px) {
+ .values-box-2 {
+ flex-direction: column;
+ margin: 0;
+ }
+ .values-content-2 {
+ margin-left: 0rem;
+ }
+}
diff --git a/src/components/ImageGallery/ImageGallery.tsx b/src/components/ImageGallery/ImageGallery.tsx
new file mode 100644
index 0000000..9ab0227
--- /dev/null
+++ b/src/components/ImageGallery/ImageGallery.tsx
@@ -0,0 +1,74 @@
+import { Carousel } from '@mantine/carousel';
+import { Box, Image, Paper, Text, Title, useMantineTheme } from '@mantine/core';
+import { IconArrowNarrowRight } from '@tabler/icons';
+
+const ImageGallery = () => {
+ const theme = useMantineTheme();
+ return (
+
+
+
+ Our Gallery
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {/* ...other slides */}
+
+
+
+ View more
+
+
+
+
+ );
+};
+
+export default ImageGallery;
diff --git a/src/components/MainHeader/MainHeader.tsx b/src/components/MainHeader/MainHeader.tsx
index e7800a5..4881130 100644
--- a/src/components/MainHeader/MainHeader.tsx
+++ b/src/components/MainHeader/MainHeader.tsx
@@ -1,4 +1,4 @@
-import { Header, Container, Group, Burger, Avatar } from '@mantine/core';
+import { Header, Container, Group, Burger, Avatar } from '@mantine/core';
import { useDisclosure } from '@mantine/hooks';
// import { MantineLogo } from '@mantine/ds';
// import DarkThemeToggle from '../DarkThemeToggle/DarkThemeToggle';
@@ -43,7 +43,12 @@ const MainHeader = () => {
{/* */}
-
+
);
diff --git a/src/components/MainHeader/styles.ts b/src/components/MainHeader/styles.ts
index a69de69..49fe3eb 100644
--- a/src/components/MainHeader/styles.ts
+++ b/src/components/MainHeader/styles.ts
@@ -1,22 +1,22 @@
-import { createStyles } from "@mantine/core";
+import { createStyles } from '@mantine/core';
const useStyles = createStyles((theme) => ({
header: {
- display: "flex",
- justifyContent: "space-between",
- alignItems: "center",
- height: "100%",
+ display: 'flex',
+ justifyContent: 'space-between',
+ alignItems: 'center',
+ height: '100%',
},
links: {
- [theme.fn.smallerThan("xs")]: {
- display: "none",
+ [theme.fn.smallerThan('xs')]: {
+ display: 'none',
},
},
burger: {
- [theme.fn.largerThan("xs")]: {
- display: "none",
+ [theme.fn.largerThan('xs')]: {
+ display: 'none',
},
},
@@ -27,31 +27,31 @@ const useStyles = createStyles((theme) => ({
// borderRadius: theme.radius.sm,
// textDecoration: 'none',
color:
- theme.colorScheme === "dark"
+ theme.colorScheme === 'dark'
? theme.colors.dark[0]
: theme.colors.gray[7],
fontSize: theme.fontSizes.sm,
fontWeight: 500,
- "&:hover": {
- cursor: "pointer",
+ '&:hover': {
+ cursor: 'pointer',
backgroundColor:
- theme.colorScheme === "dark"
+ theme.colorScheme === 'dark'
? theme.colors.dark[6]
: theme.colors.gray[0],
},
},
linkActive: {
- "&, &:hover": {
+ '&, &:hover': {
backgroundColor: theme.fn.variant({
- variant: "light",
+ variant: 'light',
color: theme.primaryColor,
}).background,
- color: theme.fn.variant({ variant: "light", color: theme.primaryColor })
+ color: theme.fn.variant({ variant: 'light', color: theme.primaryColor })
.color,
},
},
}));
-export default useStyles;
\ No newline at end of file
+export default useStyles;
diff --git a/src/components/NavBar.tsx b/src/components/NavBar.tsx
index 25ae3f8..75bacf7 100644
--- a/src/components/NavBar.tsx
+++ b/src/components/NavBar.tsx
@@ -1,24 +1,16 @@
-import React, { useState,useEffect } from 'react'
+import React, { useState, useEffect } from 'react';
function NavBar() {
-
-
-
- return (
-
-
- logo
-
-
- Home
- About Us
- Contact US
-
-
-
- )
+ return (
+
+
logo
+
+ Home
+ About Us
+ Contact US
+
+
+ );
}
-export default NavBar
-
-
+export default NavBar;
diff --git a/src/components/Navbar/Navbar.tsx b/src/components/Navbar/Navbar.tsx
index be0bf31..6acdb90 100644
--- a/src/components/Navbar/Navbar.tsx
+++ b/src/components/Navbar/Navbar.tsx
@@ -36,7 +36,9 @@ const HomeNavbar = () => {
const links = data.map((item) => {
return (
{
@@ -67,7 +69,11 @@ const HomeNavbar = () => {
- event.preventDefault()}>
+ event.preventDefault()}
+ >
Change account
diff --git a/src/components/Navbar/styles.ts b/src/components/Navbar/styles.ts
index 99c7b23..71863bd 100644
--- a/src/components/Navbar/styles.ts
+++ b/src/components/Navbar/styles.ts
@@ -11,7 +11,11 @@ const useStyles = createStyles((theme, _params, getRef) => {
footer: {
paddingTop: theme.spacing.md,
marginTop: theme.spacing.md,
- borderTop: `1px solid ${theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[2]}`,
+ borderTop: `1px solid ${
+ theme.colorScheme === 'dark'
+ ? theme.colors.dark[4]
+ : theme.colors.gray[2]
+ }`,
},
link: {
@@ -20,13 +24,19 @@ const useStyles = createStyles((theme, _params, getRef) => {
alignItems: 'center',
textDecoration: 'none',
fontSize: theme.fontSizes.sm,
- color: theme.colorScheme === 'dark' ? theme.colors.dark[1] : theme.colors.gray[7],
+ color:
+ theme.colorScheme === 'dark'
+ ? theme.colors.dark[1]
+ : theme.colors.gray[7],
padding: `${theme.spacing.xs}px ${theme.spacing.sm}px`,
borderRadius: theme.radius.sm,
fontWeight: 500,
'&:hover': {
- backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[0],
+ backgroundColor:
+ theme.colorScheme === 'dark'
+ ? theme.colors.dark[6]
+ : theme.colors.gray[0],
color: theme.colorScheme === 'dark' ? theme.white : theme.black,
[`& .${icon}`]: {
@@ -37,16 +47,26 @@ const useStyles = createStyles((theme, _params, getRef) => {
linkIcon: {
ref: icon,
- color: theme.colorScheme === 'dark' ? theme.colors.dark[2] : theme.colors.gray[6],
+ color:
+ theme.colorScheme === 'dark'
+ ? theme.colors.dark[2]
+ : theme.colors.gray[6],
marginRight: theme.spacing.sm,
},
linkActive: {
'&, &:hover': {
- backgroundColor: theme.fn.variant({ variant: 'light', color: theme.primaryColor }).background,
- color: theme.fn.variant({ variant: 'light', color: theme.primaryColor }).color,
+ backgroundColor: theme.fn.variant({
+ variant: 'light',
+ color: theme.primaryColor,
+ }).background,
+ color: theme.fn.variant({ variant: 'light', color: theme.primaryColor })
+ .color,
[`& .${icon}`]: {
- color: theme.fn.variant({ variant: 'light', color: theme.primaryColor }).color,
+ color: theme.fn.variant({
+ variant: 'light',
+ color: theme.primaryColor,
+ }).color,
},
},
},
diff --git a/src/components/ProviderCollegeTeam/ProviderCollegeTeam.tsx b/src/components/ProviderCollegeTeam/ProviderCollegeTeam.tsx
index 6bfccb4..5bc9472 100644
--- a/src/components/ProviderCollegeTeam/ProviderCollegeTeam.tsx
+++ b/src/components/ProviderCollegeTeam/ProviderCollegeTeam.tsx
@@ -1,90 +1,98 @@
import {
- Avatar,
- Badge,
- Table,
- Group,
- Text,
- ActionIcon,
- Anchor,
- ScrollArea,
- useMantineTheme,
- } from '@mantine/core';
- import { IconPencil, IconTrash } from '@tabler/icons';
- import userData from "./data"
-
-
- interface UsersTableProps {
- data: { avatar: string; name: string; job: string; email: string; phone: string }[];
- }
-
+ Avatar,
+ Badge,
+ Table,
+ Group,
+ Text,
+ ActionIcon,
+ Anchor,
+ ScrollArea,
+ useMantineTheme,
+} from '@mantine/core';
+import { IconPencil, IconTrash } from '@tabler/icons';
+import userData from './data';
- const jobColors: Record = {
- engineer: 'blue',
- manager: 'cyan',
- designer: 'pink',
- };
-
- const ProviderCollegeTeam= ()=> {
- const {data}: UsersTableProps= userData;
- const theme = useMantineTheme();
- const rows = data.map((item:any) => (
-
-
-
-
-
- {item.name}
-
-
-
-
-
-
- {item.job}
-
-
-
- size="sm" href="#" onClick={(event) => event.preventDefault()}>
- {item.email}
-
-
-
-
- {item.phone}
+interface UsersTableProps {
+ data: {
+ avatar: string;
+ name: string;
+ job: string;
+ email: string;
+ phone: string;
+ }[];
+}
+
+const jobColors: Record = {
+ engineer: 'blue',
+ manager: 'cyan',
+ designer: 'pink',
+};
+
+const ProviderCollegeTeam = () => {
+ const { data }: UsersTableProps = userData;
+ const theme = useMantineTheme();
+ const rows = data.map((item: any) => (
+
+
+
+
+
+ {item.name}
-
-
-
-
-
-
-
-
-
-
-
-
- ));
-
- return (
-
-
-
-
- Name
- Designation
- Time Active
- Phone
-
-
-
- {rows}
-
-
- );
- }
+
+
+
+
+
+ {item.job}
+
+
+
+
+ size="sm"
+ href="#"
+ onClick={(event) => event.preventDefault()}
+ >
+ {item.email}
+
+
+
+
+ {item.phone}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ));
+
+ return (
+
+
+
+
+ Name
+ Designation
+ Time Active
+ Phone
+
+
+
+ {rows}
+
+
+ );
+};
- export default ProviderCollegeTeam;
\ No newline at end of file
+export default ProviderCollegeTeam;
diff --git a/src/components/ProviderCollegeTeam/data.ts b/src/components/ProviderCollegeTeam/data.ts
index 5592487..b4ce659 100644
--- a/src/components/ProviderCollegeTeam/data.ts
+++ b/src/components/ProviderCollegeTeam/data.ts
@@ -2,7 +2,6 @@
// data: { avatar: string; name: string; job: string; email: string; phone: string }[];
// }
-
const data = {
data: [
{
@@ -48,5 +47,4 @@ const data = {
],
};
-
-export default data;
\ No newline at end of file
+export default data;
diff --git a/src/components/ProviderMain/ProviderMain.tsx b/src/components/ProviderMain/ProviderMain.tsx
index 8f17737..98e7732 100644
--- a/src/components/ProviderMain/ProviderMain.tsx
+++ b/src/components/ProviderMain/ProviderMain.tsx
@@ -1,4 +1,13 @@
-import { createStyles, Card, Avatar, Text, Group, Button, Table, Badge } from '@mantine/core';
+import {
+ createStyles,
+ Card,
+ Avatar,
+ Text,
+ Group,
+ Button,
+ Table,
+ Badge,
+} from '@mantine/core';
import ProviderStats from '../ProviderStats/ProviderStats';
import { data } from './data';
@@ -12,7 +21,9 @@ const useStyles = createStyles((theme) => ({
},
avatar: {
- border: `2px solid ${theme.colorScheme === 'dark' ? theme.colors.dark[7] : theme.white}`,
+ border: `2px solid ${
+ theme.colorScheme === 'dark' ? theme.colors.dark[7] : theme.white
+ }`,
},
tableRow: {
borderBottom: 'none !important',
@@ -58,7 +69,11 @@ const ProviderMain = () => {
Follow
*/}
-
+
@@ -72,7 +87,11 @@ const ProviderMain = () => {
Designation
-
+
Volunteer
{/* Volunteer */}
diff --git a/src/components/ProviderMain/data.ts b/src/components/ProviderMain/data.ts
index 2139b31..69bbcf1 100644
--- a/src/components/ProviderMain/data.ts
+++ b/src/components/ProviderMain/data.ts
@@ -1,4 +1,4 @@
-export const data:any = {
+export const data: any = {
image:
'https://images.unsplash.com/photo-1488590528505-98d2b5aba04b?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=500&q=80',
avatar:
diff --git a/src/components/ProviderStats/ProviderStats.tsx b/src/components/ProviderStats/ProviderStats.tsx
index 166818d..ef37265 100644
--- a/src/components/ProviderStats/ProviderStats.tsx
+++ b/src/components/ProviderStats/ProviderStats.tsx
@@ -1,4 +1,11 @@
-import { createStyles, ThemeIcon, Progress, Text, Group, Paper } from '@mantine/core';
+import {
+ createStyles,
+ ThemeIcon,
+ Progress,
+ Text,
+ Group,
+ Paper,
+} from '@mantine/core';
import { IconArchive, IconStar } from '@tabler/icons';
const ICON_SIZE = 60;
@@ -15,7 +22,7 @@ const useStyles = createStyles((theme) => ({
padding: theme.spacing.xl,
paddingTop: theme.spacing.xl * 1.5 + ICON_SIZE / 3,
display: 'flex',
- flexDirection:"column",
+ flexDirection: 'column',
justifyContent: 'space-between',
},
@@ -44,7 +51,13 @@ const ProviderStats = () => {
Points Achieved
-
+
Level 1