diff --git a/public/assets/css/back/index.css b/public/assets/css/back/index.css
index 6d28bfa..e3b1f0f 100644
--- a/public/assets/css/back/index.css
+++ b/public/assets/css/back/index.css
@@ -1,6 +1,8 @@
 section[role="den-login"] {
-  padding: 30px;
-  width: 300px;
+  width: 100%;
+  max-width: 600px;
+  padding: 10px;
+  margin: 0 auto;
   color: var(--highlight);
 }
 
@@ -12,7 +14,10 @@ section[role="den-login"] div[role="system-notice"] {
 }
 
 section[role="den-index"] {
-  padding: 20px;
+  width: 100%;
+  max-width: 600px;
+  padding: 10px;
+  margin: 0 auto;
   color: var(--white);
 }
 
diff --git a/public/assets/css/back/locations.css b/public/assets/css/back/locations.css
index 65c6132..1995019 100644
--- a/public/assets/css/back/locations.css
+++ b/public/assets/css/back/locations.css
@@ -1,5 +1,8 @@
 section[role="loc-index"] {
-  padding: 20px;
+  width: 100%;
+  max-width: 600px;
+  padding: 10px;
+  margin: 0 auto;
 }
 
 section[role="loc-index"] img {
diff --git a/public/assets/css/back/members.css b/public/assets/css/back/members.css
new file mode 100644
index 0000000..ee53b0d
--- /dev/null
+++ b/public/assets/css/back/members.css
@@ -0,0 +1,7 @@
+section[role="members-index"] {
+  width: 100%;
+  max-width: 600px;
+  padding: 10px;
+  margin: 0 auto;
+  color: var(--white);
+}
diff --git a/public/assets/css/back/start.css b/public/assets/css/back/start.css
index 2c75d82..cfa6f84 100644
--- a/public/assets/css/back/start.css
+++ b/public/assets/css/back/start.css
@@ -4,4 +4,5 @@
 @import "../global/frame.css";
 @import "../global/icons.css";
 @import "locations.css";
+@import "members.css";
 @import "index.css";
diff --git a/public/assets/css/front/about.css b/public/assets/css/front/about.css
index 3b0fd1b..7605ad2 100644
--- a/public/assets/css/front/about.css
+++ b/public/assets/css/front/about.css
@@ -2,7 +2,7 @@ section[role="about"] {
   background: var(--primary);
   width: 100%;
   max-width: 600px;
-  padding: 100px;
+  padding: 10px;
   margin: 0 auto;
   color: var(--white);
 }
diff --git a/public/assets/css/front/listing.css b/public/assets/css/front/listing.css
index b629c8e..a2db055 100644
--- a/public/assets/css/front/listing.css
+++ b/public/assets/css/front/listing.css
@@ -2,8 +2,7 @@ section[role="listings"] {
   background: var(--primary);
   width: 100%;
   max-width: 600px;
-  border-radius: 3px;
-  padding: 100px;
+  padding: 10px;
   margin: 0 auto;
   color: var(--white);
 }
diff --git a/src/Controller/Routes/Back/Members.php b/src/Controller/Routes/Back/Members.php
index 875b9ee..19243ae 100644
--- a/src/Controller/Routes/Back/Members.php
+++ b/src/Controller/Routes/Back/Members.php
@@ -9,58 +9,66 @@ use Symfony\Component\HttpFoundation\Response;
 use Symfony\Component\HttpFoundation\Request;
 use Symfony\Component\Routing\Annotation\Route;
 use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
-use Doctrine\Persistence\ManagerRegistry;
-//use App\Utils\PageRender;
-//use App\Utils\StringTools;
-use App\Service\Auth;
 use App\Service\HandleMembers;
+use App\Service\Render;
+use App\Service\Auth;
 
 class Members extends AbstractController
 {
     /**
-     * @Route("/dashboard/members", name="dash-members")
+     * @Route("/den/members/page/{pageNum}", name="den-locations")
      */
     public function showMembers(
         Request $request,
-        Auth $auth
-    ): Response {
+        Auth $auth,
+        Render $render,
+        HandleMembers $members,
+        int $pageNum = 1
+    ) {
         $result = $auth->status();
         if ($result["status"]) {
-            /*
-            return $render->renderPage(
-                ["bgImage" => "", "mode" => "index"],
-                "The Nile List | Members",
-                "dash/members.html.twig"
-            );
-            */
+            $self = $members->getYou();
+            $you  = $self->getId();
+            $list = $members->getMemberPage($pageNum);
+
+            return $render->page([
+                "mode" => "index",
+                "you"  => $you,
+                "list" => $list], "Bad Space | Members", "back/members.twig");
         } else {
-            //back to index to login
-            header("Location:/knockknock");
-            return new Response("<html><body>LOGGED IN</body></html>");
         }
     }
 
     /**
-     * @Route("/den/members/add", name="members-add")
-     */
-    public function addMembers(
+    * @Route("/den/members/{action}/{id}", name="den-members")
+    */
+    public function handleMemberActions(
         Request $request,
         Auth $auth,
+        Render $render,
         HandleMembers $members,
-        ManagerRegistry $doctrine
+        string $action = "index",
+        int $id = 0
     ): Response {
         $result = $auth->status();
         if ($result["status"]) {
             if ($request->getMethod() == "GET") {
-                return $this->render("back/members.twig", [
-                    "title" => "Get a class from the cupboard",
-                    "mode"  => "add"
-                ]);
+                $self   = $members->getYou();
+                $you    = $self->getId();
+                $member = [];
+                if ($id != 0) {
+                    $member = $members->getMemberById($id);
+                }
+                return $render->page([
+                    "mode"          => $action,
+                    "you"           => $you,
+                    "currentMember" => $member], "Bad Space | Members", "back/members.twig");
             } else {
                 //add new member
-                $token         = $request->get("token");
-                $notice        = "";
-                $entityManager = $doctrine->getManager();
+                $token  = $request->get("token");
+                $notice = "";
+                $mode   = $request->get("mode");
+                $id     = $request->get("member_id");
 
                 //token check
                 if (!$this->isCsrfTokenValid("upload", $token)) {
@@ -74,7 +82,12 @@ class Members extends AbstractController
                         ]
                     );
                 }
-
+                $self   = $members->getYou();
+                $you    = $self->getId();
+                $member = [];
+                if ($id != 0) {
+                    $member = $members->getMemberById($id);
+                }
                 if (
                     $request->request->get("handle") == "" ||
                     $request->request->get("role") == "" ||
@@ -82,48 +95,44 @@ class Members extends AbstractController
                     $request->request->get("email") == "" ||
                     $request->request->get("pronoun") == ""
                 ) {
-                    return new Response("<html><body>All fields required</body></html>");
-
-                    /*
                     $notice = "All fields are required, champ.";
-                    return $render->renderPage(
-                        ["bgImage" => "", "mode" => "add", "notice" => $notice],
-                        "The Nile List | Add Member Error",
-                        "dash/members.html.twig"
-                    );
-                    */
+                    return $render->page([
+                        "notice"        => $notice,
+                        "mode"          => $mode,
+                        "you"           => $you,
+                        "currentMember" => $member], "Bad Space | Members", "back/members.twig");
                 }
-
+                //empty valid email check
                 if (
                     !filter_var($request->request->get("email"), FILTER_VALIDATE_EMAIL)
                 ) {
-                    return new Response("<html><body>BOGUS EMAIL</body></html>");
-
-                    /*
                     $notice = "Need a valid email, slick.";
-                    return $render->renderPage(
-                        ["bgImage" => "", "mode" => "add", "notice" => $notice],
-                        "The Nile List | Add Member Error",
-                        "dash/members.html.twig"
-                    );
-                    */
+                    return $render->page([
+                        "notice"        => $notice,
+                        "mode"          => $mode,
+                        "you"           => $you,
+                        "currentMember" => $member], "Bad Space | Members", "back/members.twig");
+                }
+                // password confirm check
+                if ($request->request->get("new_pass") != "") {
+                    if ($request->request->get("new_pass") != $request->request->get("new_pass_confirm")) {
+                        $notice = "New password must be confirmed";
+                        return $render->page([
+                            "notice"        => $notice,
+                            "mode"          => $mode,
+                            "you"           => $you,
+                            "currentMember" => $member], "Bad Space | Members", "back/members.twig");
+                    }
                 }
 
                 //check clear, call add method
-                $response = $members->addMember($request);
+                $response = $members->modifyMember($request, $id, $mode);
                 if ($response["status"]) {
-                    /*
-                    return $render->renderPage(
-                        [
-                            "bgImage" => "",
-                            "mode"    => "add",
-                            "notice"  => $response["message"],
-                        ],
-                        "The Nile List | Add Members",
-                        "dash/members.html.twig"
-                    );
-                    */
-                    return new Response("<html><body>MEMBER ADDED</body></html>");
+                    return $render->page([
+                        "notice"        => $response["message"],
+                        "mode"          => $mode,
+                        "you"           => $you,
+                        "currentMember" => $member], "Bad Space | Members", "back/members.twig");
                 } else {
                     return new Response("<html><body>" . $response["message"] . "</body></html>");
                     /*
@@ -138,7 +147,7 @@ class Members extends AbstractController
         } else {
             //back to index to login
             header("Location:/den");
-            return new Response("<html><body>LOGGED IN</body></html>");
+            return new Response("<html><body>TO THE FRONT</body></html>");
         }
     }
 }
diff --git a/src/Service/HandleMembers.php b/src/Service/HandleMembers.php
index fbdb70a..e36827f 100644
--- a/src/Service/HandleMembers.php
+++ b/src/Service/HandleMembers.php
@@ -24,6 +24,7 @@ class HandleMembers
 {
     private $session;
     private $entityManager;
+    private $limit = 5;
 
     public function __construct(
         EntityManagerInterface $entityManager,
@@ -38,22 +39,63 @@ class HandleMembers
      *
      * @return MEMBERS data object
      */
-    public function getMember()
+    public function getYou()
     {
         $member = $this->session->get("member");
         return $member;
     }
 
+    public function getMemberById(int $id)
+    {
+        $member = $this->entityManager->getRepository(Member::class)->find($id);
+
+        return $member;
+    }
+
+    public function getMemberPage(int $page, string $active = "all")
+    {
+        $members = $this->entityManager->getRepository(Member::class);
+        if ($active == "true" || $active == "false") {
+            $list = $members->findBy(["active" => $active], ["id" => "ASC"]);
+        } else {
+            $list = $members->findBy([], ["id" => "ASC"]);
+        }
+
+        $count      = ceil(count($list) / $this->limit);
+        $totalCount = count($list);
+
+        $shelf = [];
+        $range = $page * $this->limit - $this->limit;
+        for ($i = 0; $i <= $this->limit; $i++) {
+            try {
+                array_push($shelf, $list[$i + $range]);
+            } catch (Exception $error) {
+            }
+        }
+
+        return [
+            "members"      => $shelf,
+            "total"        => $count,
+            "totalMembers" => $totalCount,
+        ];
+    }
+
     /**
-     * Add new member to db
+     * Add or edit new member
      *
      * @param Request $request object containing posted data
-     * @return JSON
+     * @param int $memberId member identifier
+     * @param string $action request task
+     * @return Object
      */
-    public function addMember($request)
+    public function modifyMember($request, $memberId, $action)
     {
         $errorMessage = null;
-        $member       = new Member();
+        if ($action == "add") {
+            $member = new Member();
+        } else {
+            $member = $this->entityManager->getRepository(Member::class)->find($memberId);
+        }
 
         //submitted values
         $handle = $request->request->get("handle");
@@ -69,15 +111,23 @@ class HandleMembers
 
         //set defaults
         //$utils = new StringTools();
-        $uuid = $hash = password_hash("passw0rd!", PASSWORD_DEFAULT);
-        $member->setPassword($hash);
-        $member->setAvatar("default-member-avatar");
-        $member->setUuid(Uuid::v4());
-        $member->setActive(false);
-        $member->setCreatedAt(new \DateTimeImmutable());
-        $member->setLastLogin(new \DateTimeImmutable());
-
-        $this->entityManager->persist($member);
+        if ($action == "add") {
+            $hash = password_hash("passw0rd!", PASSWORD_DEFAULT);
+            $member->setPassword($hash);
+            $member->setActive(false);
+            $member->setAvatar("default-member-avatar");
+            $member->setUuid(Uuid::v4());
+            $this->entityManager->persist($member);
+            $member->setCreatedAt(new \DateTimeImmutable());
+            $member->setLastLogin(new \DateTimeImmutable());
+        } else {
+            $active = ($request->request->get("active") == "true" ? true : false);
+            $member->setActive($active);
+            if ($request->request->get("new_pass") != "") {
+                $hash = password_hash($request->request->get("new_pass"), PASSWORD_DEFAULT);
+                $member->setPassword($hash);
+            }
+        }
 
         try {
             $this->entityManager->flush();
@@ -93,10 +143,16 @@ class HandleMembers
             $errorMessage = $error->getMessage();
         }
         // return result status
+        $message = "";
+        if ($action == "add") {
+            $message = "New member added. Woohoo!";
+        } else {
+            $message = "Member Info Edited";
+        }
         if ($errorMessage == null) {
             return $response = [
                 "status"  => true,
-                "message" => "New member added. Woohoo!",
+                "message" => $message,
             ];
         } else {
             return $response = ["status" => false, "message" => $errorMessage];
@@ -111,11 +167,10 @@ class HandleMembers
      */
     public function updateMember($request)
     {
-        $errorMessage  = null;
-        $currentMember = $this->getMember();
-        $id            = $currentMember->getMemberId();
-        $member        = $this->entityManager->getRepository(Members::class)->find($id);
-        $image         = $request->files->get("avi");
+        $errorMessage = null;
+        $id           = $request->request->get("member_id");
+        $member       = $this->entityManager->getRepository(Members::class)->find($id);
+        $image        = $request->files->get("avi");
         if (!empty($image)) {
             $name = $image->getClientOriginalName();
             $member->setAvatar($name);
diff --git a/templates/back/members.twig b/templates/back/members.twig
index 602dc7b..1cadaf1 100644
--- a/templates/back/members.twig
+++ b/templates/back/members.twig
@@ -4,9 +4,30 @@
 	{% endblock %}
 
 	{% block main %}
-		<section role="intro">
-			This is the screendoor member page
+		<section role="members-index">
 
-			{{ include("forms/add-member-form.twig") }}
-		</section>
-	{% endblock %}
+			{% if options.mode == "index" %}
+				<h1>Members</h1>
+				<h2>Manage member accounts</h2>
+				<a href="/den/members/edit/{{ options.you }}">Edit Profile</a>
+				|
+				<a href="/den/members/add">Add Members</a>
+				<h3>Current Members</h3>
+				{% for member in options.list.members %}
+					{% if member.role != 1 %}
+						<a href="/den/members/edit/{{ member.id }}">{{ member.handle }}</a>
+						<br>
+						{% endif %}
+
+					{% endfor %}
+				{% elseif options.mode == "add" %}
+					<h1>Add Member</h1>
+					{{ include("forms/add-member-form.twig") }}
+
+				{% elseif options.mode == "edit" %}
+					<h1>Edit Member</h1>
+					{{ include("forms/edit-member.twig") }}
+				{% endif %}
+
+			</section>
+		{% endblock %}
diff --git a/templates/base/frame.twig b/templates/base/frame.twig
index 5030b97..0d83a0a 100644
--- a/templates/base/frame.twig
+++ b/templates/base/frame.twig
@@ -30,7 +30,7 @@
 						<a href="/den" title="den index" role="nav-links">
 							<i class="ti ti-door" title="den index"></i>
 						</a>
-						<a href="/den/members" title="members" role="nav-links">
+						<a href="/den/members/page/1" title="members" role="nav-links">
 							<i class="ti ti-users" title="members"></i>
 						</a>
 						<a href="/den/locations/page/1" title="locations" role="nav-links">
diff --git a/templates/forms/add-member-form.twig b/templates/forms/add-member-form.twig
index d0fc297..36546e8 100644
--- a/templates/forms/add-member-form.twig
+++ b/templates/forms/add-member-form.twig
@@ -1,4 +1,4 @@
-<form action="{{ path('members-add') }}" method="post" enctype="multipart/form-data">
+<form action="{{ path('den-members') }}" method="post" enctype="multipart/form-data">
 	<div>
 		<label>Handle</label><br/>
 		<input type="text" name="handle" value=""/>
@@ -33,4 +33,5 @@
 		</select>
 	</div>
 	<input type="hidden" name="token" value="{{ csrf_token('upload') }}"/>
+	<input type="hidden" name="mode" value="add"/>
 	<input type="submit" value="Add Member" name="submit_button"></form>
diff --git a/templates/forms/edit-member.twig b/templates/forms/edit-member.twig
new file mode 100644
index 0000000..819a9b3
--- /dev/null
+++ b/templates/forms/edit-member.twig
@@ -0,0 +1,80 @@
+<form action="{{ path('den-members') }}" method="post" enctype="multipart/form-data">
+	<div>
+		<label>Handle</label><br/>
+		<input type="text" name="handle" value="{{ options.currentMember.handle }}"/>
+		<br/>
+		<label>Email</label><br/>
+		<input type="text" name="email" value="{{ options.currentMember.email }}"/>
+		<br/>
+		<label>New Password</label><br/>
+		<input type="password" name="new_pass" value=""/>
+		<br/>
+		<label>New Password Confirm</label><br/>
+		<input type="password" name="new_pass_confirm" value=""/>
+		<br/>
+		<label>Gender</label><br/>
+		<select name="gender">
+			{% if options.currentMember.gender is same as ("non_binary") %}
+				<option value="man">Man</option>
+				<option value="woman">Woman</option>
+				<option value="non_binary" selected>Non-Binary</option>
+			{% elseif options.currentMember.gender is same as ("woman") %}
+				<option value="man">Man</option>
+				<option value="woman" selected>Woman</option>
+				<option value="non_binary">Non-Binary</option>
+			{% elseif options.currentMember.gender is same as ("man") %}
+				<option value="man" selected>Man</option>
+				<option value="woman">Woman</option>
+				<option value="non_binary">Non-Binary</option>
+			{% endif %}
+		</select>
+		<br/>
+		<label>Pronoun</label><br/>
+		<select name="pronoun">
+			{% if options.currentMember.pronoun is same as ("they/them") %}
+				<option value="they/them" selected>They/Them</option>
+				<option value="she/her">She/Her</option>
+				<option value="he/him">He/Him</option>
+			{% elseif options.currentMember.pronoun is same as ("she/her") %}
+				<option value="they/them">They/Them</option>
+				<option value="she/her" selected>She/Her</option>
+				<option value="he/him">He/Him</option>
+			{% elseif options.currentMember.pronoun is same as ("he/him") %}
+				<option value="they/them">They/Them</option>
+				<option value="she/her">She/Her</option>
+				<option value="he/him" selected>He/Him</option>
+			{% endif %}
+
+		</select>
+		<br/>
+		<label>Active?</label><br/>
+		<select name="active">
+			{% if options.currentMember.active %}
+				<option value="false">No</option>
+				<option value="true" selected>Yes</option>
+			{% else %}
+				<option value="false" selected>No</option>
+				<option value="true">Yes</option>
+			{% endif %}
+		</select><br/>
+		<label>Role</label><br/>
+		<select name="role">
+			{% if options.currentMember.role is same as (1) %}
+				<option value="1" selected>Admin</option>
+				<option value="2">Editor</option>
+				<option value="3">Contributer</option>
+			{% elseif options.currentMember.role is same as (2) %}
+				<option value="1">Admin</option>
+				<option value="2" selected>Editor</option>
+				<option value="3">Contributer</option>
+			{% elseif options.currentMember.role is same as (3) %}
+				<option value="1">Admin</option>
+				<option value="2">Editor</option>
+				<option value="3" selected>Contributer</option>
+			{% endif %}
+		</select>
+	</div>
+	<input type="hidden" name="token" value="{{ csrf_token('upload') }}"/>
+	<input type="hidden" name="member_id" value="{{ options.currentMember.id }}"/>
+	<input type="hidden" name="mode" value="edit"/>
+	<input type="submit" value="Edit Member" name="submit_button"></form>
diff --git a/templates/front/about.twig b/templates/front/about.twig
index e889b42..96cc4f8 100644
--- a/templates/front/about.twig
+++ b/templates/front/about.twig
@@ -5,14 +5,20 @@
 
 	{% block main %}
 		<section role="about">
-			<h1>About The Bad Space</h1>
-			<p>The Bad Space project was born from a need to effectively identify instances that house bad actors and are poorly moderated, which puts marginalized communities at risk. It is an extension of the
-				<strong>#fediblock</strong>
-				hashtag created
-				<a href="https://www.artistmarciax.com/">by Arist Maricia X
-				</a>with additional support from
-				<a href="https://digital.rooting.garden">Ginger</a>
-				to provide a catolog of instances seek to cause harm and reduce the quality of experience in the fediverse.
+			<h1>About</h1>
+
+			<h2>What is The Bad Space?</h2>
+			<p>The Bad Space project was born from a need to effectively identify instances that house bad actors and are poorly moderated, which puts marginalized communities at risk.
+				<p>
+					It is an extension of the
+					<strong>#fediblock</strong>
+					hashtag created by
+					<a href="https://www.artistmarciax.com/">Artist Marcia X</a>
+					with additional support from
+					<a href="https://digital.rooting.garden">Ginger</a>
+					to provide a catolog of instances seek to cause harm and reduce the quality of experience in the fediverse.
+				</p>
+
 			</p>