1
0
mirror of https://github.com/oceanprotocol/market.git synced 2024-06-30 22:01:44 +02:00

fixed pricing styling

This commit is contained in:
Matthias Kretschmann 2020-10-20 16:11:32 +02:00
parent a058af65f6
commit 484d8b735a
Signed by: m
GPG Key ID: 606EEEF3C479A91F
5 changed files with 19 additions and 5 deletions

View File

@ -14,11 +14,16 @@
}
.grid {
margin-top: var(--spacer);
margin-left: -2rem;
margin-right: -2rem;
padding-top: var(--spacer);
display: grid;
gap: var(--spacer);
grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
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 {
@ -26,14 +31,14 @@
}
.datatoken {
margin-top: calc(var(--spacer) / 6);
margin-top: calc(var(--spacer) / 2);
color: var(--color-secondary);
font-size: var(--font-size-small);
font-weight: var(--font-weight-bold);
}
.datatoken h4 {
font-size: var(--font-size-small);
font-size: var(--font-size-base);
color: var(--color-secondary);
margin: 0;
}

View File

@ -7,6 +7,7 @@ import { useField } from 'formik'
import Input from '../../../atoms/Input'
import Error from './Error'
import { DDO } from '@oceanprotocol/lib'
import { usePricing } from '@oceanprotocol/react'
export default function Fixed({
ddo,
@ -16,6 +17,7 @@ export default function Fixed({
content: any
}): ReactElement {
const [field, meta] = useField('price')
const { dtName, dtSymbol } = usePricing(ddo)
return (
<div className={styles.fixed}>
@ -40,6 +42,11 @@ export default function Fixed({
/>
<Error meta={meta} />
</div>
<div className={styles.datatoken}>
<h4>
= <strong>1</strong> {dtName} {dtSymbol}
</h4>
</div>
</div>
</div>
)

View File

@ -1,6 +1,8 @@
.price {
margin: -2rem;
margin-bottom: 0;
border-bottom: 1px solid var(--brand-grey-lighter);
padding-bottom: var(--spacer);
}
.content {

View File

@ -23,7 +23,7 @@ export default function Feedback({
<Button
style="primary"
size="small"
href={`/asset/${ddo.id}`}
href={`/asset/${ddo?.id}`}
className={styles.action}
>
Go to data set

View File

@ -66,7 +66,7 @@ export default function PublishPage({
resetForm()
setSuccess(
'🎉 Successfully published. Now create a price on your data set. 🎉'
'🎉 Successfully published. 🎉 Now create a price on your data set.'
)
} catch (error) {
setError(error.message)