Reorder project
parent
ba5432adfe
commit
0aca8fe779
|
@ -1,9 +1,9 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { AppBar, Button } from 'react-toolbox';
|
import { AppBar, Button } from 'react-toolbox';
|
||||||
import { Link } from 'react-router';
|
import { Link } from 'react-router';
|
||||||
import Logo from '../../logo';
|
import Logo from '../../../logo';
|
||||||
import Navigation from '../../navigation';
|
import Navigation from '../../../navigation';
|
||||||
import PlaygroundArea from './playground_area';
|
import PlaygroundArea from '../playground_area';
|
||||||
import style from './appbar.scss';
|
import style from './appbar.scss';
|
||||||
|
|
||||||
class MainAppBar extends React.Component {
|
class MainAppBar extends React.Component {
|
|
@ -1,4 +1,4 @@
|
||||||
@import "../../globals";
|
@import "../../../globals";
|
||||||
@import "~react-toolbox/app_bar/config";
|
@import "~react-toolbox/app_bar/config";
|
||||||
@import "~react-toolbox/button/config";
|
@import "~react-toolbox/button/config";
|
||||||
|
|
|
@ -1,9 +1,9 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import ToolboxComponents from './components';
|
import components from '../modules/components';
|
||||||
import style from './component.scss';
|
import style from './documentation.scss';
|
||||||
|
|
||||||
const Component = (props) => {
|
const Component = (props) => {
|
||||||
const html = { __html: ToolboxComponents[props.params.component].docs };
|
const html = { __html: components[props.params.component].docs };
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={style.documentation}
|
className={style.documentation}
|
|
@ -1,15 +1,15 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import ToolboxComponents from './components';
|
|
||||||
import { History } from 'react-router';
|
import { History } from 'react-router';
|
||||||
import { List, ListItem } from 'react-toolbox';
|
import { List, ListItem } from 'react-toolbox';
|
||||||
import style from './drawer.scss';
|
import style from './drawer_components.scss';
|
||||||
|
import components from '../modules/components';
|
||||||
|
|
||||||
const MainDrawer = React.createClass({
|
const MainDrawer = React.createClass({
|
||||||
mixins: [History],
|
mixins: [History],
|
||||||
|
|
||||||
renderDrawerItems () {
|
renderDrawerItems () {
|
||||||
return Object.keys(ToolboxComponents).map((key) => {
|
return Object.keys(components).map((key) => {
|
||||||
const ToolboxComponent = ToolboxComponents[key];
|
const ToolboxComponent = components[key];
|
||||||
const to = this.context.history.createHref(ToolboxComponent.path);
|
const to = this.context.history.createHref(ToolboxComponent.path);
|
||||||
let className = style.item;
|
let className = style.item;
|
||||||
if (this.context.history.isActive(ToolboxComponent.path)) {
|
if (this.context.history.isActive(ToolboxComponent.path)) {
|
|
@ -1,4 +1,4 @@
|
||||||
@import "../../globals";
|
@import "../../../globals";
|
||||||
|
|
||||||
$drawer-h-offset: 2.4 * $unit;
|
$drawer-h-offset: 2.4 * $unit;
|
||||||
$drawer-v-offset: 1.2 * $unit;
|
$drawer-v-offset: 1.2 * $unit;
|
|
@ -1,8 +1,8 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Button, Drawer } from 'react-toolbox';
|
import { Button, Drawer } from 'react-toolbox';
|
||||||
import style from './playground_area.scss';
|
import style from './drawer_playground.scss';
|
||||||
import Playground from '../../playground';
|
import Playground from '../../playground';
|
||||||
import code from '../../../examples/example.txt';
|
import code from '../../../../examples/example.txt';
|
||||||
|
|
||||||
class PlaygroundArea extends React.Component {
|
class PlaygroundArea extends React.Component {
|
||||||
render () {
|
render () {
|
|
@ -0,0 +1,5 @@
|
||||||
|
@import "../../../globals";
|
||||||
|
|
||||||
|
.drawer > aside {
|
||||||
|
width: 50vw;
|
||||||
|
}
|
|
@ -1,14 +1,14 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import MainAppBar from './appbar';
|
import Appbar from './components/appbar';
|
||||||
import MainDrawer from './drawer';
|
import DrawerComponents from './components/drawer_components';
|
||||||
import style from './style';
|
import style from './style';
|
||||||
|
|
||||||
const Main = (props) => {
|
const Main = (props) => {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<MainAppBar />
|
<Appbar />
|
||||||
<section className={style.content}>
|
<section className={style.content}>
|
||||||
<MainDrawer />
|
<DrawerComponents />
|
||||||
{ props.children }
|
{ props.children }
|
||||||
</section>
|
</section>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -1,5 +0,0 @@
|
||||||
@import "../../globals";
|
|
||||||
|
|
||||||
.drawer > aside {
|
|
||||||
width: 60%;
|
|
||||||
}
|
|
|
@ -3,14 +3,14 @@ import { App } from 'react-toolbox';
|
||||||
import { Route, IndexRoute } from 'react-router';
|
import { Route, IndexRoute } from 'react-router';
|
||||||
import Home from './components/layout/home';
|
import Home from './components/layout/home';
|
||||||
import Main from './components/layout/main';
|
import Main from './components/layout/main';
|
||||||
import Playground from './components/layout/main/playground';
|
import Playground from './components/layout/playground';
|
||||||
import Component from './components/layout/main/component';
|
import Documentation from './components/layout/main/components/documentation';
|
||||||
|
|
||||||
const routes = (
|
const routes = (
|
||||||
<Route component={App}>
|
<Route component={App}>
|
||||||
<Route path="/" component={Home} />
|
<Route path="/" component={Home} />
|
||||||
<Route component={Main}>
|
<Route component={Main}>
|
||||||
<Route path="/components/:component" component={Component} />
|
<Route path="/components/:component" component={Documentation} />
|
||||||
<Route path="/playground" component={Playground} />
|
<Route path="/playground" component={Playground} />
|
||||||
</Route>
|
</Route>
|
||||||
<IndexRoute component={Home}/>
|
<IndexRoute component={Home}/>
|
||||||
|
|
Loading…
Reference in New Issue