mirror of
https://github.com/oceanprotocol/market.git
synced 2024-12-02 05:57:29 +01:00
fixed pricing styling
This commit is contained in:
parent
a058af65f6
commit
484d8b735a
@ -14,11 +14,16 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.grid {
|
.grid {
|
||||||
margin-top: var(--spacer);
|
margin-left: -2rem;
|
||||||
|
margin-right: -2rem;
|
||||||
|
padding-top: var(--spacer);
|
||||||
display: grid;
|
display: grid;
|
||||||
gap: var(--spacer);
|
gap: var(--spacer);
|
||||||
grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
|
grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
background: var(--brand-grey-dimmed);
|
||||||
|
border-top: 1px solid var(--brand-grey-lighter);
|
||||||
|
border-bottom: 1px solid var(--brand-grey-lighter);
|
||||||
}
|
}
|
||||||
|
|
||||||
.fixed label {
|
.fixed label {
|
||||||
@ -26,14 +31,14 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.datatoken {
|
.datatoken {
|
||||||
margin-top: calc(var(--spacer) / 6);
|
margin-top: calc(var(--spacer) / 2);
|
||||||
color: var(--color-secondary);
|
color: var(--color-secondary);
|
||||||
font-size: var(--font-size-small);
|
font-size: var(--font-size-small);
|
||||||
font-weight: var(--font-weight-bold);
|
font-weight: var(--font-weight-bold);
|
||||||
}
|
}
|
||||||
|
|
||||||
.datatoken h4 {
|
.datatoken h4 {
|
||||||
font-size: var(--font-size-small);
|
font-size: var(--font-size-base);
|
||||||
color: var(--color-secondary);
|
color: var(--color-secondary);
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
@ -7,6 +7,7 @@ import { useField } from 'formik'
|
|||||||
import Input from '../../../atoms/Input'
|
import Input from '../../../atoms/Input'
|
||||||
import Error from './Error'
|
import Error from './Error'
|
||||||
import { DDO } from '@oceanprotocol/lib'
|
import { DDO } from '@oceanprotocol/lib'
|
||||||
|
import { usePricing } from '@oceanprotocol/react'
|
||||||
|
|
||||||
export default function Fixed({
|
export default function Fixed({
|
||||||
ddo,
|
ddo,
|
||||||
@ -16,6 +17,7 @@ export default function Fixed({
|
|||||||
content: any
|
content: any
|
||||||
}): ReactElement {
|
}): ReactElement {
|
||||||
const [field, meta] = useField('price')
|
const [field, meta] = useField('price')
|
||||||
|
const { dtName, dtSymbol } = usePricing(ddo)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.fixed}>
|
<div className={styles.fixed}>
|
||||||
@ -40,6 +42,11 @@ export default function Fixed({
|
|||||||
/>
|
/>
|
||||||
<Error meta={meta} />
|
<Error meta={meta} />
|
||||||
</div>
|
</div>
|
||||||
|
<div className={styles.datatoken}>
|
||||||
|
<h4>
|
||||||
|
= <strong>1</strong> {dtName} — {dtSymbol}
|
||||||
|
</h4>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
@ -1,6 +1,8 @@
|
|||||||
.price {
|
.price {
|
||||||
margin: -2rem;
|
margin: -2rem;
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
|
border-bottom: 1px solid var(--brand-grey-lighter);
|
||||||
|
padding-bottom: var(--spacer);
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
|
@ -23,7 +23,7 @@ export default function Feedback({
|
|||||||
<Button
|
<Button
|
||||||
style="primary"
|
style="primary"
|
||||||
size="small"
|
size="small"
|
||||||
href={`/asset/${ddo.id}`}
|
href={`/asset/${ddo?.id}`}
|
||||||
className={styles.action}
|
className={styles.action}
|
||||||
>
|
>
|
||||||
Go to data set →
|
Go to data set →
|
||||||
|
@ -66,7 +66,7 @@ export default function PublishPage({
|
|||||||
resetForm()
|
resetForm()
|
||||||
|
|
||||||
setSuccess(
|
setSuccess(
|
||||||
'🎉 Successfully published. Now create a price on your data set. 🎉'
|
'🎉 Successfully published. 🎉 Now create a price on your data set.'
|
||||||
)
|
)
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
setError(error.message)
|
setError(error.message)
|
||||||
|
Loading…
Reference in New Issue
Block a user