beauty enhancements

app/templates/profile/settings.html.j2

@@ -16,31 +16,26 @@
             <p class="light">Activate dark mode to ease your eyes.</p>
           </div>
           <div class="col s3 right-align">
-            <div class="switch">
-              <label>
-                {{ edit_general_settings_form.dark_mode() }}
-                <span class="lever"></span>
-              </label>
-            </div>
+            {{ M.render_field(edit_general_settings_form.dark_mode, label=False) }}
           </div>
           <div class="col s12"><p>&nbsp;</p></div>
           <div class="col s12 divider"></div>
           <div class="col s12"><p>&nbsp;</p></div>
-          <div class="col s9">
+          <div class="col s12 m8">
             <p><i class="material-icons left">notifications</i>Job status site notifications</p>
             <p class="light">Receive site notifications about job status changes.</p>
           </div>
-          <div class="col s3 right-align">
+          <div class="col s12 m4 right-align">
             {{ M.render_field(edit_general_settings_form.job_status_site_notifications, label=False) }}
           </div>
           <div class="col s12"><p>&nbsp;</p></div>
           <div class="col s12 divider"></div>
           <div class="col s12"><p>&nbsp;</p></div>
-          <div class="col s9">
+          <div class="col s12 m8">
             <p><i class="material-icons left">notifications</i>Job status mail notifications</p>
             <p class="light">Receive mail notifications about job status changes.</p>
           </div>
-          <div class="col s3 right-align">
+          <div class="col s12 m4 right-align">
             {{ M.render_field(edit_general_settings_form.job_status_mail_notifications, label=False) }}
           </div>
           <!--