diff --git a/message/templates/message_preferences.mustache b/message/templates/message_preferences.mustache
index ebe1c40840c..c630a82cdd9 100644
--- a/message/templates/message_preferences.mustache
+++ b/message/templates/message_preferences.mustache
@@ -101,7 +101,7 @@
     <div class="preferences-container {{#disableall}}disabled{{/disableall}}"
         data-user-id="{{userid}}"
         data-region="preferences-container">
-        <table class="table table-hover preference-table" data-region="preference-table">
+        <table class="table preference-table" data-region="preference-table">
             <tbody>
                 {{#components}}
                     {{> message/message_preferences_component }}
diff --git a/message/templates/message_preferences_notification_processor.mustache b/message/templates/message_preferences_notification_processor.mustache
index 927e5e287aa..dec06ee4cd0 100644
--- a/message/templates/message_preferences_notification_processor.mustache
+++ b/message/templates/message_preferences_notification_processor.mustache
@@ -20,17 +20,15 @@
     The message preferences page
 
     Classes required for JS:
-    * None
+    * disabled
 
-    Data attibutes required for JS:
+    Data attributes required for JS:
     * All data attributes are required
 
     Context variables required for this template:
-    * displayname   The display name of the processor
-    * name          The name of the processor
-    * locked        Whether the processor is locked
-    * loggedin      The logged in settings
-    * loggedoff     The logged off settings
+    * displayname   The notification display name
+    * preferencekey The unique key to identify this preference
+    * processors    The list of processors for this notification
 
     Example context (json):
     {
@@ -45,83 +43,16 @@
                 "loggedin": {
                     "name": "loggedin",
                     "displayname": "When I'm logged in",
-                    "checked": 0,
-                    "disableall": 0
+                    "checked": 0
                 },
                 "loggedoff": {
                     "name": "loggedoff",
                     "displayname": "When I'm offline",
-                    "checked": 0,
-                    "disableall": 0
+                    "checked": 0
                 }
             }
         ]
     }
 }}
