aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorfragosti <francesco.agosti93@gmail.com>2018-06-22 02:33:47 +0800
committerfragosti <francesco.agosti93@gmail.com>2018-06-22 02:33:47 +0800
commitd963941be03596d9030dca8788ad26c09b98822d (patch)
tree95bec58330af26058296ac62ea6027d029e749f4
parent8e2c0bb97758a978f704ad8aea916cbfe43abc16 (diff)
downloaddexon-sol-tools-d963941be03596d9030dca8788ad26c09b98822d.tar
dexon-sol-tools-d963941be03596d9030dca8788ad26c09b98822d.tar.gz
dexon-sol-tools-d963941be03596d9030dca8788ad26c09b98822d.tar.bz2
dexon-sol-tools-d963941be03596d9030dca8788ad26c09b98822d.tar.lz
dexon-sol-tools-d963941be03596d9030dca8788ad26c09b98822d.tar.xz
dexon-sol-tools-d963941be03596d9030dca8788ad26c09b98822d.tar.zst
dexon-sol-tools-d963941be03596d9030dca8788ad26c09b98822d.zip
Remove border radius, fix width issue for unlock step
-rw-r--r--packages/website/ts/components/onboarding/onboarding_card.tsx4
-rw-r--r--packages/website/ts/components/onboarding/onboarding_flow.tsx3
-rw-r--r--packages/website/ts/components/onboarding/unlock_wallet_onboarding_step.tsx2
-rw-r--r--packages/website/ts/components/ui/island.tsx8
4 files changed, 12 insertions, 5 deletions
diff --git a/packages/website/ts/components/onboarding/onboarding_card.tsx b/packages/website/ts/components/onboarding/onboarding_card.tsx
index 795a017e9..bc83b8034 100644
--- a/packages/website/ts/components/onboarding/onboarding_card.tsx
+++ b/packages/website/ts/components/onboarding/onboarding_card.tsx
@@ -20,6 +20,7 @@ export interface OnboardingCardProps {
shouldHideBackButton?: boolean;
shouldHideNextButton?: boolean;
continueButtonText?: string;
+ borderRadius?: string;
}
export const OnboardingCard: React.StatelessComponent<OnboardingCardProps> = ({
@@ -32,8 +33,9 @@ export const OnboardingCard: React.StatelessComponent<OnboardingCardProps> = ({
onClose,
shouldHideBackButton,
shouldHideNextButton,
+ borderRadius,
}) => (
- <Island>
+ <Island borderRadius={borderRadius}>
<Container paddingRight="30px" paddingLeft="30px" maxWidth={350} paddingTop="15px" paddingBottom="15px">
<div className="flex flex-column">
<div className="flex justify-between">
diff --git a/packages/website/ts/components/onboarding/onboarding_flow.tsx b/packages/website/ts/components/onboarding/onboarding_flow.tsx
index 7360d26ae..cfce70b84 100644
--- a/packages/website/ts/components/onboarding/onboarding_flow.tsx
+++ b/packages/website/ts/components/onboarding/onboarding_flow.tsx
@@ -67,7 +67,7 @@ export class OnboardingFlow extends React.Component<OnboardingFlowProps> {
const step = steps[stepIndex];
const isLastStep = steps.length - 1 === stepIndex;
return (
- <Container marginLeft="30px">
+ <Container marginLeft="30px" maxWidth={350}>
<OnboardingTooltip
title={step.title}
content={step.content}
@@ -101,6 +101,7 @@ export class OnboardingFlow extends React.Component<OnboardingFlowProps> {
onClickBack={this._goToPrevStep.bind(this)}
continueButtonDisplay={step.continueButtonDisplay}
continueButtonText={step.continueButtonText}
+ borderRadius="10px 10px 0px 0px"
/>
</Container>
);
diff --git a/packages/website/ts/components/onboarding/unlock_wallet_onboarding_step.tsx b/packages/website/ts/components/onboarding/unlock_wallet_onboarding_step.tsx
index 6e6a74a06..0039aa545 100644
--- a/packages/website/ts/components/onboarding/unlock_wallet_onboarding_step.tsx
+++ b/packages/website/ts/components/onboarding/unlock_wallet_onboarding_step.tsx
@@ -10,7 +10,7 @@ export const UnlockWalletOnboardingStep: React.StatelessComponent<UnlockWalletOn
<Container marginTop="15px" marginBottom="15px">
<img src="/images/metamask_icon.png" height="50px" width="50px" />
</Container>
- <Text>Unlock your metamask extension to begin.</Text>
+ <Text center={true}>Unlock your metamask extension to get started.</Text>
</div>
</div>
);
diff --git a/packages/website/ts/components/ui/island.tsx b/packages/website/ts/components/ui/island.tsx
index b88d5fc1b..f157e3052 100644
--- a/packages/website/ts/components/ui/island.tsx
+++ b/packages/website/ts/components/ui/island.tsx
@@ -6,19 +6,23 @@ export interface IslandProps {
style?: React.CSSProperties;
className?: string;
Component?: string | React.ComponentClass<any> | React.StatelessComponent<any>;
+ borderRadius?: string;
}
-const PlainIsland: React.StatelessComponent<IslandProps> = ({ Component, ...rest }) => <Component {...rest} />;
+const PlainIsland: React.StatelessComponent<IslandProps> = ({ Component, borderRadius, ...rest }) => (
+ <Component {...rest} />
+);
export const Island = styled(PlainIsland)`
background-color: ${colors.white};
- border-radius: 10px;
+ border-radius: ${props => props.borderRadius};
box-shadow: 0px 4px 6px ${colors.walletBoxShadow};
overflow: hidden;
`;
Island.defaultProps = {
Component: 'div',
+ borderRadius: '10px',
style: {},
};