roleypoly/v1
1
0
Fork 0
mirror of https://github.com/roleypoly/roleypoly-v1.git synced 2025-04-25 12:19:10 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix firefox randomly throwing roles into space

Browse source
This commit is contained in:
41666 2019-03-21 11:23:00 -05:00
parent ce348e268b
commit b2139c6a24
3 changed files with 11 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
ui/components/demos/tap.js
View file

@ -5,7 +5,9 @@ import Role from '../role/demo'
import demoRoles from '../../config/demo' import demoRoles from '../../config/demo'
const DemoWrapper = styled.div` const DemoWrapper = styled.div`
text-align: center; justify-content: center;
display: flex;
flex-wrap: wrap;
` `
export default () => <DemoWrapper> export default () => <DemoWrapper>

4
ui/components/role/role.styled.js
View file

@ -9,7 +9,7 @@ export default styled.div`
cursor: pointer; cursor: pointer;
position: relative; position: relative;
display: inline-flex; display: flex;
overflow: hidden; overflow: hidden;
align-items: center; align-items: center;
justify-content: flex-start; justify-content: flex-start;
@ -73,7 +73,7 @@ export default styled.div`
border: 1px solid var(--role-color-base); border: 1px solid var(--role-color-base);
border-radius: 100%; border-radius: 100%;
clip-path: border-box circle(50.2% at 50% 50%); /* firefox fix */ clip-path: border-box circle(50.2% at 50% 50%); /* this is just for you, firefox. */
transform: rotateZ(0); transform: rotateZ(0);
${(props: any) => (props.active) ? ` ${(props: any) => (props.active) ? `

8
ui/pages/_internal/_server.js
View file

@ -32,6 +32,10 @@ const Hider = styled.div`
/* ${(props: any) => props.visible ? '' : 'display: none;'} */ /* ${(props: any) => props.visible ? '' : 'display: none;'} */
` `
const RoleHolder = styled.div`
display: flex;
flex-wrap: wrap;
`
class Server extends React.Component<ServerPageProps> { class Server extends React.Component<ServerPageProps> {
static async getInitialProps (ctx: *, rpc: *, router: *) { static async getInitialProps (ctx: *, rpc: *, router: *) {
const isDiscordBot = ctx.req && ctx.req.headers['user-agent'].includes('Discordbot') const isDiscordBot = ctx.req && ctx.req.headers['user-agent'].includes('Discordbot')
@ -92,11 +96,11 @@ class Server extends React.Component<ServerPageProps> {
<Hider visible={true || currentServer.id !== null}> <Hider visible={true || currentServer.id !== null}>
{ !view.invalidated && view.categories.map(c => <Category key={`cat__${c.name}__${c.id}`}> { !view.invalidated && view.categories.map(c => <Category key={`cat__${c.name}__${c.id}`}>
<div>{ c.name }</div> <div>{ c.name }</div>
<div> <RoleHolder>
{ {
c._roles && c._roles.map(r => <Role key={`role__${r.name}__${r.id}`} role={r} active={view.selected.includes(r.id)} onToggle={this.onToggle(r)} disabled={!r.safe} />) c._roles && c._roles.map(r => <Role key={`role__${r.name}__${r.id}`} role={r} active={view.selected.includes(r.id)} onToggle={this.onToggle(r)} disabled={!r.safe} />)
} }
</div> </RoleHolder>
</Category>) } </Category>) }
</Hider> </Hider>
</div> </div>