bendtherules/piktochart-create-editor
1
0
Fork 0
mirror of https://github.com/bendtherules/piktochart-create-editor.git synced 2026-08-18 13:52:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Move away assets seection from sidebar to addtocanvasinput

Browse Source
This commit is contained in:
bendtherules
2018-04-09 08:42:26 +05:30
parent cc5730431b
commit d91ff9e53c
4 changed files with 37 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/Components/AddToCanvasInput/AddToCanvasInput.css
+15 -6
View File
@@ -1,11 +1,20 @@
.add-to-canvas-input {
padding-left: 0.25em;
.add-to-canvas-input .assets {
width: 100%;
}
.add-to-canvas-input .desc {
padding: 0.5em 0;
.add-to-canvas-input .assets .text, .add-to-canvas-input .assets .image {
margin: 10px 0;
}
.add-to-canvas-input input {
margin: 0.5em 0;
.add-to-canvas-input .assets .image ul li {
width: 50px;
height: 50px;
margin-right: 5px;
float: left;
overflow: hidden;
}
.add-to-canvas-input .assets .image ul li img {
width: 100%;
height: 100%;
}
src/Components/AddToCanvasInput/AddToCanvasInput.tsx
+11 -1
View File
@@ -47,7 +47,9 @@ export class AddToCanvasInput extends React.Component<AddToCanvasInputProps, Add
render() {
return (
<div className="add-to-canvas-input">
<div className="add-text-input">
<div className="assets">
<h3>Assets</h3>
<div className="text">
<h4>Text</h4>
<input
type="text"
@@ -59,6 +61,14 @@ export class AddToCanvasInput extends React.Component<AddToCanvasInputProps, Add
Add Text
</button>
</div>
<div className="image">
<h4>Images</h4>
<ul className="list-unstyled">
{/* List of images here
<li><img src="images/sample.jpeg" class="img-rounded" /></li> */}
</ul>
</div>
</div>
</div>
);
}
src/Components/Sidebar/Sidebar.css
-21
View File
@@ -7,24 +7,3 @@
height: 80px;
margin: 10px 0;
}
.sidebar .assets {
width: 100%;
}
.sidebar .assets .text, .sidebar .assets .image {
margin: 10px 0;
}
.sidebar .assets .image ul li {
width: 50px;
height: 50px;
margin-right: 5px;
float: left;
overflow: hidden;
}
.sidebar .assets .image ul li img {
width: 100%;
height: 100%;
}
src/Components/Sidebar/Sidebar.tsx
-15
View File
@@ -20,22 +20,7 @@ export class Sidebar extends React.Component<SidebarProps, SidebarState> {
return (
<div className="sidebar col-sm-2 col-md-2 col-lg-2">
<UploadResourcesInput />
<div className="assets">
<h3>Assets</h3>
<div className="text">
<AddToCanvasInput addTextNode={this.props.addTextNode} />
</div>
<div className="image">
<h4>Images</h4>
<ul className="list-unstyled">
{/* List of images here
<li><img src="images/sample.jpeg" class="img-rounded" /></li> */}
</ul>
</div>
</div>
</div>
);