displaying text

2 files changed, 8 insertions, 5 deletions

diff --git a/frontend/views/page/components/page.editor.js b/frontend/views/page/components/page.editor.js
index 7d6afcf..35553c9 100644
--- a/frontend/views/page/components/page.editor.js
+++ b/frontend/views/page/components/page.editor.js
@@ -189,7 +189,6 @@ const TileHandle = ({ tile, bounds, box, onMouseDown }) => {
   console.log(tile)
   const { width, height } = tile.settings
   const style = {
-    // width, height,
     transform: generateTransform(tile),
   }
   console.log(generateTransform(tile))
@@ -199,6 +198,7 @@ const TileHandle = ({ tile, bounds, box, onMouseDown }) => {
     case 'image':
       if (tile.settings.is_tiled) {
         style.backgroundImage = 'url(' + tile.settings.url + ')'
+        style.backgroundPosition = tile.settings.align.replace('_', ' ')
         className += ' is_tiled'
       } else {
         className += ' ' + tile.settings.align
@@ -208,6 +208,8 @@ const TileHandle = ({ tile, bounds, box, onMouseDown }) => {
     case 'text':
       content = <span dangerouslySetInnerHTML={{ __html: tile.settings.content }} />
       className += ' ' + tile.settings.align
+      style.width = tile.settings.width + 'px'
+      style.height = tile.settings.height + 'px'
       break
   }
   return (
diff --git a/frontend/views/page/components/tile.form.js b/frontend/views/page/components/tile.form.js
index 1c2c826..045ef5c 100644
--- a/frontend/views/page/components/tile.form.js
+++ b/frontend/views/page/components/tile.form.js
@@ -14,7 +14,7 @@ const SELECT_TYPES = [
 ].map(s => ({ name: s, label: s }))
 
 const ALIGNMENTS = [
-  "top_left", "top center", "top_right",
+  "top_left", "top_center", "top_right",
   "center_left", "center_center", "center_right",
   "bottom_left", "bottom_center", "bottom_right",
 ].map(align => ({
@@ -46,7 +46,8 @@ const newText = (data) => ({
   id: 'new',
   settings: {
     ...newPosition(),
-    content: "",
+    content: "What is up... I have no idea actually",
+    color: 'rgb(255,255,255)',
     width: 200,
     height: 200,
   },
@@ -65,7 +66,7 @@ class TileForm extends Component {
   state = {
     title: "",
     submitTitle: "",
-    data: { ...newImage() },
+    data: { ...newText() },
     errorFields: new Set([]),
   }
 
@@ -287,7 +288,7 @@ class TileForm extends Component {
           required
           data={data.settings}
           error={errorFields.has('content')}
-          onChange={this.handleChange.bind(this)}
+          onChange={this.handleSettingsChange.bind(this)}
           autoComplete="off"
         />
         <div className='row pair'>