urbit/shrub
1
1
Fork 0
mirror of https://github.com/urbit/shrub.git synced 2024-12-22 02:11:38 +03:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #4493 from urbit/mp/launch/1-7-tweak-fix

Browse Source 
launch: fix modal backgrounds
This commit is contained in:
matildepark 2021-02-24 17:33:15 -05:00 committed by GitHub
commit 2878cc9ad7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 13 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
pkg/interface/src/views/apps/launch/app.js
View File

@ -48,12 +48,12 @@ export default function LaunchApp(props) {
position={["relative", "absolute"]} position={["relative", "absolute"]}
left="0" left="0"
bottom="0" bottom="0"
bg="#f2f2f2" backgroundColor="white"
ml={3} ml={3}
mb={3} mb={3}
borderRadius={2} borderRadius={2}
overflow='hidden'
fontSize={0} fontSize={0}
p={2}
cursor="pointer" cursor="pointer"
onClick={() => { onClick={() => {
writeText(props.baseHash); writeText(props.baseHash);
@ -63,8 +63,10 @@ export default function LaunchApp(props) {
}, 2000); }, 2000);
}} }}
> >
<Box backgroundColor="washedGray" p={2}>
<Text mono bold>{hashText || props.baseHash}</Text> <Text mono bold>{hashText || props.baseHash}</Text>
</Box> </Box>
</Box>
); );
const { query } = useQuery(); const { query } = useQuery();
@ -181,7 +183,7 @@ export default function LaunchApp(props) {
<ModalButton <ModalButton
icon="Plus" icon="Plus"
bg="washedGray" bg="washedGray"
color="#000" color="black"
text="New Group" text="New Group"
style={{ gridColumnStart: 1 }} style={{ gridColumnStart: 1 }}
> >
@ -190,7 +192,7 @@ export default function LaunchApp(props) {
<ModalButton <ModalButton
icon="Boot" icon="Boot"
bg="washedGray" bg="washedGray"
color="#000" color="black"
text="Join Group" text="Join Group"
> >
<JoinGroup {...props} /> <JoinGroup {...props} />

11
pkg/interface/src/views/apps/launch/components/ModalButton.tsx
View File

@ -1,5 +1,5 @@
import React from 'react'; import React from 'react';
import { Box, Button, Icon, Text } from '@tlon/indigo-react'; import { Row, Button, Icon, Text } from '@tlon/indigo-react';
import { useModal } from '~/logic/lib/useModal'; import { useModal } from '~/logic/lib/useModal';
const ModalButton = (props) => { const ModalButton = (props) => {
@ -13,17 +13,18 @@ const ModalButton = (props) => {
onClick={showModal} onClick={showModal}
display='flex' display='flex'
cursor='pointer' cursor='pointer'
justifyContent="start" bg="white"
bg={bg} overflow='hidden'
p={2}
border={0} border={0}
p={0}
borderRadius={2} borderRadius={2}
{...rest} {...rest}
> >
<Row bg={bg} p={2} width='100%' justifyContent="start" alignItems="center">
<Icon icon={props.icon} mr={2} color={color}></Icon> <Icon icon={props.icon} mr={2} color={color}></Icon>
<Text color={color} fontWeight="medium" whiteSpace='nowrap'> <Text color={color} fontWeight="medium" whiteSpace='nowrap'>
{props.text} {props.text}
</Text> </Text></Row>
</Button> </Button>
</> </>
); );