mirror of
https://github.com/RoboSats/robosats.git
synced 2024-12-14 03:16:24 +00:00
Add tooltips userPage, bottomBar, makerPage
This commit is contained in:
parent
d589dc276b
commit
260c9ec335
@ -1,5 +1,5 @@
|
|||||||
import React, { Component } from 'react'
|
import React, { Component } from 'react'
|
||||||
import {Badge, TextField, ListItemAvatar, Avatar,Paper, Grid, IconButton, Typography, Select, MenuItem, List, ListItemText, ListItem, ListItemIcon, ListItemButton, Divider, Dialog, DialogContent} from "@mui/material";
|
import {Badge, Tooltip, TextField, ListItemAvatar, Avatar,Paper, Grid, IconButton, Typography, Select, MenuItem, List, ListItemText, ListItem, ListItemIcon, ListItemButton, Divider, Dialog, DialogContent} from "@mui/material";
|
||||||
import MediaQuery from 'react-responsive'
|
import MediaQuery from 'react-responsive'
|
||||||
import { Link } from 'react-router-dom'
|
import { Link } from 'react-router-dom'
|
||||||
|
|
||||||
@ -264,17 +264,25 @@ bottomBarDesktop =()=>{
|
|||||||
<Grid container xs={12}>
|
<Grid container xs={12}>
|
||||||
|
|
||||||
<Grid item xs={2}>
|
<Grid item xs={2}>
|
||||||
|
<div style={{display: this.props.avatarLoaded ? '':'none'}}>
|
||||||
<ListItemButton onClick={this.handleClickOpenProfile} >
|
<ListItemButton onClick={this.handleClickOpenProfile} >
|
||||||
|
<Tooltip open={(this.state.active_order_id > 0 & !this.state.profileShown & this.props.avatarLoaded) ? true: false}
|
||||||
|
title="You have an active order">
|
||||||
<ListItemAvatar sx={{ width: 30, height: 30 }} >
|
<ListItemAvatar sx={{ width: 30, height: 30 }} >
|
||||||
<Badge badgeContent={(this.state.active_order_id > 0 & !this.state.profileShown) ? "": null} color="primary">
|
<Badge badgeContent={(this.state.active_order_id > 0 & !this.state.profileShown) ? "": null} color="primary">
|
||||||
<Avatar className='flippedSmallAvatar' sx={{margin: 0, top: -13}}
|
<Avatar className='flippedSmallAvatar' sx={{margin: 0, top: -13}}
|
||||||
alt={this.props.nickname}
|
alt={this.props.nickname}
|
||||||
|
imgProps={{
|
||||||
|
onLoad:() => this.props.setAppState({avatarLoaded: true}),
|
||||||
|
}}
|
||||||
src={this.props.nickname ? window.location.origin +'/static/assets/avatars/' + this.props.nickname + '.png' : null}
|
src={this.props.nickname ? window.location.origin +'/static/assets/avatars/' + this.props.nickname + '.png' : null}
|
||||||
/>
|
/>
|
||||||
</Badge>
|
</Badge>
|
||||||
</ListItemAvatar>
|
</ListItemAvatar>
|
||||||
|
</Tooltip>
|
||||||
<ListItemText primary={this.props.nickname}/>
|
<ListItemText primary={this.props.nickname}/>
|
||||||
</ListItemButton>
|
</ListItemButton>
|
||||||
|
</div>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid item xs={2}>
|
<Grid item xs={2}>
|
||||||
@ -354,19 +362,23 @@ bottomBarDesktop =()=>{
|
|||||||
</Select>
|
</Select>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={3}>
|
<Grid item xs={3}>
|
||||||
|
<Tooltip enterTouchDelay="250" title="Show community and support links">
|
||||||
<IconButton
|
<IconButton
|
||||||
color="primary"
|
color="primary"
|
||||||
aria-label="Community"
|
aria-label="Community"
|
||||||
onClick={this.handleClickOpenCommunity} >
|
onClick={this.handleClickOpenCommunity} >
|
||||||
<PeopleIcon />
|
<PeopleIcon />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={3}>
|
<Grid item xs={3}>
|
||||||
|
<Tooltip enterTouchDelay="250" title="Show stats for nerds">
|
||||||
<IconButton color="primary"
|
<IconButton color="primary"
|
||||||
aria-label="Stats for Nerds"
|
aria-label="Stats for Nerds"
|
||||||
onClick={this.handleClickOpenStatsForNerds} >
|
onClick={this.handleClickOpenStatsForNerds} >
|
||||||
<SettingsIcon />
|
<SettingsIcon />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
</Grid>
|
</Grid>
|
||||||
@ -470,6 +482,8 @@ bottomBarPhone =()=>{
|
|||||||
|
|
||||||
<Grid item xs={1.6}>
|
<Grid item xs={1.6}>
|
||||||
<div style={{display: this.props.avatarLoaded ? '':'none'}}>
|
<div style={{display: this.props.avatarLoaded ? '':'none'}}>
|
||||||
|
<Tooltip open={(this.state.active_order_id > 0 & !this.state.profileShown & this.props.avatarLoaded) ? true: false}
|
||||||
|
title="You have an active order">
|
||||||
<IconButton onClick={this.handleClickOpenProfile} sx={{margin: 0, bottom: 22, right: 8}} >
|
<IconButton onClick={this.handleClickOpenProfile} sx={{margin: 0, bottom: 22, right: 8}} >
|
||||||
<Badge badgeContent={(this.state.active_order_id >0 & !this.state.profileShown) ? "": null} color="primary">
|
<Badge badgeContent={(this.state.active_order_id >0 & !this.state.profileShown) ? "": null} color="primary">
|
||||||
<Avatar className='phoneFlippedSmallAvatar'
|
<Avatar className='phoneFlippedSmallAvatar'
|
||||||
@ -482,39 +496,48 @@ bottomBarPhone =()=>{
|
|||||||
/>
|
/>
|
||||||
</Badge>
|
</Badge>
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
</div>
|
</div>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid item xs={1.6} align="center">
|
<Grid item xs={1.6} align="center">
|
||||||
|
<Tooltip enterTouchDelay="300" title="Number of public BUY orders">
|
||||||
<IconButton onClick={this.handleClickOpenExchangeSummary} >
|
<IconButton onClick={this.handleClickOpenExchangeSummary} >
|
||||||
<Badge badgeContent={this.state.num_public_buy_orders} color="action">
|
<Badge badgeContent={this.state.num_public_buy_orders} color="action">
|
||||||
<InventoryIcon />
|
<InventoryIcon />
|
||||||
</Badge>
|
</Badge>
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid item xs={1.6} align="center">
|
<Grid item xs={1.6} align="center">
|
||||||
|
<Tooltip enterTouchDelay="300" title="Number of public SELL orders">
|
||||||
<IconButton onClick={this.handleClickOpenExchangeSummary} >
|
<IconButton onClick={this.handleClickOpenExchangeSummary} >
|
||||||
<Badge badgeContent={this.state.num_public_sell_orders} color="action">
|
<Badge badgeContent={this.state.num_public_sell_orders} color="action">
|
||||||
<SellIcon />
|
<SellIcon />
|
||||||
</Badge>
|
</Badge>
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid item xs={1.6} align="center">
|
<Grid item xs={1.6} align="center">
|
||||||
|
<Tooltip enterTouchDelay="300" title="Today active robots">
|
||||||
<IconButton onClick={this.handleClickOpenExchangeSummary} >
|
<IconButton onClick={this.handleClickOpenExchangeSummary} >
|
||||||
<Badge badgeContent={this.state.active_robots_today} color="action">
|
<Badge badgeContent={this.state.active_robots_today} color="action">
|
||||||
<SmartToyIcon />
|
<SmartToyIcon />
|
||||||
</Badge>
|
</Badge>
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid item xs={1.8} align="center">
|
<Grid item xs={1.8} align="center">
|
||||||
|
<Tooltip enterTouchDelay="300" title="Today non-KYC bitcoin premium">
|
||||||
<IconButton onClick={this.handleClickOpenExchangeSummary} >
|
<IconButton onClick={this.handleClickOpenExchangeSummary} >
|
||||||
<Badge badgeContent={this.state.today_avg_nonkyc_btc_premium+"%"} color="action">
|
<Badge badgeContent={this.state.today_avg_nonkyc_btc_premium+"%"} color="action">
|
||||||
<PriceChangeIcon />
|
<PriceChangeIcon />
|
||||||
</Badge>
|
</Badge>
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid container item xs={3.8}>
|
<Grid container item xs={3.8}>
|
||||||
@ -529,19 +552,23 @@ bottomBarPhone =()=>{
|
|||||||
</Select>
|
</Select>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={3}>
|
<Grid item xs={3}>
|
||||||
<IconButton color="primary"
|
<Tooltip enterTouchDelay="250" title="Show community and support links">
|
||||||
aria-label="Stats for Nerds"
|
|
||||||
onClick={this.handleClickOpenStatsForNerds} >
|
|
||||||
<SettingsIcon />
|
|
||||||
</IconButton>
|
|
||||||
</Grid>
|
|
||||||
<Grid item xs={3}>
|
|
||||||
<IconButton
|
<IconButton
|
||||||
color="primary"
|
color="primary"
|
||||||
aria-label="Community"
|
aria-label="Community"
|
||||||
onClick={this.handleClickOpenCommunity} >
|
onClick={this.handleClickOpenCommunity} >
|
||||||
<PeopleIcon />
|
<PeopleIcon />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
|
</Grid>
|
||||||
|
<Grid item xs={3}>
|
||||||
|
<Tooltip enterTouchDelay="250" title="Show stats for nerds">
|
||||||
|
<IconButton color="primary"
|
||||||
|
aria-label="Stats for Nerds"
|
||||||
|
onClick={this.handleClickOpenStatsForNerds} >
|
||||||
|
<SettingsIcon />
|
||||||
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
</Grid>
|
</Grid>
|
||||||
|
@ -30,7 +30,7 @@ export default class HomePage extends Component {
|
|||||||
<Router >
|
<Router >
|
||||||
<div className='appCenter'>
|
<div className='appCenter'>
|
||||||
<Switch>
|
<Switch>
|
||||||
<Route exact path='/' render={(props) => <UserGenPage setAppState={this.setAppState}/>}/>
|
<Route exact path='/' render={(props) => <UserGenPage {...this.state} setAppState={this.setAppState}/>}/>
|
||||||
<Route path='/make' component={MakerPage}/>
|
<Route path='/make' component={MakerPage}/>
|
||||||
<Route path='/book' component={BookPage}/>
|
<Route path='/book' component={BookPage}/>
|
||||||
<Route path="/order/:orderId" component={OrderPage}/>
|
<Route path="/order/:orderId" component={OrderPage}/>
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import { Paper, Button , Grid, Typography, TextField, Select, FormHelperText, MenuItem, FormControl, Radio, FormControlLabel, RadioGroup, dividerClasses} from "@mui/material"
|
import { Tooltip, Paper, Button , Grid, Typography, TextField, Select, FormHelperText, MenuItem, FormControl, Radio, FormControlLabel, RadioGroup, dividerClasses} from "@mui/material"
|
||||||
import { Link } from 'react-router-dom'
|
import { Link } from 'react-router-dom'
|
||||||
import getFlags from './getFlags'
|
import getFlags from './getFlags'
|
||||||
|
|
||||||
@ -184,6 +184,7 @@ export default class MakerPage extends Component {
|
|||||||
</Grid>
|
</Grid>
|
||||||
<Grid containter xs={12} alignItems="stretch" style={{ display: "flex" }}>
|
<Grid containter xs={12} alignItems="stretch" style={{ display: "flex" }}>
|
||||||
<div style={{maxWidth:140}}>
|
<div style={{maxWidth:140}}>
|
||||||
|
<Tooltip enterTouchDelay="0" title="Amount of fiat to exchange for bitcoin">
|
||||||
<TextField
|
<TextField
|
||||||
error={this.state.amount <= 0}
|
error={this.state.amount <= 0}
|
||||||
helperText={this.state.amount <= 0 ? 'Invalid' : null}
|
helperText={this.state.amount <= 0 ? 'Invalid' : null}
|
||||||
@ -195,7 +196,9 @@ export default class MakerPage extends Component {
|
|||||||
style: {textAlign:"center"}
|
style: {textAlign:"center"}
|
||||||
}}
|
}}
|
||||||
onChange={this.handleAmountChange}
|
onChange={this.handleAmountChange}
|
||||||
/></div>
|
/>
|
||||||
|
</Tooltip>
|
||||||
|
</div>
|
||||||
<div >
|
<div >
|
||||||
<Select
|
<Select
|
||||||
required="true"
|
required="true"
|
||||||
@ -214,7 +217,7 @@ export default class MakerPage extends Component {
|
|||||||
</Grid>
|
</Grid>
|
||||||
<br/>
|
<br/>
|
||||||
<Grid item xs={12} align="center">
|
<Grid item xs={12} align="center">
|
||||||
<FormControl >
|
<Tooltip enterTouchDelay="0" title="Input your prefered payment methods">
|
||||||
<TextField
|
<TextField
|
||||||
sx={{width:240}}
|
sx={{width:240}}
|
||||||
label="Payment Method(s)"
|
label="Payment Method(s)"
|
||||||
@ -228,7 +231,7 @@ export default class MakerPage extends Component {
|
|||||||
}}
|
}}
|
||||||
onChange={this.handlePaymentMethodChange}
|
onChange={this.handlePaymentMethodChange}
|
||||||
/>
|
/>
|
||||||
</FormControl>
|
</Tooltip>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
|
||||||
<Grid item xs={12} align="center">
|
<Grid item xs={12} align="center">
|
||||||
@ -239,6 +242,7 @@ export default class MakerPage extends Component {
|
|||||||
</div>
|
</div>
|
||||||
</FormHelperText>
|
</FormHelperText>
|
||||||
<RadioGroup row defaultValue="relative">
|
<RadioGroup row defaultValue="relative">
|
||||||
|
<Tooltip enterTouchDelay="0" title="Let the price move with the market">
|
||||||
<FormControlLabel
|
<FormControlLabel
|
||||||
value="relative"
|
value="relative"
|
||||||
control={<Radio color="primary"/>}
|
control={<Radio color="primary"/>}
|
||||||
@ -246,6 +250,8 @@ export default class MakerPage extends Component {
|
|||||||
labelPlacement="Top"
|
labelPlacement="Top"
|
||||||
onClick={this.handleClickRelative}
|
onClick={this.handleClickRelative}
|
||||||
/>
|
/>
|
||||||
|
</Tooltip>
|
||||||
|
<Tooltip enterTouchDelay="0" title="Set a fix amount of satoshis">
|
||||||
<FormControlLabel
|
<FormControlLabel
|
||||||
value="explicit"
|
value="explicit"
|
||||||
control={<Radio color="secondary"/>}
|
control={<Radio color="secondary"/>}
|
||||||
@ -253,6 +259,7 @@ export default class MakerPage extends Component {
|
|||||||
labelPlacement="Top"
|
labelPlacement="Top"
|
||||||
onClick={this.handleClickExplicit}
|
onClick={this.handleClickExplicit}
|
||||||
/>
|
/>
|
||||||
|
</Tooltip>
|
||||||
</RadioGroup>
|
</RadioGroup>
|
||||||
</FormControl>
|
</FormControl>
|
||||||
</Grid>
|
</Grid>
|
||||||
@ -297,7 +304,8 @@ export default class MakerPage extends Component {
|
|||||||
</Paper>
|
</Paper>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={12} align="center">
|
<Grid item xs={12} align="center">
|
||||||
<Button disabled={this.state.amount == null ||
|
<Tooltip enterTouchDelay="0" title="You must fill the form correctly">
|
||||||
|
<div><Button disabled={this.state.amount == null ||
|
||||||
this.state.amount <= 0 ||
|
this.state.amount <= 0 ||
|
||||||
(this.state.is_explicit & (this.state.badSatoshis != null || this.state.satoshis == null)) ||
|
(this.state.is_explicit & (this.state.badSatoshis != null || this.state.satoshis == null)) ||
|
||||||
(!this.state.is_explicit & this.state.badPremium != null)
|
(!this.state.is_explicit & this.state.badPremium != null)
|
||||||
@ -306,7 +314,8 @@ export default class MakerPage extends Component {
|
|||||||
variant="contained"
|
variant="contained"
|
||||||
onClick={this.handleCreateOfferButtonPressed} >
|
onClick={this.handleCreateOfferButtonPressed} >
|
||||||
Create Order
|
Create Order
|
||||||
</Button>
|
</Button></div>
|
||||||
|
</Tooltip>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={12} align="center">
|
<Grid item xs={12} align="center">
|
||||||
{this.state.badRequest ?
|
{this.state.badRequest ?
|
||||||
|
@ -1,11 +1,13 @@
|
|||||||
import React, { Component } from "react";
|
import React, { Component } from "react";
|
||||||
import { Button , Dialog, Grid, Typography, TextField, ButtonGroup, CircularProgress, IconButton} from "@mui/material"
|
import { Button , Tooltip, Dialog, Grid, Typography, TextField, ButtonGroup, CircularProgress, IconButton} from "@mui/material"
|
||||||
import { Link } from 'react-router-dom'
|
import { Link } from 'react-router-dom'
|
||||||
import Image from 'material-ui-image'
|
import Image from 'material-ui-image'
|
||||||
import InfoDialog from './InfoDialog'
|
import InfoDialog from './InfoDialog'
|
||||||
import SmartToyIcon from '@mui/icons-material/SmartToy';
|
import SmartToyIcon from '@mui/icons-material/SmartToy';
|
||||||
import CasinoIcon from '@mui/icons-material/Casino';
|
import CasinoIcon from '@mui/icons-material/Casino';
|
||||||
import ContentCopy from "@mui/icons-material/ContentCopy";
|
import ContentCopy from "@mui/icons-material/ContentCopy";
|
||||||
|
import InfoIcon from '@mui/icons-material/Info';
|
||||||
|
import HelpOutlineIcon from '@mui/icons-material/HelpOutline';
|
||||||
|
|
||||||
function getCookie(name) {
|
function getCookie(name) {
|
||||||
let cookieValue = null;
|
let cookieValue = null;
|
||||||
@ -103,7 +105,7 @@ export default class UserGenPage extends Component {
|
|||||||
handleClickSubmitToken=()=>{
|
handleClickSubmitToken=()=>{
|
||||||
this.delGeneratedUser();
|
this.delGeneratedUser();
|
||||||
this.getGeneratedUser(this.state.token);
|
this.getGeneratedUser(this.state.token);
|
||||||
this.setState({loadingRobot: true, tokenHasChanged: false});
|
this.setState({loadingRobot: true, tokenHasChanged: false, copied: false});
|
||||||
this.props.setAppState({avatarLoaded: false, nickname: null, token: null});
|
this.props.setAppState({avatarLoaded: false, nickname: null, token: null});
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -141,6 +143,7 @@ export default class UserGenPage extends Component {
|
|||||||
</Typography>
|
</Typography>
|
||||||
</Grid>
|
</Grid>
|
||||||
<Grid item xs={12} align="center">
|
<Grid item xs={12} align="center">
|
||||||
|
<Tooltip enterTouchDelay="0" title="This is your trading avatar">
|
||||||
<div style={{ maxWidth: 200, maxHeight: 200 }}>
|
<div style={{ maxWidth: 200, maxHeight: 200 }}>
|
||||||
<Image className='newAvatar'
|
<Image className='newAvatar'
|
||||||
disableError='true'
|
disableError='true'
|
||||||
@ -148,7 +151,8 @@ export default class UserGenPage extends Component {
|
|||||||
color='null'
|
color='null'
|
||||||
src={this.state.avatar_url}
|
src={this.state.avatar_url}
|
||||||
/>
|
/>
|
||||||
</div><br/>
|
</div>
|
||||||
|
</Tooltip><br/>
|
||||||
</Grid>
|
</Grid>
|
||||||
</div>
|
</div>
|
||||||
: <CircularProgress sx={{position: 'relative', top: 100, }}/>}
|
: <CircularProgress sx={{position: 'relative', top: 100, }}/>}
|
||||||
@ -171,7 +175,7 @@ export default class UserGenPage extends Component {
|
|||||||
// style: { color: 'green' },
|
// style: { color: 'green' },
|
||||||
// }}
|
// }}
|
||||||
error={this.state.bad_request}
|
error={this.state.bad_request}
|
||||||
label='Store your token safely'
|
label={"Store your token safely"}
|
||||||
required='true'
|
required='true'
|
||||||
value={this.state.token}
|
value={this.state.token}
|
||||||
variant='standard'
|
variant='standard'
|
||||||
@ -186,11 +190,15 @@ export default class UserGenPage extends Component {
|
|||||||
}}
|
}}
|
||||||
InputProps={{
|
InputProps={{
|
||||||
startAdornment:
|
startAdornment:
|
||||||
<IconButton onClick= {()=>navigator.clipboard.writeText(this.state.token)}>
|
<Tooltip disableHoverListener open={this.state.copied} enterTouchDelay="0" title="Copied!">
|
||||||
<ContentCopy color={this.state.tokenHasChanged ? 'inherit' : 'primary' } sx={{width:18, height:18}} />
|
<IconButton onClick= {()=> (navigator.clipboard.writeText(this.state.token) & this.setState({copied:true}))}>
|
||||||
</IconButton>,
|
<ContentCopy color={this.props.avatarLoaded & !this.state.copied & !this.state.bad_request ? 'success' : 'inherit' } sx={{width:18, height:18}}/>
|
||||||
|
</IconButton>
|
||||||
|
</Tooltip>,
|
||||||
endAdornment:
|
endAdornment:
|
||||||
<IconButton onClick={this.handleClickNewRandomToken}><CasinoIcon/></IconButton>,
|
<Tooltip enterTouchDelay="250" title="Generate a new token">
|
||||||
|
<IconButton onClick={this.handleClickNewRandomToken}><CasinoIcon/></IconButton>
|
||||||
|
</Tooltip>,
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</Grid>
|
</Grid>
|
||||||
|
@ -68,12 +68,9 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.phoneFlippedSmallAvatar {
|
.phoneFlippedSmallAvatar {
|
||||||
transform: translate(-20, -20);
|
|
||||||
bottom: 50;
|
|
||||||
right: 50;
|
|
||||||
transform: scaleX(-1);
|
transform: scaleX(-1);
|
||||||
border: 0.8px solid #555;
|
border: 1.3px solid #555;
|
||||||
filter: drop-shadow(0.5px 0.5px 0.5px #000000);
|
filter: drop-shadow(0.7px 0.7px 0.7px #000000);
|
||||||
}
|
}
|
||||||
|
|
||||||
.bookAvatar {
|
.bookAvatar {
|
||||||
|
Loading…
Reference in New Issue
Block a user