diff --git a/frontend/src/components/new-project/billing.js b/frontend/src/components/new-project/billing.js index 441fb76e..de4594c7 100644 --- a/frontend/src/components/new-project/billing.js +++ b/frontend/src/components/new-project/billing.js @@ -6,12 +6,17 @@ const constants = require('@ui/shared/constants'); const fns = require('@ui/shared/functions'); const Button = require('@ui/components/button'); +const BaseElements = require('@ui/components/base-elements'); const Card = require('@ui/components/payment-card'); const { FormattedMessage } = ReactIntl; +const { + H2, +} = BaseElements; + const { default: styled } = Styled; @@ -35,7 +40,7 @@ const Container = styled.div` padding: ${remcalc(96)} ${remcalc(40)}; `; -const Title = styled.h2` +const Title = styled(H2)` margin: 0 0 ${remcalc(18)} 0; font-size: ${remcalc(36)}; color: ${colors.brandSecondaryColor}; diff --git a/frontend/src/components/new-project/index.js b/frontend/src/components/new-project/index.js index 19a5a3d2..c4dcf705 100644 --- a/frontend/src/components/new-project/index.js +++ b/frontend/src/components/new-project/index.js @@ -8,6 +8,11 @@ const fns = require('@ui/shared/functions'); const Input = require('@ui/components/input'); const Button = require('@ui/components/button'); +const BaseElements = require('@ui/components/base-elements'); + +const { + H2, +} = BaseElements; const { Field @@ -33,7 +38,7 @@ const Container = styled.div` padding: ${remcalc(96)} ${remcalc(40)}; `; -const Title = styled.h2` +const Title = styled(H2)` margin: 0 0 ${remcalc(18)} 0; font-size: ${remcalc(36)}; color: ${colors.brandSecondaryColor}; diff --git a/frontend/src/components/new-project/new-billing.js b/frontend/src/components/new-project/new-billing.js index 2b37359a..c939b803 100644 --- a/frontend/src/components/new-project/new-billing.js +++ b/frontend/src/components/new-project/new-billing.js @@ -8,6 +8,11 @@ const fns = require('@ui/shared/functions'); const Input = require('@ui/components/input'); const Button = require('@ui/components/button'); +const BaseElements = require('@ui/components/base-elements'); + +const { + H2, +} = BaseElements; const { Field @@ -33,7 +38,7 @@ const Container = styled.div` padding: ${remcalc(96)} ${remcalc(40)}; `; -const Title = styled.h2` +const Title = styled(H2)` margin: 0 0 ${remcalc(18)} 0; font-size: ${remcalc(36)}; color: ${colors.brandSecondaryColor}; diff --git a/frontend/src/components/people-list/index.js b/frontend/src/components/people-list/index.js index 6c01d537..f4f65ada 100644 --- a/frontend/src/components/people-list/index.js +++ b/frontend/src/components/people-list/index.js @@ -1,4 +1,5 @@ const React = require('react'); +const Styled = require('styled-components'); const Empty = require('@components/empty/people'); @@ -9,9 +10,13 @@ const Button = require('@ui/components/button'); const PeopleTable = require('./table'); const Invite = require('./invite'); -const buttonStyle = { - float: 'right' -}; +const { + default: styled +} = Styled; + +const StyledButton = styled(Button)` + float: right; +`; const People = (props) => { const { @@ -24,13 +29,12 @@ const People = (props) => {