allows messages to users to be formatted #477

web/static/css/app.css

@@ -200,3 +200,7 @@ body {
 .admin-msg-mt {
   margin-top: 51px;
 }
+
+.mce-notification.mce-in {
+  display: none;
+}

web/templates/messages/new.html.eex

@@ -1,3 +1,14 @@
+<script src="https://cloud.tinymce.com/stable/tinymce.min.js"></script>
+<script>
+  tinymce.init({
+    selector: "#message-text",
+    plugins: "link",
+    menubar: false,
+    statusbar: false,
+    indentation: "0"
+  });
+</script>
+
 <%= component("admin_message_nav", [conn: @conn]) %>
 <div id="msg-div" class="mt4 pt5 w-80 center">
   <p >Compose your message</p>
@@ -7,7 +18,7 @@
     <%= text_input f, :subject, class: "w-100 mv2 pa2 w5 ba br2 b--black-20"  %>
     <label class="red"><%= error_tag f, :subject %></label>
     <p>Compose Message:</p>
-    <%= textarea f, :body, rows: 15, class: "w-100 mv2 pa2 w5 ba br2 b--black-20" %>
+    <%= textarea f, :body, rows: 15, id: "message-text", class: "w-100 mv2 pa2 w5 ba br2 b--black-20" %>
     <label class="red"><%= error_tag f, :body %></label>
     <%= checkbox f, :to_all, value: @to_all, hidden: true %>
     <%= checkbox f, :confirm, value: false, hidden: true %>

web/templates/messages/view.html.eex

@@ -15,7 +15,7 @@
         <p class="bep-gray mt0 mb1 f7"><%= message.from %></p>
         <div style="color:<%= message.colour %>;" class="ba mb2 pa2 tc mb3 bw1 br2">
           <p class="b tl black"><%= message.subject %></p>
-          <p class="tl black"><%= message.body %></p>
+          <div class="tl black"><%= raw message.body %></div>
         </div>
       <% end %>
     </div>