2 files changed, 35 insertions, 12 deletions
diff --git a/design/templates/accounts/change-settings.html b/design/templates/accounts/change-settings.html
new file mode 100644
index 0000000..a6e6ea6
--- /dev/null
+++ b/design/templates/accounts/change-settings.html
@@ -0,0 +1,33 @@
+{% extends 'base.html' %}
+{% block content %}
+<main class="single-col">
+<h1>Update Your Account Settings</h1>
+<form action="" method="POST" enctype="multipart/form-data">{% csrf_token %}
+    {% for field in form %}
+    <fieldset {% if field.name == 'photo' %}class="file-upload-fieldset"{%endif%}>{% if field.name == 'photo' %}
+        {{field.label_tag}}
+        <div class="flex-wrapper">
+        <div id="file-upload-wrapper" class="file-upload btn">
+            <span>Upload</span>
+            <input type="file" name="photo" class="upload" accept="image/*" id="id_photo">
+        </div>
+        <span id="filename"></span>
+        </div>
+        {% else %}
+        {{field.label_tag}}
+        {{field}}
+        {%endif%}</fieldset>
+    {% endfor %}
+<p><input class="btn btn-inline note-save" value="Save" type="submit" /></p>
+</form>
+</main>
+<script>
+if (typeof(document.getElementById('id_photo')) != 'undefined' && document.getElementById('id_photo') != null) {
+    var input = document.getElementById('id_photo');
+    input.fname = document.getElementById('filename');
+    input.addEventListener('change', function(e){
+        e.target.fname.innerHTML = e.target.value.split("\\")[2];
+    });
+}
+</script>
+{% endblock %}
diff --git a/design/templates/accounts/profile.html b/design/templates/accounts/profile.html
index e8ab65e..4e52da1 100644
--- a/design/templates/accounts/profile.html
+++ b/design/templates/accounts/profile.html
@@ -31,22 +31,12 @@
         <tr>
             <th scope="row">Bio</th>
             <td colspan="2">{{object.bio}}<td>
-            <td class="text-right"><a href="/settings/change-bio/" class="btn">Change</a></td>
+            <td class="text-right"><a href="/settings/change-profile/" class="btn">Change</a></td>
         </tr>
         <tr>
             <th scope="row">Photo</th>
             <td colspan="2">{{object.photo}}<td>
-            <td class="text-right"><a href="/settings/change-photo/" class="btn">Change</a></td>
-        </tr>
-        <tr>
-            <th scope="row">Website</th>
-            <td colspan="2">{{object.website}}<td>
-            <td class="text-right"><a href="/settings/change-website/" class="btn">Change</a></td>
-        </tr>
-        <tr>
-            <th scope="row">Location</th>
-            <td colspan="2">{{object.location}}<td>
-            <td class="text-right"><a href="/settings/change-location/" class="btn">Change</a></td>
+            <td class="text-right"><a href="/settings/change-profile/" class="btn">Change</a></td>
         </tr>
     </tbody>
 </table>