diff --git a/src/components/atoms/Input/InputElement.tsx b/src/components/atoms/Input/InputElement.tsx
index ec780206d..36a1b21b5 100644
--- a/src/components/atoms/Input/InputElement.tsx
+++ b/src/components/atoms/Input/InputElement.tsx
@@ -4,6 +4,7 @@ import styles from './InputElement.module.css'
import { InputProps } from '.'
import FilesInput from '../../molecules/FormFields/FilesInput'
import Terms from '../../molecules/FormFields/Terms'
+import Price from '../../molecules/FormFields/Price'
export default function InputElement(props: InputProps): ReactElement {
const { type, options, rows, name, value } = props
@@ -56,6 +57,8 @@ export default function InputElement(props: InputProps): ReactElement {
)
case 'files':
return
+ case 'price':
+ return
case 'terms':
return
default:
diff --git a/src/components/molecules/FormFields/Price/index.module.css b/src/components/molecules/FormFields/Price/index.module.css
new file mode 100644
index 000000000..599fb566f
--- /dev/null
+++ b/src/components/molecules/FormFields/Price/index.module.css
@@ -0,0 +1,26 @@
+.price {
+ display: flex;
+ gap: calc(var(--spacer) / 2);
+ justify-content: center;
+ background: var(--brand-grey-dimmed);
+ margin-left: -2rem;
+ margin-right: -2rem;
+ padding: calc(var(--spacer) * 1.5) var(--spacer);
+}
+
+.price > div {
+ max-width: 8rem;
+ text-align: center;
+}
+
+.price label {
+ color: var(--color-secondary);
+}
+
+.price input {
+ width: 100%;
+ text-align: center;
+ /* color: var(--brand-white);
+ background: rgba(255, 255, 255, 0.1);
+ border-color: var(--brand-grey); */
+}
diff --git a/src/components/molecules/FormFields/Price/index.tsx b/src/components/molecules/FormFields/Price/index.tsx
new file mode 100644
index 000000000..6b5992761
--- /dev/null
+++ b/src/components/molecules/FormFields/Price/index.tsx
@@ -0,0 +1,20 @@
+import React, { ReactElement } from 'react'
+import { InputProps } from '../../../atoms/Input'
+import InputElement from '../../../atoms/Input/InputElement'
+import styles from './index.module.css'
+import Label from '../../../atoms/Input/Label'
+
+export default function Price(props: InputProps): ReactElement {
+ return (
+
+
+
+
+
+
+
+
+
+
+ )
+}