-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #15 from chainhackers/9-available-pools-table
9 available pools table
- Loading branch information
Showing
41 changed files
with
1,074 additions
and
44 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,5 @@ | ||
.env | ||
|
||
# Logs | ||
logs | ||
*.log | ||
|
@@ -35,6 +37,8 @@ out/ | |
# Docs | ||
docs/ | ||
|
||
broadcast/ | ||
|
||
# Dotenv file | ||
.env | ||
|
||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Binary file not shown.
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,22 +1,17 @@ | ||
import { createBrowserRouter, RouterProvider } from 'react-router-dom'; | ||
import { PoolsPage } from 'Pages'; | ||
import './index.scss'; | ||
import '@rainbow-me/rainbowkit/styles.css'; | ||
import { ConnectButton } from '@rainbow-me/rainbowkit'; | ||
import VersionInfo from './components/versionInfo/VersionInfo'; | ||
import CreatePool from './components/createPool/CreatePool'; | ||
|
||
function App() { | ||
const versionGitTag = import.meta.env.VITE_REACT_APP_GIT_TAG; | ||
const gitDate = import.meta.env.VITE_REACT_APP_GIT_DATE; | ||
|
||
console.log('VITE_REACT_APP_GIT_TAG - ', versionGitTag); | ||
console.log('VITE_REACT_APP_GIT_DATE - ', gitDate); | ||
const router = createBrowserRouter([ | ||
{ | ||
path: '/', | ||
element: <PoolsPage poolsType={'All Pools'} />, | ||
}, | ||
]); | ||
|
||
return ( | ||
<div className='app'> | ||
<ConnectButton /> | ||
<CreatePool /> | ||
{versionGitTag && gitDate && <VersionInfo version={versionGitTag} versionDate={gitDate} />} | ||
</div> | ||
); | ||
function App() { | ||
return <RouterProvider router={router} />; | ||
} | ||
|
||
export default App; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
import { FC } from 'react'; | ||
import { DateCellPropsI } from './dateCellProps'; | ||
import { dateFromTimestamp } from 'Utils/dateFromTimestamp'; | ||
|
||
export const DateCell: FC<DateCellPropsI> = ({ cellValue }) => { | ||
const formattedDate = dateFromTimestamp(cellValue); | ||
return <div>{formattedDate}</div>; | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
export interface DateCellPropsI { | ||
cellValue: number; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
export * from './dateCell'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
.header { | ||
display: flex; | ||
padding: 24px; | ||
align-items: center; | ||
align-self: stretch; | ||
background: #1b1b1f; | ||
box-shadow: | ||
0px 1px 2px 0px rgba(0, 0, 0, 0.3), | ||
0px 2px 6px 2px rgba(0, 0, 0, 0.15); | ||
nav { | ||
display: flex; | ||
align-items: center; | ||
gap: 10px; | ||
margin-left: 96px; | ||
margin-right: auto; | ||
a { | ||
padding: 8px; | ||
border-radius: 4px; | ||
background: var(--m-3-sys-dark-surface-container-high, #1b1b1f); | ||
padding: 8px; | ||
color: #c3c6cf; | ||
|
||
&.active { | ||
background-color: #292a2d; | ||
color: #a3cddc; | ||
} | ||
} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
import { FC } from 'react'; | ||
import styles from './Header.module.scss'; | ||
import { Link, useLocation } from 'react-router-dom'; | ||
import { ConnectButton } from '@rainbow-me/rainbowkit'; | ||
|
||
export const Header: FC = () => { | ||
const location = useLocation(); | ||
const currentPath = location.pathname; | ||
|
||
return ( | ||
<header className={styles.header}> | ||
<Link to={'/'}> | ||
<img src='assets/Logo.avif' alt='' /> | ||
</Link> | ||
<nav> | ||
<Link className={currentPath === '/' ? styles.active : ''} to={'/'}> | ||
Pools available | ||
</Link> | ||
</nav> | ||
<ConnectButton /> | ||
</header> | ||
); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
export * from './Header'; |
8 changes: 8 additions & 0 deletions
8
frontend/src/components/icons/NavigateFirst/NavigateFirst.module.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
.icon { | ||
cursor: pointer; | ||
&:hover { | ||
path { | ||
fill: #808080; | ||
} | ||
} | ||
} |
20 changes: 20 additions & 0 deletions
20
frontend/src/components/icons/NavigateFirst/NavigateFirst.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
import { FC } from 'react'; | ||
import styles from './NavigateFirst.module.scss'; | ||
|
||
export const NavigateFirst: FC = () => { | ||
return ( | ||
<svg | ||
className={styles.icon} | ||
xmlns='http://www.w3.org/2000/svg' | ||
width='40' | ||
height='40' | ||
viewBox='0 0 40 40' | ||
fill='none' | ||
> | ||
<path | ||
d='M25.9998 15.4115L21.4098 20.0015L25.9998 24.5915L24.5898 26.0015L18.5898 20.0015L24.5898 14.0015L25.9998 15.4115ZM15.5898 14.0015H13.5898V26.0015H15.5898V14.0015Z' | ||
fill='#43474E' | ||
/> | ||
</svg> | ||
); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
export * from './NavigateFirst'; |
8 changes: 8 additions & 0 deletions
8
frontend/src/components/icons/NavigatePrevious/NavigatePrevious.module.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
.icon { | ||
cursor: pointer; | ||
&:hover { | ||
path { | ||
fill: #808080; | ||
} | ||
} | ||
} |
20 changes: 20 additions & 0 deletions
20
frontend/src/components/icons/NavigatePrevious/NavigatePrevious.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
import { FC } from 'react'; | ||
import styles from './NavigatePrevious.module.scss'; | ||
|
||
export const NavigatePrevious: FC = () => { | ||
return ( | ||
<svg | ||
className={styles.icon} | ||
xmlns='http://www.w3.org/2000/svg' | ||
width='40' | ||
height='40' | ||
viewBox='0 0 40 40' | ||
fill='none' | ||
> | ||
<path | ||
d='M22.5898 14.0015L23.9998 15.4115L19.4198 20.0015L23.9998 24.5915L22.5898 26.0015L16.5898 20.0015L22.5898 14.0015Z' | ||
fill='#43474E' | ||
/> | ||
</svg> | ||
); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
export * from './NavigatePrevious'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,2 @@ | ||
export * from './NavigateFirst'; | ||
export * from './NavigatePrevious'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
export * from 'Components/table'; | ||
export * from 'Components/pagination'; | ||
export * from 'Components/header'; | ||
export * from 'Components/dateCell'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
.pagination { | ||
display: flex; | ||
gap: 24px; | ||
padding: 16px 20px; | ||
justify-content: flex-end; | ||
align-items: center; | ||
.rowsCount { | ||
display: flex; | ||
gap: 8px; | ||
align-items: center; | ||
} | ||
.pages { | ||
display: flex; | ||
gap: 4px; | ||
align-items: center; | ||
span { | ||
font-size: 16px; | ||
} | ||
} | ||
.icons { | ||
display: flex; | ||
gap: 24px; | ||
align-items: center; | ||
|
||
.rotateRight { | ||
transform: rotate(180deg); | ||
} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,36 @@ | ||
import { FC } from 'react'; | ||
import styles from './Pagination.module.scss'; | ||
import { PaginationPropsI } from './PaginationPropsI'; | ||
import { NavigateFirst, NavigatePrevious } from 'Components/icons'; | ||
|
||
export const Pagination: FC<PaginationPropsI> = () => { | ||
return ( | ||
<div className={styles.pagination}> | ||
<div className={styles.rowsCount}> | ||
<span className={styles.dimmedText}>Rows per page:</span> | ||
{/* todo: add drop down menu */} | ||
<span | ||
style={{ padding: '6px 30px 6px 12px ', backgroundColor: '#292a2d', borderRadius: '8px' }} | ||
> | ||
10 | ||
</span> | ||
</div> | ||
<div className={styles.pages}> | ||
{/* todo: display current page and pages length */} | ||
<span>1</span> | ||
<span>of</span> | ||
<span>1</span> | ||
</div> | ||
<div className={styles.icons}> | ||
<NavigateFirst /> | ||
<NavigatePrevious /> | ||
<div className={styles.rotateRight}> | ||
<NavigatePrevious /> | ||
</div> | ||
<div className={styles.rotateRight}> | ||
<NavigateFirst /> | ||
</div> | ||
</div> | ||
</div> | ||
); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
export interface PaginationPropsI {} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
export * from './Pagination'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,80 @@ | ||
@mixin dimmedText { | ||
color: #c3c6cf; | ||
font-family: Noto Sans; | ||
font-size: 16px; | ||
font-style: normal; | ||
font-weight: 400; | ||
line-height: 24px; | ||
letter-spacing: 0.25px; | ||
} | ||
|
||
@mixin text { | ||
color: #fff; | ||
text-align: right; | ||
font-family: Noto Sans; | ||
font-size: 16px; | ||
font-style: normal; | ||
font-weight: 600; | ||
line-height: 24px; | ||
letter-spacing: 0.25px; | ||
} | ||
|
||
.tableContainer { | ||
display: flex; | ||
flex-direction: column; | ||
padding: 0 24px; | ||
width: 100%; | ||
border-radius: 16px; | ||
background: #1b1b1f; | ||
box-shadow: | ||
0px 1px 3px 0px rgba(0, 0, 0, 0.3), | ||
0px 4px 8px 3px rgba(0, 0, 0, 0.15); | ||
table { | ||
width: 100%; | ||
border-collapse: collapse; | ||
border: none; | ||
|
||
thead, | ||
tbody { | ||
padding: 24px; | ||
} | ||
|
||
thead { | ||
tr { | ||
border-bottom: 1px solid #a3cddc; | ||
} | ||
} | ||
tbody { | ||
tr:not(:last-child) { | ||
border-bottom: 1px solid #43474e; | ||
} | ||
} | ||
|
||
th { | ||
border: none; | ||
padding: 22px 8px 22px; | ||
text-align: left; | ||
@include dimmedText; | ||
} | ||
td { | ||
border: none; | ||
padding: 22px 8px; | ||
@include dimmedText; | ||
} | ||
|
||
.center { | ||
text-align: center; | ||
} | ||
.left { | ||
text-align: left; | ||
} | ||
.right { | ||
text-align: right; | ||
} | ||
|
||
.tableFooter { | ||
display: flex; | ||
width: 100%; | ||
} | ||
} | ||
} |
Oops, something went wrong.