Mirror/robosats
1
0
Fork 0
mirror of https://github.com/RoboSats/robosats.git synced 2025-01-18 20:21:35 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Scale avatar width and R. Pass theme as prop to class components.

Browse Source
This commit is contained in:
Reckless_Satoshi 2022-08-19 15:26:14 -07:00 committed by Felipe Mitjans
parent e2455ec3f9
commit a777ecb989
4 changed files with 27 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/App.js
View File

@ -60,7 +60,7 @@ export default class App extends Component {
{this.state.dark ? <LightModeIcon/>:<DarkModeIcon/>} {this.state.dark ? <LightModeIcon/>:<DarkModeIcon/>}
</IconButton> </IconButton>
<UnsafeAlert className="unsafeAlert"/> <UnsafeAlert className="unsafeAlert"/>
<HomePage/> <HomePage {...this.state}/>
</ThemeProvider> </ThemeProvider>
</I18nextProvider> </I18nextProvider>
</Suspense> </Suspense>

10
frontend/src/components/HomePage.js
View File

@ -44,11 +44,11 @@ export default class HomePage extends Component {
<Router > <Router >
<div className='appCenter'> <div className='appCenter'>
<Switch> <Switch>
<Route exact path='/' render={(props) => <UserGenPage {...props} {...this.state} setAppState={this.setAppState}/>}/> <Route exact path='/' render={(props) => <UserGenPage {...props} {...this.state} {...this.props} setAppState={this.setAppState}/>}/>
<Route path='/ref/:refCode' render={(props) => <UserGenPage {...props} {...this.state} setAppState={this.setAppState}/>}/> <Route path='/ref/:refCode' render={(props) => <UserGenPage {...props} {...this.state} {...this.props} setAppState={this.setAppState}/>}/>
<Route path='/make' render={(props) => <MakerPage {...props} {...this.state} setAppState={this.setAppState}/>}/> <Route path='/make' render={(props) => <MakerPage {...props} {...this.state} {...this.props} setAppState={this.setAppState}/>}/>
<Route path='/book' render={(props) => <BookPage {...props} {...this.state} setAppState={this.setAppState} />}/> <Route path='/book' render={(props) => <BookPage {...props} {...this.state} {...this.props} setAppState={this.setAppState} />}/>
<Route path="/order/:orderId" render={(props) => <OrderPage {...props} {...this.state} setAppState={this.setAppState}/>}/> <Route path="/order/:orderId" render={(props) => <OrderPage {...props} {...this.state} {...this.props} setAppState={this.setAppState}/>}/>
</Switch> </Switch>
</div> </div>
<div className='bottomBar'> <div className='bottomBar'>

16
frontend/src/components/UserGenPage.js
View File

@ -181,6 +181,7 @@ class UserGenPage extends Component {
render() { render() {
const { t, i18n} = this.props; const { t, i18n} = this.props;
const fontSize = this.props.theme.typography.fontSize;
return ( return (
<Grid container spacing={1}> <Grid container spacing={1}>
<Grid item> <Grid item>
@ -200,6 +201,7 @@ class UserGenPage extends Component {
</Grid> </Grid>
<Grid item xs={12} align="center"> <Grid item xs={12} align="center">
<Tooltip enterTouchDelay={0} title={t("This is your trading avatar")}> <Tooltip enterTouchDelay={0} title={t("This is your trading avatar")}>
<<<<<<< HEAD
<div style={{ maxWidth: 200, maxHeight: 200 }}> <div style={{ maxWidth: 200, maxHeight: 200 }}>
<SmoothImage <SmoothImage
src={this.state.avatarUrl} src={this.state.avatarUrl}
@ -208,6 +210,16 @@ class UserGenPage extends Component {
filter: "drop-shadow(1px 1px 1px #000000)", filter: "drop-shadow(1px 1px 1px #000000)",
height: "195px", height: "195px",
width: "200px"}} width: "200px"}}
=======
<div style={{ maxWidth: fontSize * 14.28, maxHeight: fontSize * 14.28, alignText: "center"}}>
<Image
className='newAvatar'
imageStyle={{height: fontSize * 14.28, width: fontSize * 14.28}} // factor = originalSize/default_fontSize = 200/14 = 14.28
disableError={true}
cover={true}
color='null'
src={getCookie("sessionid") ? this.state.avatarUrl || "" : ""}
>>>>>>> Scale avatar width and R. Pass theme as prop to class components.
/> />
</div> </div>
</Tooltip> </Tooltip>
@ -319,7 +331,9 @@ class UserGenPage extends Component {
</Typography> </Typography>
</Grid> </Grid>
<Grid item xs={2.5} align="left"> <Grid item xs={2.5} align="left">
<RoboSatsNoTextIcon color="primary" sx={{height:72, width:72}}/> <RoboSatsNoTextIcon color="primary"
sx={{height: fontSize * 5.14, width: fontSize * 5.14}} // factor = originalSize/default_fontSize = 272/14 = 5.14
/>
</Grid> </Grid>
</Grid> </Grid>
</div> </div>

6
frontend/static/css/index.css
View File

@ -87,6 +87,12 @@ input[type=number] {
left: -16px; left: -16px;
} }
.newAvatar {
border-radius: 50%;
border: 2px solid #555;
filter: drop-shadow(1px 1px 1px #000000);
}
.profileAvatar { .profileAvatar {
border: 0.5px solid #555; border: 0.5px solid #555;
filter: drop-shadow(0.5px 0.5px 0.5px #000000); filter: drop-shadow(0.5px 0.5px 0.5px #000000);