aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--packages/instant/src/components/placing_order_button.tsx19
-rw-r--r--packages/instant/src/components/retry_button.tsx2
-rw-r--r--packages/instant/src/components/secondary_button.tsx6
3 files changed, 22 insertions, 5 deletions
diff --git a/packages/instant/src/components/placing_order_button.tsx b/packages/instant/src/components/placing_order_button.tsx
new file mode 100644
index 000000000..8dc05c445
--- /dev/null
+++ b/packages/instant/src/components/placing_order_button.tsx
@@ -0,0 +1,19 @@
+import * as React from 'react';
+
+import { ColorOption } from '../style/theme';
+
+import { Button } from './ui/button';
+import { Container } from './ui/container';
+import { Spinner } from './ui/spinner';
+import { Text } from './ui/text';
+
+export const PlacingOrderButton: React.StatelessComponent<{}> = props => (
+ <Button isDisabled={true} width="100%">
+ <Container display="inline-block" position="relative" top="2px" marginRight="5px">
+ <Spinner widthPx={20} heightPx={20} />
+ </Container>
+ <Text fontColor={ColorOption.white} fontWeight={600} fontSize="20px">
+ Placing Order&hellip;
+ </Text>
+ </Button>
+);
diff --git a/packages/instant/src/components/retry_button.tsx b/packages/instant/src/components/retry_button.tsx
index 28547ce54..0d6188e6a 100644
--- a/packages/instant/src/components/retry_button.tsx
+++ b/packages/instant/src/components/retry_button.tsx
@@ -7,5 +7,5 @@ export interface RetryButtonProps {
}
export const RetryButton: React.StatelessComponent<RetryButtonProps> = props => {
- return <SecondaryButton text="Try Again" onClick={props.onClick} />;
+ return <SecondaryButton onClick={props.onClick}>Try Again</SecondaryButton>;
};
diff --git a/packages/instant/src/components/secondary_button.tsx b/packages/instant/src/components/secondary_button.tsx
index e073f6061..3c139a233 100644
--- a/packages/instant/src/components/secondary_button.tsx
+++ b/packages/instant/src/components/secondary_button.tsx
@@ -6,9 +6,7 @@ import { ColorOption } from '../style/theme';
import { Button, ButtonProps } from './ui/button';
import { Text } from './ui/text';
-export interface SecondaryButtonProps extends ButtonProps {
- text: string;
-}
+export interface SecondaryButtonProps extends ButtonProps {}
export const SecondaryButton: React.StatelessComponent<SecondaryButtonProps> = props => {
const buttonProps = _.omit(props, 'text');
@@ -21,7 +19,7 @@ export const SecondaryButton: React.StatelessComponent<SecondaryButtonProps> = p
{...buttonProps}
>
<Text fontColor={ColorOption.primaryColor} fontWeight={600} fontSize="16px">
- {props.text}
+ {props.children}
</Text>
</Button>
);