1
0
mirror of https://github.com/oceanprotocol/commons.git synced 2023-03-15 18:03:00 +01:00

form tweaks

This commit is contained in:
Matthias Kretschmann 2019-02-08 15:55:28 +01:00
parent 77601edced
commit dc62eaf2c5
Signed by: m
GPG Key ID: 606EEEF3C479A91F
5 changed files with 24 additions and 12 deletions

View File

@ -66,6 +66,7 @@
padding: 0;
color: $brand-pink;
font-size: $font-size-base;
font-family: inherit;
box-shadow: none;
cursor: pointer;
}

View File

@ -1,6 +1,6 @@
{
"title": "Commons Marketplace",
"description": "",
"title": "Commons",
"description": "A marketplace to find and publish open data sets in the Ocean Network.",
"company": "Ocean Protocol Foundation Ltd.",
"social": [
{

View File

@ -5,6 +5,8 @@ import Input from '../components/atoms/Form/Input'
import Route from '../components/templates/Route'
import styles from './Home.module.scss'
import meta from '../data/meta.json'
interface HomeState {
search?: string
}
@ -19,8 +21,8 @@ class Home extends Component<HomeProps, HomeState> {
public render() {
return (
<Route
title="Commons"
description="A marketplace to find and publish open data sets in the Ocean Network."
title={meta.title}
description={meta.description}
className={styles.home}
>
<Form onSubmit={this.searchAssets}>
@ -28,7 +30,7 @@ class Home extends Component<HomeProps, HomeState> {
type="search"
name="search"
label="Search"
placeholder=""
placeholder="i.e. almond sales data"
value={this.state.search}
onChange={this.inputChange}
group={<Button>Search</Button>}

View File

@ -0,0 +1,6 @@
.buttons {
> * {
display: block;
margin-bottom: 2rem;
}
}

View File

@ -3,7 +3,7 @@ import Button from '../components/atoms/Button'
import Form from '../components/atoms/Form/Form'
import Input from '../components/atoms/Form/Input'
import Route from '../components/templates/Route'
import styles from './Styleguide.module.scss'
import form from '../data/form-styleguide.json'
class Styleguide extends Component {
@ -24,12 +24,15 @@ class Styleguide extends Component {
public render() {
const entries = Object.entries(form.fields)
return (
<Route title="Styleguide">
<Button>I am a button</Button>
<Button primary>I am a primary button</Button>
<Button href="https://hello.com">
I am a link disguised as a button
</Button>
<Route title="Styleguide" className={styles.styleguide}>
<div className={styles.buttons}>
<Button>I am a button</Button>
<Button primary>I am a primary button</Button>
<Button href="https://hello.com">
I am a link disguised as a button
</Button>
<Button link>I am a button disguised as a text link</Button>
</div>
<Form title={form.title} description={form.description}>
{this.formFields(entries)}