-<tr class="preference-row" data-region="preference-row" data-preference-key="{{preferencekey}}">
-    <td class="preference-name">{{displayname}}</td>
-    <td {{^userconfigured}}class="disabled"{{/userconfigured}} data-processor-name="{{name}}">
-        {{#locked}}
-            <div class="dimmed_text">{{lockedmessage}}</div>
-        {{/locked}}
-        {{^locked}}
-            <div class="disabled-message">{{#str}} disabled, question {{/str}}</div>
-            <form>
-                <div class="container-fluid">
-                    <div class="row">
-                        <div class="span6 col-6">
-                            {{#loggedin}}
-                                {{< core/hover_tooltip }}
-                                    {{$anchor}}
-                                        <label class="preference-state"
-                                            title="{{displayname}}"
-                                            data-state="{{name}}">
 
-                                            <span class="accesshide">{{displayname}}</span>
-                                            <input type="checkbox"
-                                                tabindex="-1"
-                                                class="accesshide"
-                                                {{#checked}}checked{{/checked}}
-                                                {{#disableall}}disabled{{/disableall}} />
-                                            <div class="preference-state-status-container" tabindex="0">
-                                                <span class="on-text">{{#str}} on, message {{/str}}</span>
-                                                <span class="off-text">{{#str}} off, message {{/str}}</span>
-                                                {{> core/loading }}
-                                            </div>
-                                        </label>
-                                    {{/anchor}}
-                                    {{$tooltip}}{{displayname}}{{/tooltip}}
-                                {{/ core/hover_tooltip }}
-                            {{/loggedin}}
-                        </div>
-                        <div class="span6 col-6">
-                            {{#loggedoff}}
-                                {{< core/hover_tooltip }}
-                                    {{$anchor}}
-                                        <label class="preference-state"
-                                            title="{{displayname}}"
-                                            data-state="{{name}}">
-
-                                            <span class="accesshide">{{displayname}}</span>
-                                            <input type="checkbox"
-                                                tabindex="-1"
-                                                class="accesshide"
-                                                {{#checked}}checked{{/checked}}
-                                                {{#disableall}}disabled{{/disableall}} />
-                                            <div class="preference-state-status-container" tabindex="0">
-                                                <span class="on-text">{{#str}} on, message {{/str}}</span>
-                                                <span class="off-text">{{#str}} off, message {{/str}}</span>
-                                                {{> core/loading }}
-                                            </div>
-                                        </label>
-                                    {{/anchor}}
-                                    {{$tooltip}}{{displayname}}{{/tooltip}}
-                                {{/ core/hover_tooltip }}
-                            {{/loggedoff}}
-                        </div>
-                    </div>
-                </div>
-            </form>
-        {{/locked}}
-    </td>
-</tr>
+{{> core_message/notification_preferences_component_notification }}
diff --git a/message/templates/notification_preferences_component_notification.mustache b/message/templates/notification_preferences_component_notification.mustache
index d709c69556b..c120b68b76e 100644
--- a/message/templates/notification_preferences_component_notification.mustache
+++ b/message/templates/notification_preferences_component_notification.mustache
@@ -22,7 +22,7 @@
     Classes required for JS:
     * disabled
 
-    Data attibutes required for JS:
+    Data attributes required for JS:
     * All data attributes are required
 
     Context variables required for this template:
@@ -39,17 +39,16 @@
                 "displayname": "Popup notification",
                 "name": "popup",
                 "locked": 0,
+                "userconfigured": 1,
                 "loggedin": {
                     "name": "loggedin",
                     "displayname": "When I'm logged in",
-                    "checked": 0,
-                    "iconurl": "some url"
+                    "checked": 0
                 },
                 "loggedoff": {
                     "name": "loggedoff",
                     "displayname": "When I'm offline",
-                    "checked": 0,
-                    "iconurl": "some url"
+                    "checked": 0
                 }
             }
         ]
@@ -63,7 +62,7 @@
                 <div class="dimmed_text">{{lockedmessage}}</div>
             {{/locked}}
             {{^locked}}
-                <div class="disabled-message">{{#str}} disabled, question {{/str}}</div>
+                <div class="disabled-message">{{#str}} disabled, admin {{/str}}</div>
                 <form>
                     <div class="container-fluid">
                         <div class="row">
diff --git a/theme/boost/scss/moodle/message.scss b/theme/boost/scss/moodle/message.scss
index 6c95150857a..1b89e6ed71f 100644
--- a/theme/boost/scss/moodle/message.scss
+++ b/theme/boost/scss/moodle/message.scss
@@ -74,61 +74,6 @@
                 height: 30px;
                 line-height: 30px;
             }
-            .preference-state {
-                margin: 0;
-                padding: 0;
-                display: inline-block;
-                vertical-align: middle;
-
-                input[type="checkbox"]:checked + .preference-state-status-container {
-                    background-color: #5cb85c;
-
-                    .on-text {
-                        display: inline-block;
-                    }
-                    .off-text {
-                        display: none;
-                    }
-                }
-                .preference-state-status-container {
-                    width: 30px;
-                    height: 30px;
-                    line-height: 30px;
-                    text-align: center;
-                    border-radius: 4px;
-                    background-color: #d9534f;
-                    color: #fff;
-                    cursor: pointer;
-
-                    .loading-icon {
-                        display: none;
-                    }
-                    .on-text {
-                        display: none;
-                    }
-                    .off-text {
-                        display: inline-block;
-                    }
-                }
-                &.loading {
-                    input[type="checkbox"]:checked + .preference-state-status-container {
-                        .on-text,
-                        .off-text {
-                            display: none;
-                        }
-                    }
-
-                    .preference-state-status-container {
-                        .on-text,
-                        .off-text {
-                            display: none;
-                        }
-                        .loading-icon {
-                            display: block;
-                        }
-                    }
-                }
-            }
             &.loading {
                 .preference-name {
                     .loading-icon {
diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css
index 7f6541648cb..1260108ebb7 100644
--- a/theme/boost/style/moodle.css
+++ b/theme/boost/style/moodle.css
@@ -15110,40 +15110,6 @@ a.ygtvspacer:hover {
     text-align: center;
     height: 30px;
     line-height: 30px; }
-  .preferences-container .preference-table .preference-row .preference-state {
-    margin: 0;
-    padding: 0;
-    display: inline-block;
-    vertical-align: middle; }
-    .preferences-container .preference-table .preference-row .preference-state input[type="checkbox"]:checked + .preference-state-status-container {
-      background-color: #5cb85c; }
-      .preferences-container .preference-table .preference-row .preference-state input[type="checkbox"]:checked + .preference-state-status-container .on-text {
-        display: inline-block; }
-      .preferences-container .preference-table .preference-row .preference-state input[type="checkbox"]:checked + .preference-state-status-container .off-text {
-        display: none; }
-    .preferences-container .preference-table .preference-row .preference-state .preference-state-status-container {
-      width: 30px;
-      height: 30px;
-      line-height: 30px;
-      text-align: center;
-      border-radius: 4px;
-      background-color: #d9534f;
-      color: #fff;
-      cursor: pointer; }
-      .preferences-container .preference-table .preference-row .preference-state .preference-state-status-container .loading-icon {
-        display: none; }
-      .preferences-container .preference-table .preference-row .preference-state .preference-state-status-container .on-text {
-        display: none; }
-      .preferences-container .preference-table .preference-row .preference-state .preference-state-status-container .off-text {
-        display: inline-block; }
-    .preferences-container .preference-table .preference-row .preference-state.loading input[type="checkbox"]:checked + .preference-state-status-container .on-text,
-    .preferences-container .preference-table .preference-row .preference-state.loading input[type="checkbox"]:checked + .preference-state-status-container .off-text {
-      display: none; }
-    .preferences-container .preference-table .preference-row .preference-state.loading .preference-state-status-container .on-text,
-    .preferences-container .preference-table .preference-row .preference-state.loading .preference-state-status-container .off-text {
-      display: none; }
-    .preferences-container .preference-table .preference-row .preference-state.loading .preference-state-status-container .loading-icon {
-      display: block; }
   .preferences-container .preference-table .preference-row.loading .preference-name .loading-icon {
     display: block; }
 
diff --git a/theme/classic/style/moodle.css b/theme/classic/style/moodle.css
index 90ef92341ec..82ebe6ae5e8 100644
--- a/theme/classic/style/moodle.css
+++ b/theme/classic/style/moodle.css
@@ -15334,40 +15334,6 @@ a.ygtvspacer:hover {
     text-align: center;
     height: 30px;
     line-height: 30px; }
-  .preferences-container .preference-table .preference-row .preference-state {
-    margin: 0;
-    padding: 0;
-    display: inline-block;
-    vertical-align: middle; }
-    .preferences-container .preference-table .preference-row .preference-state input[type="checkbox"]:checked + .preference-state-status-container {
-      background-color: #5cb85c; }
-      .preferences-container .preference-table .preference-row .preference-state input[type="checkbox"]:checked + .preference-state-status-container .on-text {
-        display: inline-block; }
-      .preferences-container .preference-table .preference-row .preference-state input[type="checkbox"]:checked + .preference-state-status-container .off-text {
-        display: none; }
-    .preferences-container .preference-table .preference-row .preference-state .preference-state-status-container {
-      width: 30px;
-      height: 30px;
-      line-height: 30px;
-      text-align: center;
-      border-radius: 4px;
-      background-color: #d9534f;
-      color: #fff;
-      cursor: pointer; }
-      .preferences-container .preference-table .preference-row .preference-state .preference-state-status-container .loading-icon {
-        display: none; }
-      .preferences-container .preference-table .preference-row .preference-state .preference-state-status-container .on-text {
-        display: none; }
-      .preferences-container .preference-table .preference-row .preference-state .preference-state-status-container .off-text {
-        display: inline-block; }
-    .preferences-container .preference-table .preference-row .preference-state.loading input[type="checkbox"]:checked + .preference-state-status-container .on-text,
-    .preferences-container .preference-table .preference-row .preference-state.loading input[type="checkbox"]:checked + .preference-state-status-container .off-text {
-      display: none; }
-    .preferences-container .preference-table .preference-row .preference-state.loading .preference-state-status-container .on-text,
-    .preferences-container .preference-table .preference-row .preference-state.loading .preference-state-status-container .off-text {
-      display: none; }
-    .preferences-container .preference-table .preference-row .preference-state.loading .preference-state-status-container .loading-icon {
-      display: block; }
   .preferences-container .preference-table .preference-row.loading .preference-name .loading-icon {
     display: block; }