aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant/src/components
diff options
context:
space:
mode:
Diffstat (limited to 'packages/instant/src/components')
-rw-r--r--packages/instant/src/components/ui/container.tsx5
-rw-r--r--packages/instant/src/components/ui/flex.tsx5
-rw-r--r--packages/instant/src/components/ui/input.tsx5
-rw-r--r--packages/instant/src/components/ui/text.tsx5
4 files changed, 16 insertions, 4 deletions
diff --git a/packages/instant/src/components/ui/container.tsx b/packages/instant/src/components/ui/container.tsx
index 7077d0aa3..76b570de7 100644
--- a/packages/instant/src/components/ui/container.tsx
+++ b/packages/instant/src/components/ui/container.tsx
@@ -30,7 +30,10 @@ export interface ContainerProps {
opacity?: number;
}
-export const Container = styled<ContainerProps, 'div'>('div')`
+export const Container =
+ styled.div <
+ ContainerProps >
+ `
box-sizing: border-box;
${props => cssRuleIfExists(props, 'display')}
${props => cssRuleIfExists(props, 'position')}
diff --git a/packages/instant/src/components/ui/flex.tsx b/packages/instant/src/components/ui/flex.tsx
index d4e14d979..5fa3fc95b 100644
--- a/packages/instant/src/components/ui/flex.tsx
+++ b/packages/instant/src/components/ui/flex.tsx
@@ -12,7 +12,10 @@ export interface FlexProps {
className?: string;
}
-export const Flex = styled<FlexProps, 'div'>('div')`
+export const Flex =
+ styled.div <
+ FlexProps >
+ `
display: flex;
flex-direction: ${props => props.direction};
flex-wrap: ${props => props.flexWrap};
diff --git a/packages/instant/src/components/ui/input.tsx b/packages/instant/src/components/ui/input.tsx
index 9db7d1c4c..a884ff7cb 100644
--- a/packages/instant/src/components/ui/input.tsx
+++ b/packages/instant/src/components/ui/input.tsx
@@ -12,7 +12,10 @@ export interface InputProps {
onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
}
-export const Input = styled<InputProps, 'input'>('input')`
+export const Input =
+ styled.input <
+ InputProps >
+ `
font-size: ${props => props.fontSize};
width: ${props => props.width};
padding: 0.1em 0em;
diff --git a/packages/instant/src/components/ui/text.tsx b/packages/instant/src/components/ui/text.tsx
index d23b0034d..fd72f6cc8 100644
--- a/packages/instant/src/components/ui/text.tsx
+++ b/packages/instant/src/components/ui/text.tsx
@@ -24,7 +24,10 @@ export interface TextProps {
}
const darkenOnHoverAmount = 0.3;
-export const Text = styled<TextProps, 'div'>('div')`
+export const Text =
+ styled.div <
+ TextProps >
+ `
font-family: ${props => props.fontFamily};
font-style: ${props => props.fontStyle};
font-weight: ${props => props.fontWeight};