Skip to content

GitLab

S
scratch-www
Unverified Commit 4a7d9096 authored by Eric Rosenbaum's avatar Eric Rosenbaum Committed by GitHub
Browse files
Options

Merge pull request #5211 from ericrosenbaum/more-components 

Add more components to the components page
parents 80258f4b 542c416e
Show whitespace changes
Inline Side-by-side
Showing with 141 additions and 56 deletions
src/components/grid/grid.json
View file @ 4a7d9096
......@@ -2,129 +2,145 @@
{
"id": 1,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 2,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 3,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 4,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 5,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 6,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 7,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 8,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 9,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 10,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 11,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 12,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 13,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 14,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 15,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
},
{
"id": 16,
"type": "project",
"title": "Project",
"title": "Project Title",
"thumbnailUrl": "",
"creator": "",
"href": "#"
"author": {"username": "project creator"},
"href": "#",
"stats": {}
}
]
src/views/components/components.jsx
View file @ 4a7d9096
......@@ -8,22 +8,78 @@ const Carousel = require('../../components/carousel/carousel.jsx');
const Form = require('../../components/forms/form.jsx');
const Input = require('../../components/forms/input.jsx');
const Spinner = require('../../components/spinner/spinner.jsx');
const Grid = require('../../components/grid/grid.jsx');
const TextArea = require('../../components/forms/textarea.jsx');
const SubNavigation = require('../../components/subnavigation/subnavigation.jsx');
const Select = require('../../components/forms/select.jsx');
require('./components.scss');
const Components = () => (
<div className="components">
<div className="inner">
<h1>Nav Bubbles</h1>
<div className="subnavigation">
<SubNavigation>
<a href="">
<li className="active">
cats
</li>
</a>
<a href="">
<li>
also cats
</li>
</a>
<a href="">
<li>
not cats
</li>
</a>
</SubNavigation>
</div>
<h1>Grid</h1>
<Grid
showAvatar
/>
<h1>Button</h1>
<Button>I love button</Button>
<Button>I love buttons</Button>
<h1>Form</h1>
<div className="form">
<Form>
<Select
label="Drop-down"
required
options={[
{
label: 'first option',
value: 1
},
{
label: 'second option',
value: 2
},
{
label: 'third option',
value: 3
}
]}
name="name"
value={1}
/>
<Input
label="Text input"
required
maxLength="30"
name="test"
type="text"
/>
<TextArea
label="Text area"
name="textarea1"
required
/>
</Form>
</div>
<h1>Box Component</h1>
<Box
more="Cat Gifs"
......
src/views/components/components.scss
View file @ 4a7d9096
......@@ -5,6 +5,19 @@
margin: 0 0 10px 0;
}
.subnavigation {
li {
background-color: $active-gray;
&.active {
background-color: $ui-blue;
}
}
}
.form {
width: 200px;
}
.colors {
span {
display: inline-block;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment