add break-word wrap to add/edit text box on dashboard

getredash · Jun 10, 2018 · d116381 · d116381
1 parent c86423a
commit d116381
Show file tree

Hide file tree

Showing 5 changed files with 7 additions and 2 deletions.
diff --git a/client/app/components/dashboards/add-widget-dialog.html b/client/app/components/dashboards/add-widget-dialog.html
@@ -15,7 +15,7 @@ <h4 class="modal-title">Add Widget</h4>
     </div>
     <div ng-show="$ctrl.text" class="m-t-15">
       <strong>Preview:</strong>
-      <p ng-bind-html="$ctrl.text | markdown"></p>
+      <p ng-bind-html="$ctrl.text | markdown" class="word-wrap-break"></p>
     </div>
   </div>
 

diff --git a/client/app/components/dashboards/add-widget-dialog.js b/client/app/components/dashboards/add-widget-dialog.js
@@ -1,5 +1,6 @@
 import { debounce } from 'underscore';
 import template from './add-widget-dialog.html';
+import './add-widget-dialog.less';
 
 const AddWidgetDialog = {
   template,

diff --git a/client/app/components/dashboards/add-widget-dialog.less b/client/app/components/dashboards/add-widget-dialog.less
@@ -0,0 +1,3 @@
+.word-wrap-break {
+	word-wrap: break-word;
+}
diff --git a/client/app/components/dashboards/edit-text-box.html b/client/app/components/dashboards/edit-text-box.html
@@ -8,7 +8,7 @@ <h4 class="modal-title">Edit TextBox</h4>
   </div>
   <div ng-show="$ctrl.widget.new_text">
     <strong>Preview:</strong>
-    <p ng-bind-html="$ctrl.widget.new_text | markdown"></p>
+    <p ng-bind-html="$ctrl.widget.new_text | markdown" class="word-wrap-break"></p>
   </div>
 </div>
 

diff --git a/client/app/components/dashboards/widget.js b/client/app/components/dashboards/widget.js
@@ -1,6 +1,7 @@
 import template from './widget.html';
 import editTextBoxTemplate from './edit-text-box.html';
 import './widget.less';
+import './add-widget-dialog.less';
 
 const EditTextBoxComponent = {
   template: editTextBoxTemplate,