Skip to content

Commit

Permalink
Merge branch 'dev' into main
Browse files Browse the repository at this point in the history
  • Loading branch information
xavier506 committed Nov 5, 2021
2 parents 1710c85 + 746d151 commit a6dfce0
Show file tree
Hide file tree
Showing 15 changed files with 132 additions and 57 deletions.
69 changes: 49 additions & 20 deletions hapi/src/utils/templates/mail.template.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,41 +6,42 @@ const generateConfirmationMail = ({ account }) => {
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<table style="padding: 0px 16px 0px; margin-left: auto; margin-right: auto;">
<table style="margin-left: auto; margin-right: auto;">
<tr>
<table style="max-width: 640px; margin-left: auto; margin-right: auto;">
<tr>
<img style="margin: 0px 44px 24px 44px; width: 177.7px; height: 53px; object-fit: scale-down" src="https://earnproton.com/proton.png"/>
<img style="margin: 40px 0px 24px 16px; width: 178px; height: 53px; object-fit: scale-down;" src="https://earnproton.com/icons/proton.png"/>
</tr>
<tr>
<p align="left" style="margin: 24px 96px; font-family: Arial; font-size: 21px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: normal; letter-spacing: 0.15px; text-align: left; color: #000;">
Welcome to the Proton On-Chain Referral Program!
<p align="left" style="margin: 0px 16px 24px; font-family: Arial; font-size: 21px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: normal; letter-spacing: 0.15px; text-align: left; color: #000;">
${account} - Welcome to the Proton On-Chain Referral Program!
</p>
</tr>
<tr>
<p align="left" style="margin: 24px 96px; font-family: Arial; font-size: 16px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 1.5; letter-spacing: 0.44px; text-align: left; color: #000;">
<p align="left" style="margin: 0px 16px 8px; font-family: Arial; font-size: 16px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 1.5; letter-spacing: 0.44px; text-align: left; color: #000;">
Your Proton referral link is now active. You may share the following link with your friends to earn rewards when they complete new account registration and KYC on the Proton network:
</p>
</tr>
<tr>
<p align="center" style="margin: 24px 0 25px;">
<a href= https://earnproton.com/join/${account}" style="font-family: Arial; font-size: 16px; font-weight: bold; font-stretch: normal; font-style: normal; line-height: 1; letter-spacing: 0.4px; text-align: center; color: #582acb;">
<p align="center" style="margin: 0px 16px 16px;">
<a href="https://earnproton.com/join/${account}" style="font-family: Arial; font-size: 16px; font-weight: bold; font-stretch: normal; font-style: normal; line-height: 1; letter-spacing: 0.4px; text-align: center; color: #582acb;">
https://earnproton.com/join/${account}
</a>
</p>
</tr>
<tr>
<p align="left" style="margin: 24px 96px; font-family: Arial; font-size: 16px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 1.5; letter-spacing: 0.44px; text-align: left; color: #000; overflow-wrap: break-word;">
<p align="left" style="margin: 0px 16px 24px; font-family: Arial; font-size: 16px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 1.5; letter-spacing: 0.44px; text-align: left; color: #000; overflow-wrap: break-word;">
To view your referrals and payments, login using your proton wallet at https://earnproton.com.
</p>
</tr>
<tr>
<p align="left" style="margin: 24px 96px 0px; font-family: Arial; font-size: 16px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 1.5; letter-spacing: 0.44px; text-align: left; color: #000;">
<p align="left" style="margin: 0px 16px 0px; font-family: Arial; font-size: 16px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 1.5; letter-spacing: 0.44px; text-align: left; color: #000;">
Best Regards,
</p>
</tr>
<tr>
<p align="left" style="margin: 8px 96px 24px; font-family: Arial; font-size: 16px; font-weight: bold; font-stretch: normal; font-style: normal; line-height: 1.5; letter-spacing: 0.44px; text-align: left; color: #000;">
<br>
<p align="left" style="margin: 0px 16px 35px; font-family: Arial; font-size: 16px; font-weight: bold; font-stretch: normal; font-style: normal; line-height: 1.5; letter-spacing: 0.44px; text-align: left; color: #000;">
The Proton Affiliate Team
<br>
(Edenia, SoftAtom)
Expand All @@ -49,16 +50,44 @@ const generateConfirmationMail = ({ account }) => {
</table>
</tr>
<tr>
<table style="height: 157px; margin: 40px 0 0; padding: 22px 96px 15px; background-color: rgba(0, 0, 0, 0.87); margin-left: auto; margin-right: auto;">
<p align="left" style="flex-grow: 0; margin: 0 0 20px; font-family: Arial; font-size: 14px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 1.14; letter-spacing: 0.44px; text-align: center; color: #fff;">
<a href="https://forms.gle/GWHig5ciAvg5fdEH7" style="color: #fff;">
Apply Here for Funding
</a>
</p>
<p align="left" style="margin: 20px 218px 15px; font-family: Arial; font-size: 12px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 1.33; letter-spacing: 1.5px; text-align: center; color: #fff;">
THIS PROJECT WAS FUNDED THROUGH THE PROTON GOVERNANCE COMMITTEE WORKER PROPOSAL SYSTEM
</p>
</table>
<div style="background-color: #000; margin-left: auto; margin-right: auto; padding-top: 20px;">
<table style=" margin-left: auto; margin-right: auto;">
<tr>
<p align="left" style="width: 348px; margin: 0px auto 8px auto; font-family: Arial; font-size: 12px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 1.33; letter-spacing: 1.5px; text-align: center; color: #fff;">
THIS PROJECT WAS FUNDED THROUGH THE PROTON GOVERNANCE COMMITTEE WORKER PROPOSAL SYSTEM
</p>
</tr>
<tr>
<p align="left" style="flex-grow: 0; margin: 0px 16px 14px; font-family: Arial; font-size: 14px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 1.14; letter-spacing: 0.44px; text-align: center; color: #fff;">
<a href="https://forms.gle/GWHig5ciAvg5fdEH7" style="color: #fff;">
Apply Here for Funding
</a>
</p>
</tr>
<tr>
<div style="margin-bottom: 16px; text-align: center;">
<a href="https://www.facebook.com/protonxpr" style="text-decoration: none;">
<img style="width: 32px; height: 32px; margin-right: 16px;" src="https://earnproton.com/icons/facebook.png">
</a>
<a href="https://www.instagram.com/protonxpr" style="text-decoration: none;">
<img style="width: 32px; height: 32px; margin-right: 16px;" src="https://earnproton.com/icons/instagram.png">
</a>
<a href="https://twitter.com/protonxpr" style="text-decoration: none;">
<img style="width: 32px; height: 32px; margin-right: 16px;" src="https://earnproton.com/icons/twitter.png">
</a>
<a href="https://www.reddit.com/r/ProtonChain" style="text-decoration: none;">
<img style="width: 32px; height: 32px; margin-right: 16px;" src="https://earnproton.com/icons/reddit.png">
</a>
<a href="https://github.com/eoscostarica/proton-affiliate" style="text-decoration: none;">
<img style="width: 32px; height: 32px; margin-right: 16px;" src="https://earnproton.com/icons/github.png">
</a>
<a href="https://t.me/protonxpr" style="text-decoration: none;">
<img style="width: 32px; height: 32px;" src="https://earnproton.com/icons/telegram.png">
</a>
</div>
</tr>
</table>
</div>
</tr>
</table>
</body>
Expand Down
Binary file added webapp/public/icons/facebook.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added webapp/public/icons/github.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added webapp/public/icons/instagram.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added webapp/public/icons/proton.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added webapp/public/icons/reddit.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added webapp/public/icons/telegram.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added webapp/public/icons/twitter.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
8 changes: 4 additions & 4 deletions webapp/src/components/Footer/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -76,11 +76,11 @@ const Footer = () => {
<ListItem className={classes.listItem}>
<ListItemIcon>
<a
href="https://www.reddit.com/r/ProtonChain"
href="https://www.instagram.com/protonxpr"
target="_blank"
rel="noopener noreferrer"
>
<RedditIcon />
<InstagramIcon />
</a>
</ListItemIcon>
</ListItem>
Expand All @@ -98,11 +98,11 @@ const Footer = () => {
<ListItem className={classes.listItem}>
<ListItemIcon>
<a
href="https://www.instagram.com/protonxpr"
href="https://www.reddit.com/r/ProtonChain"
target="_blank"
rel="noopener noreferrer"
>
<InstagramIcon />
<RedditIcon />
</a>
</ListItemIcon>
</ListItem>
Expand Down
42 changes: 31 additions & 11 deletions webapp/src/components/Header/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ import Divider from '@material-ui/core/Divider'
import Typography from '@material-ui/core/Typography'
import MenuIcon from '@material-ui/icons/Menu'
import List from '@material-ui/core/List'
import Link from '@material-ui/core/Link'
import MuiListItem from '@material-ui/core/ListItem'
import ListItemText from '@material-ui/core/ListItemText'
import LanguageIcon from '@material-ui/icons/Language'
Expand Down Expand Up @@ -234,6 +235,14 @@ const Header = memo(({ onDrawerToggle, routes }) => {
anchorEl={menuAnchorEl}
open={!!menuAnchorEl}
onClose={handleCloseMenu}
anchorOrigin={{
vertical: 'bottom',
horizontal: 'right'
}}
transformOrigin={{
vertical: 'top',
horizontal: 'right'
}}
>
<MenuItem className={classes.accountNameInfo}>
<Box>
Expand Down Expand Up @@ -266,16 +275,25 @@ const Header = memo(({ onDrawerToggle, routes }) => {
<MenuIcon className={classes.menuIcon} />
</IconButton>
</Hidden>
{mainConfig.isTestnet ? (
<ProtonLogoTestnet className={classes.imageSm} />
) : (
<ProtonLogo className={classes.imageSm} />
)}
{mainConfig.isTestnet ? (
<ProtonLogoDesktopTestnet className={classes.imageMd} />
) : (
<ProtonLogoDesktop className={classes.imageMd} />
)}
<Link
button
component={NavLink}
exact
to="/"
activeClassName="active"
href="/"
>
{mainConfig.isTestnet ? (
<ProtonLogoTestnet className={classes.imageSm} />
) : (
<ProtonLogo className={classes.imageSm} />
)}
{mainConfig.isTestnet ? (
<ProtonLogoDesktopTestnet className={classes.imageMd} />
) : (
<ProtonLogoDesktop className={classes.imageMd} />
)}
</Link>
<PageTitle title={t(`${location.pathname}>title`, mainConfig.title)} />
<Box className={classes.desktopSection}>
<List component="nav" className={classes.navBar}>
Expand All @@ -296,7 +314,9 @@ const Header = memo(({ onDrawerToggle, routes }) => {
className={classes.iconButton}
startIcon={<AccountIcon />}
>
<Typography>{state.user.accountName}</Typography>
<Typography className={classes.iconButtonText}>
{state.user.accountName}
</Typography>
</Button>
) : (
<Button
Expand Down
26 changes: 18 additions & 8 deletions webapp/src/components/Header/styles.js
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ export default theme => ({
'& .MuiListItemText-primary': {
fontFamily: 'Montserrat',
fontStyle: 'normal',
fontWeight: 'normal',
fontWeight: 600,
fontSize: 14,
lineHeight: '16px',
display: 'flex',
Expand All @@ -72,7 +72,21 @@ export default theme => ({
}
},
iconButton: {
color: theme.palette.common.black
borderRadius: 0,
color: theme.palette.common.black,
[theme.breakpoints.up('md')]: {
minWidth: 'auto',
marginRight: theme.spacing(5),
padding: theme.spacing(1, 2)
}
},
iconButtonText: {
fontFamily: 'Montserrat',
fontStyle: 'normal',
fontWeight: 600,
fontSize: 14,
lineHeight: '16px',
letterSpacing: '1px'
},
menuIcon: {
color: theme.palette.common.black
Expand All @@ -84,15 +98,11 @@ export default theme => ({
},
btnHeader: {
[theme.breakpoints.up('md')]: {
marginLeft: theme.spacing(2),
marginRight: theme.spacing(2)
marginRight: theme.spacing(4)
}
},
btnLogin: {
borderRadius: 0,
[theme.breakpoints.up('md')]: {
marginLeft: theme.spacing(2)
}
borderRadius: 0
},
accountNameInfo: {
'& .MuiBox-root': {
Expand Down
12 changes: 6 additions & 6 deletions webapp/src/components/HistoryModal/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,17 +4,17 @@ import { makeStyles } from '@material-ui/styles'
import IconButton from '@material-ui/core/IconButton'
import Box from '@material-ui/core/Box'
import Typography from '@material-ui/core/Typography'
import KeyboardBackspaceIcon from '@material-ui/icons/KeyboardBackspace'
import CancelIcon from '@material-ui/icons/Cancel'
import AccessTimeIcon from '@material-ui/icons/AccessTime'
import { useQuery } from '@apollo/client'
import moment from 'moment'

import CustomizedTimeline from '../Timeline'
import Modal from '../Modal'
import styles from './styles'

import { GET_LAST_SYNCED } from '../../gql'

import styles from './styles'

const useStyles = makeStyles(styles)

const HistoryModal = ({ open, onClose, children, referral, title }) => {
Expand All @@ -31,12 +31,12 @@ const HistoryModal = ({ open, onClose, children, referral, title }) => {
<Modal open={open} setOpen={onClose}>
<Box className={classes.timeline}>
<Box className={classes.secondayBar} position="sticky">
<IconButton aria-label="Back" onClick={onClose}>
<KeyboardBackspaceIcon />
</IconButton>
<Typography className={classes.secondayTitle}>
{referral?.invitee} by {referral?.referrer}
</Typography>
<IconButton aria-label="Back" onClick={onClose}>
<CancelIcon />
</IconButton>
</Box>
<Box className={classes.bodySecondary}>
<Box className={classes.boxSecondary}>
Expand Down
13 changes: 9 additions & 4 deletions webapp/src/components/HistoryModal/styles.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ export default theme => ({
backgroundColor: 'rgba(245, 247, 250, 0.74)',
boxShadow: 'none',
display: 'flex',
justifyContent: 'flex-start',
justifyContent: 'space-between',
flexDirection: 'row',
alignItems: 'center',
padding: theme.spacing(0, 1)
Expand All @@ -18,7 +18,8 @@ export default theme => ({
lineHeight: 'normal',
letterSpacing: '0.15px',
textAlign: 'center',
color: theme.palette.common.black
color: theme.palette.common.black,
marginLeft: '8px'
},
timeline: {
width: '100%',
Expand All @@ -45,14 +46,15 @@ export default theme => ({
alignItems: 'center'
},
bodySecondary: {
overflow: 'scroll',
overflow: 'auto',
padding: theme.spacing(2, 1),
height: 'calc(100% - 80px)',
display: 'flex',
flexDirection: 'column',
justifyContent: 'space-between',
[theme.breakpoints.up('md')]: {
width: 430
width: 514,
padding: theme.spacing(6, 9)
}
},
emptyState: {
Expand All @@ -74,6 +76,9 @@ export default theme => ({
color: '#000'
}
},
timelineTitle: {
padding: theme.spacing(0, 2)
},
boxSecondary: {
height: '100%'
},
Expand Down
14 changes: 11 additions & 3 deletions webapp/src/components/Timeline/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ import moment from 'moment'
import { mainConfig } from '../../config'
import { getLastCharacters } from '../../utils'

import PlusSvg from './Plus.js'
import AddSvg from './Add.js'
import CloseSvg from './Close.js'
import CancelSvg from './Cancel.js'
Expand All @@ -33,7 +34,7 @@ const TimelineIcon = ({ action, color }) => {

switch (action) {
case 'addref':
icon = <QuestionSvg color={color} />
icon = <PlusSvg color={color} />
break

case 'newaccount':
Expand Down Expand Up @@ -82,11 +83,18 @@ const CustomizedTimeline = ({ items, itemHasAction }) => {
<Timeline align="alternate" classes={{ root: classes.main }}>
{items.map((item, index) => (
<TimelineItem key={`${index}-${item.action}`}>
<TimelineOppositeContent>
<TimelineOppositeContent
classes={{
root: classes.timelineOppositeContent
}}
>
<Typography
variant="body2"
color="textSecondary"
className={classes.date}
className={clsx(
classes.date,
!(index % 2) && classes.dateJustify
)}
>
{moment(item.block_time).format('MM/DD/YYYY hh:mmA')}
</Typography>
Expand Down
5 changes: 4 additions & 1 deletion webapp/src/components/Timeline/styles.js
Original file line number Diff line number Diff line change
Expand Up @@ -41,12 +41,15 @@ export default theme => ({
color: theme.palette.common.black,
marginTop: 5
},
dateJustify: {
justifyContent: 'end'
},
paperWrapper: {
paddingTop: 0,
marginTop: -10
},
timeLineSeparator: {
height: '100px'
height: '80px'
},
secondaryColor: {
borderColor: '#1DAEFF'
Expand Down

0 comments on commit a6dfce0

Please sign in to comment.