ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-12-23 01:39:36 +01:00
Code Issues Releases Wiki Activity

layout basic table

Browse Source
This commit is contained in:
Tim Daubenschütz 2015-05-20 12:09:35 +02:00
parent ba71bd5788
commit 0b4765aa5c
5 changed files with 26 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
css/main.css Normal file
View File

4
index.html
View File

@ -5,10 +5,10 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>ascribe</title> <title>ascribe</title>
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<link ref="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"></link> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"></link>
</head> </head>
<body> <body>
<div id="main" class="container-fluid"></div> <div id="main" class="container"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>

2
js/components/piece_list.js
View File

@ -17,7 +17,7 @@ let PieceList = React.createClass({
render() { render() {
return ( return (
<AltContainer store={PieceListStore}> <AltContainer store={PieceListStore}>
<Table /> <Table class="piecesTable" />
</AltContainer> </AltContainer>
); );
} }

10
js/components/table.js
View File

@ -5,17 +5,13 @@ import TableItem from './table_item';
let Table = React.createClass({ let Table = React.createClass({
render() { render() {
return ( return (
<ul> <div className="row as-pieces-table">
{this.props.pieceList.map((piece, i) => { {this.props.pieceList.map((piece, i) => {
return ( return (
<li key={i}> <TableItem piece={piece} key={i}/>
<TableItem piece={piece} />
</li>
); );
})} })}
</div>
}
</ul>
); );
} }
}); });

26
js/components/table_item.js
View File

@ -2,13 +2,27 @@ import React from 'react';
let TableItem = React.createClass({ let TableItem = React.createClass({
render() { render() {
let piece = this.props.piece;
let columnClasses = 'col-xs-3 col-sm-3 col-md-3 col-lg-3';
return ( return (
<ul> <div className="col-xs-12 col-sm-12 col-md-12 col-lg-12">
<li>something</li> <div className="row">
<li></li> <div className={columnClasses}>
<li></li> <img src={piece.thumbnail} height="50" />
<li></li> </div>
</ul> <div className={columnClasses}>
{piece.artist_name}
</div>
<div className={columnClasses}>
{piece.title}
</div>
<div className={columnClasses}>
{piece.availableActions}
</div>
</div>
</div>
); );
} }
}); });