Add sidebar

testpress · Dec 13, 2024 · da0763e · da0763e
1 parent f18a36b
commit da0763e
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 24 deletions.
diff --git a/src/_includes/layouts/tpstreams/full_page_layout.html b/src/_includes/layouts/tpstreams/full_page_layout.html
@@ -1,28 +1,14 @@
 {% extends "layouts/tpstreams/base.html" %}
 
 {% block html_class %}h-full bg-white{% endblock html_class %}
-{% block body_class %}h-full{% endblock body_class %}
 
 {% block content %}
-  <div>
-    <nav class="bg-white shadow-sm">
-      <div class="max-w-7xl mx-auto px-4 sm:px-6 sm:px-6 lg:px-0">
-        <div class="relative flex h-16 justify-between">
-          <div class="flex flex-1 items-center justify-start">
-            <div class="flex flex-shrink-0 items-center">
-              <img class="h-8 w-auto" src="{{ '/img/streams_logo.svg'| url }}" alt="TpStreams">
-            </div>
-          </div>
-          <div class="flex flex-1 gap-x-4 self-stretch lg:gap-x-6 justify-end">
-            {% include "partials/tpstreams/profile_dropdown.html" %}
-          </div>
-        </div>
-      </div>
-    </nav>
-    <div class="lg:px-8">
-      <div class="mx-auto flex flex-col max-w-7xl 2xl:max-w-screen-2xl">
+  <div x-data="{open: false}" @keydown.window.escape="open = false">
+    {% include "partials/tpstreams/sidebar.html" %}
+    <div class="lg:pl-64 lg:px-8 bg-white">
+      <div class="mx-auto flex flex-col max-w-5xl 2xl:max-w-screen-2xl">
         <main class="py-5 sm:py-10 relative">
-          <div class="mx-auto max-w-7xl 2xl:max-w-screen-2xl sm:px-6 lg:px-0">
+          <div class="mx-auto max-w-7xl 2xl:max-w-screen-2xl px-4 sm:px-6 lg:px-8">
             {% block main_content %}
             {% endblock main_content %}
           </div>

diff --git a/src/tpstreams/roles/detail.html b/src/tpstreams/roles/detail.html
@@ -8,15 +8,15 @@
 
 {% block html_class %}h-full bg-gray-100{% endblock html_class %}
 
-{% block body_class %}overflow-y-scroll min-h-screen bg-gray-100{% endblock %}
+{% block body_class %}overflow-y-scroll min-h-screen bg-white{% endblock %}
 
 {% block main_content %}
 <div x-data="roleDetailData">
   {% include "./includes/alert.html" %}
   <div class="max-w-7xl mx-auto">
     {% include './includes/detail_header.html' %}
     <main class="pt-8">
-      <div class="px-4 sm:px-6 lg:px-8 pb-6 bg-white border-b border-gray-200 shadow sm:rounded-lg">
+      <div class="px-4 sm:px-6 lg:px-8 pb-6 bg-white border-b border-t border-gray-200 shadow sm:rounded-lg">
         <div class="xl:grid xl:grid-cols-3">
           {% include "./includes/permission_table.html" %}
           {% include "./includes/assign_role_users.html" %}

diff --git a/src/tpstreams/roles/includes/detail_header.html b/src/tpstreams/roles/includes/detail_header.html
@@ -18,7 +18,7 @@
       </ol>
     </nav>
     <h2 class="mt-2 text-2xl font-bold leading-7 text-gray-900 sm:truncate sm:text-3xl sm:tracking-tight">
-      <input x-cloak x-show="editRole" type="text" name="role_name" id="roleNameInput" class="rounded block w-full border-0 border-transparent focus:ring-0 bg-white" x-model="editedRoleName">
+      <input x-cloak x-show="editRole" type="text" name="role_name" id="roleNameInput" class="rounded block w-full border-0 border-transparent focus:ring-0 bg-gray-200" x-model="editedRoleName">
       <span x-cloak x-show="!editRole" x-text="roleName"></span>
     </h2>
     <div class="mt-1 flex flex-col sm:mt-0 sm:flex-row sm:flex-wrap sm:space-x-6">

diff --git a/src/tpstreams/roles/index.html b/src/tpstreams/roles/index.html
@@ -7,13 +7,13 @@
 
 {% extends "layouts/tpstreams/full_page_layout.html" %}
 
-{% block body_class %}overflow-y-scroll min-h-screen bg-gray-100{% endblock %}
+{% block body_class %}overflow-y-scroll min-h-screen bg-white{% endblock %}
 
 {% block main_content %}
   <div class="max-w-7xl mx-auto" x-data="rolesListData">
     {% include './includes/roles_list_header.html' %}
     <main class="pt-8">
-      <div class="px-4 sm:px-6 lg:px-8 pb-6 bg-white border-b border-gray-200 shadow sm:rounded-lg">
+      <div class="px-4 sm:px-6 lg:px-8 pb-6 bg-white border-b border-t border-gray-200 shadow sm:rounded-lg">
         {% if roles_list.length > 0 %}
           {% include './includes/roles_list_inner.html' %}
         {% else %}