mirror of
https://github.com/oceanprotocol/commons.git
synced 2023-03-15 18:03:00 +01:00
form tweaks
This commit is contained in:
parent
77601edced
commit
dc62eaf2c5
@ -66,6 +66,7 @@
|
||||
padding: 0;
|
||||
color: $brand-pink;
|
||||
font-size: $font-size-base;
|
||||
font-family: inherit;
|
||||
box-shadow: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
@ -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": [
|
||||
{
|
||||
|
@ -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>}
|
||||
|
6
src/routes/Styleguide.module.scss
Normal file
6
src/routes/Styleguide.module.scss
Normal file
@ -0,0 +1,6 @@
|
||||
.buttons {
|
||||
> * {
|
||||
display: block;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
}
|
@ -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)}
|
||||
|
Loading…
Reference in New Issue
Block a user