diff --git a/app/static/js/App.js b/app/static/js/App.js index 6d54a7a5357a879fb6d2ac0437d12c20688c0499..0741592d10d5aae5574a82f0df43eb7be3250ddb 100644 --- a/app/static/js/App.js +++ b/app/static/js/App.js @@ -60,6 +60,10 @@ class App { iconPrefix = '<i class="left nopaque-icons">J</i>'; break; } + case 'settings': { + iconPrefix = '<i class="left material-icons">settings</i>'; + break; + } default: { iconPrefix = '<i class="left material-icons">notifications</i>'; break; diff --git a/app/templates/admin/user_settings.html.j2 b/app/templates/admin/user_settings.html.j2 index 527e96d2dd255d725336c79ae043c9a2d128643b..48391a71cc293a42a42dc0f7b05740b06679baaf 100644 --- a/app/templates/admin/user_settings.html.j2 +++ b/app/templates/admin/user_settings.html.j2 @@ -19,25 +19,18 @@ <i class="caret material-icons">keyboard_arrow_right</i> </div> <div class="collapsible-body"> - <div class="row"> - <div class="col s12 l1"> - <p><i class="material-icons">check</i></p> - </div> - <div class="col s12 l7"> - <p> - Confirmed<br> - <span class="light">Change confirmation status manually.</span> - </p> - </div> - <div class="col s3 l4"> - <div class="switch"> - <label> - unconfirmed - <input {% if user.confirmed %}checked{% endif %} id="user-confirmed-switch" type="checkbox"> - <span class="lever"></span> - confirmed - </label> - </div> + <div style="overflow: auto;"> + <p class="left"><i class="material-icons">check</i></p> + <p class="left" style="margin-left: 10px;"> + Confirmed<br> + <span class="light">Change confirmation status manually.</span> + </p> + <br class="hide-on-med-and-down"> + <div class="switch right"> + <label> + <input {% if user.confirmed %}checked{% endif %} id="user-confirmed-switch" type="checkbox"> + <span class="lever"></span> + </label> </div> </div> </div> diff --git a/app/templates/users/settings/settings.html.j2 b/app/templates/users/settings/settings.html.j2 index f862840dfe3f311dcfbe22c9895393f1624753cd..3f028e7a7048181e452a47f26e3ccb1f7105a4ca 100644 --- a/app/templates/users/settings/settings.html.j2 +++ b/app/templates/users/settings/settings.html.j2 @@ -20,21 +20,32 @@ <ul class="collapsible no-autoinit settings-collapsible"> <li> <div class="collapsible-header" style="justify-content: space-between;"> - <span>Profile Privacy</span> + <span>Privacy</span> <i class="material-icons caret">keyboard_arrow_right</i> </div> <div class="collapsible-body"> - <div class="row"> - <div class="col s12 l3"> - <div class="switch"> - <label> - private - <input {% if user.is_public %}checked{% endif %} id="profile-is-public-switch" type="checkbox"> - <span class="lever"></span> - public - </label> - </div> + <div style="overflow: auto;"> + <p class="left"><i class="material-icons">public</i></p> + <p class="left" style="margin-left: 10px;"> + Public status<br> + <span class="light">Choose whether your profile is visible to other users.</span> + </p> + <br class="hide-on-med-and-down"> + <div class="switch right"> + <label> + <input {% if user.is_public %}checked{% endif %} id="profile-is-public-switch" type="checkbox"> + <span class="lever"></span> + </label> </div> + </div> + <div style="overflow: auto;"> + <p class="left"><i class="material-icons">badge</i></p> + <p class="left" style="margin-left: 10px;"> + Public data<br> + <span class="light">Choose which data is visible on your profile.</span> + </p> + </div> + <div class="row" style="margin-left: 24px;"> <div class="col s12 l3"> <label> <input {% if user.has_profile_privacy_setting('SHOW_EMAIL') %}checked{% endif %} class="profile-privacy-setting-checkbox" data-profile-privacy-setting-name="SHOW_EMAIL" {% if not user.is_public %}disabled{% endif %} type="checkbox"> @@ -58,7 +69,7 @@ </li> <li> <div class="collapsible-header" style="justify-content: space-between;"> - <span>Profile information</span> + <span>Information</span> <i class="material-icons caret">keyboard_arrow_right</i> </div> <div class="collapsible-body">