diff --git a/src/modules/dashboard/components/Incorporation/DescriptionForm/DescriptionForm.css b/src/modules/dashboard/components/Incorporation/DescriptionForm/DescriptionForm.css new file mode 100644 index 0000000000..654bd12dea --- /dev/null +++ b/src/modules/dashboard/components/Incorporation/DescriptionForm/DescriptionForm.css @@ -0,0 +1,32 @@ +.container { + padding-bottom: 30px; + width: 100%; + border-bottom: 1px solid color-mod(var(--temp-grey-blue-7) alpha(15%)); +} + +.title { + margin-bottom: 16px; + font-size: var(--size-medium-l); + font-weight: var(--weight-bold); + line-height: 24px; + color: var(--dark); + letter-spacing: var(--spacing-medium); +} + +.descriptionContainer textarea { + padding: 0; + overflow: hidden; + border: none; + font-size: var(--size-normal); + font-weight: var(--weight-normal); + line-height: 18px; + color: var(--dark); + letter-spacing: 0.1px; +} + +.descriptionContainer textarea::placeholder { + font-size: var(--size-normal); + font-style: normal; + color: var(--temp-grey-blue-7); + letter-spacing: 0.1px; +} diff --git a/src/modules/dashboard/components/Incorporation/DescriptionForm/DescriptionForm.css.d.ts b/src/modules/dashboard/components/Incorporation/DescriptionForm/DescriptionForm.css.d.ts new file mode 100644 index 0000000000..562e7ce8b6 --- /dev/null +++ b/src/modules/dashboard/components/Incorporation/DescriptionForm/DescriptionForm.css.d.ts @@ -0,0 +1,3 @@ +export const container: string; +export const title: string; +export const descriptionContainer: string; diff --git a/src/modules/dashboard/components/Incorporation/DescriptionForm/DescriptionForm.tsx b/src/modules/dashboard/components/Incorporation/DescriptionForm/DescriptionForm.tsx new file mode 100644 index 0000000000..8407face02 --- /dev/null +++ b/src/modules/dashboard/components/Incorporation/DescriptionForm/DescriptionForm.tsx @@ -0,0 +1,47 @@ +import { useField } from 'formik'; +import React from 'react'; +import { defineMessages, FormattedMessage } from 'react-intl'; + +import { TextareaAutoresize } from '~core/Fields'; + +import styles from './DescriptionForm.css'; + +const MSG = defineMessages({ + title: { + id: 'dashboard.Incorporation.DescriptionForm.title', + defaultMessage: 'Incorporate this DAO', + }, + descriptionPlaceholder: { + id: `dashboard.Incorporation.DescriptionForm.descriptionPlaceholder`, + defaultMessage: 'Add description of why you are incorporating...', + }, +}); + +const displayName = 'dashboard.Incorporation.DescriptionForm'; + +const DescriptionForm = () => { + const [, { value: description }] = useField('description'); + + return ( +
+

+ +

+
+ +
+
+ ); +}; + +DescriptionForm.displayName = displayName; + +export default DescriptionForm; diff --git a/src/modules/dashboard/components/Incorporation/DescriptionForm/index.ts b/src/modules/dashboard/components/Incorporation/DescriptionForm/index.ts new file mode 100644 index 0000000000..4a4cfa8ef9 --- /dev/null +++ b/src/modules/dashboard/components/Incorporation/DescriptionForm/index.ts @@ -0,0 +1 @@ +export { default } from './DescriptionForm'; diff --git a/src/modules/dashboard/components/Incorporation/IncorporationForm/IncorporationForm.tsx b/src/modules/dashboard/components/Incorporation/IncorporationForm/IncorporationForm.tsx index 27be60b008..7c9fc7b886 100644 --- a/src/modules/dashboard/components/Incorporation/IncorporationForm/IncorporationForm.tsx +++ b/src/modules/dashboard/components/Incorporation/IncorporationForm/IncorporationForm.tsx @@ -113,11 +113,7 @@ const IncorporationForm = ({ colony, sidebarRef }: Props) => (
-