Skip to content
Snippets Groups Projects
Commit a2a095bc authored by chris's avatar chris
Browse files

grid cell

parent 246cec9e
No related branches found
No related tags found
1 merge request!161Connect ui
...@@ -20,11 +20,11 @@ const ButtonStyled = styled.button` ...@@ -20,11 +20,11 @@ const ButtonStyled = styled.button`
`; `;
const InsertTableToolContainer = styled.div` const InsertTableToolContainer = styled.div`
display: block !important;
height: auto;
top: 53px; top: 53px;
left: 556px;
position: absolute; position: absolute;
height: auto;
width: 167px;
display: block !important;
`; `;
const CreateTable = ({ view = {}, item }) => { const CreateTable = ({ view = {}, item }) => {
......
...@@ -76,24 +76,22 @@ const GUTTER_SIZE = 5; ...@@ -76,24 +76,22 @@ const GUTTER_SIZE = 5;
const CELL_SIZE = 16; const CELL_SIZE = 16;
const MAX_SIZE = 20; const MAX_SIZE = 20;
class GridCell extends React.PureComponent { const GridCell = props => {
render() { const { x, y, selected } = props;
const { x, y, selected } = this.props; const style = {
const style = { left: x + 'px',
left: x + 'px', top: y + 'px',
top: y + 'px', width: CELL_SIZE + 'px',
width: CELL_SIZE + 'px', height: CELL_SIZE + 'px',
height: CELL_SIZE + 'px', border: '1px solid gray',
border: '1px solid gray', boxSizing: 'border-box',
boxSizing: 'border-box', position: 'absolute',
position: 'absolute', zIndex: 2,
zIndex: 2, };
};
if (selected) style.background = 'skyblue'; if (selected) style.background = 'skyblue';
return <div style={style} />; return <div style={style} />;
} };
}
GridCell.propTypes = { GridCell.propTypes = {
x: PropTypes.number.isRequired, x: PropTypes.number.isRequired,
......
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