Redesign the website for admin

DiscoverCCRI · Nov 13, 2024 · 9796c36 · 9796c36
1 parent cb1851c
commit 9796c36
Show file tree

Hide file tree

Showing 4 changed files with 53 additions and 32 deletions.
diff --git a/base/static/css/navbar.css b/base/static/css/navbar.css
@@ -18,6 +18,11 @@
   font-size: 1.2rem;
 }
 
+/* Show the dropdown menu on hover */
+.nav-item.dropdown:hover .dropdown-menu {
+  display: block;
+}
+
 .dropdown-menu {
   background-color: #326bb3;
 }

diff --git a/templates/base/navbar.html b/templates/base/navbar.html
@@ -33,11 +33,11 @@
                                 <a class="dropdown-item"
                                    style="color:black;
                                           font-family: bold"
-                                   href="{% url 'project_requests' %}">Project Requests</a>
+                                   href="{% url 'projects' %}">All Projects</a>
                                 <a class="dropdown-item"
                                    style="color:black;
                                           font-family: bold"
-                                   href="{% url 'projects' %}">Project List</a>
+                                   href="{% url 'project_requests' %}">Manage Requests</a>
                             </div>
                         {% else %}
                             <a class="nav-link" style="color:black;" href="{% url 'projects' %}">Projects</a>
@@ -80,11 +80,11 @@
                             <a class="dropdown-item"
                                style="color:black;
                                       font-family: bold"
-                               href="{% url 'user_requests' %}">Role Requests</a>
+                               href="{% url 'user_groups' %}">All User Roles</a>
                             <a class="dropdown-item"
                                style="color:black;
                                       font-family: bold"
-                               href="{% url 'user_groups' %}">All User Roles</a>
+                               href="{% url 'user_requests' %}">Role Requests</a>
                         </div>
                     </li>
                 {% endif %}
@@ -132,4 +132,16 @@
         {% endif %}
     </div>
 </nav>
+
+<script>
+    $(document).ready(function () {
+        $('.dropdown').hover(function () {
+            $(this).addClass('show');
+            $(this).find('.dropdown-menu').addClass('show');
+        }, function () {
+            $(this).removeClass('show');
+            $(this).find('.dropdown-menu').removeClass('show');
+        });
+    });
+</script>
 <!-- <div style="background-image: linear-gradient(90deg,#1CB5E0,#0d0d77);  width: 100%; height: 0.5rem;"></div> -->
diff --git a/templates/projects/projects.html b/templates/projects/projects.html
@@ -24,13 +24,15 @@ <h2>Projects</h2>
                 </div>
                 <h3 style="padding-top: 3rem;">My Projects</h3>
                 <table class="table table-striped table-bordered mt-4">
-                    <tr>
-                        <th>Name</th>
-                        <th>Description</th>
-                        <th>Created By</th>
-                        <th>Created Date</th>
-                        <th>Last Modified</th>
-                    </tr>
+                    <thread class="thread-light">
+                        <tr>
+                            <th>Name</th>
+                            <th>Description</th>
+                            <th>Created By</th>
+                            <th>Created Date</th>
+                            <th>Last Modified</th>
+                        </tr>
+                    </thread>
                     {% for project in my_projects %}
                         <tr>
                             <td>
@@ -45,13 +47,15 @@ <h3 style="padding-top: 3rem;">My Projects</h3>
                 </table>
                 <h3>Public Projects</h3>
                 <table class="table table-striped table-bordered mt-4">
-                    <tr>
-                        <th>Name</th>
-                        <th>Description</th>
-                        <th>Created By</th>
-                        <th>Created Date</th>
-                        <th>Last Modified</th>
-                    </tr>
+                    <thead class="thead-dark">
+                        <tr>
+                            <th>Name</th>
+                            <th>Description</th>
+                            <th>Created By</th>
+                            <th>Created Date</th>
+                            <th>Last Modified</th>
+                        </tr>
+                    </thead>
                     {% for project in other_projects %}
                         {% if project.is_public %}
                             <tr>

diff --git a/templates/schedule/schedule.html b/templates/schedule/schedule.html
@@ -11,20 +11,7 @@ <h2 style="display: inline-block; position: absolute;">Experiments Schedule Mana
             </p>
         </div>
 
-        <div class="filter-container" style="display: flex; justify-content: space-between; margin-bottom: 20px;">
-            <div class="site-filter" style="flex: 1; margin-right: 10px; text-align: center;">
-                <h2>Filter By Your Site</h2>
-                <form method="post" action="{% url 'site_filter' %}">
-                    {% csrf_token %}
-                    <div>
-                        {{ location_form.location }}  <!-- Use location form -->
-                        <button class="btn btn-primary" style="margin-left: 10px;" type="submit">
-                            <i class="bi bi-filter"></i>
-                        </button>
-                    </div>
-                </form>
-            </div>
-
+        <div class="filter-container container mt-3" style="display: flex; justify-content: space-between; margin-bottom: 20px;">
             <div class="exp-search" style="flex: 1; text-align: center; margin-left: 10px;">  <!-- Add margin-left to maintain spacing -->
                 <h2>Search For An Experiment</h2>
                 <form method="post" action="{% url 'search_experiments' %}">
@@ -37,6 +24,19 @@ <h2>Search For An Experiment</h2>
                     </div>
                 </form>
             </div>
+
+            <div class="site-filter" style="flex: 1; margin-right: 10px; text-align: center;">
+                <h2>Filter By Your Site</h2>
+                <form method="post" action="{% url 'site_filter' %}">
+                    {% csrf_token %}
+                    <div>
+                        {{ location_form.location }}  <!-- Use location form -->
+                        <button class="btn btn-primary" style="margin-left: 10px;" type="submit">
+                            <i class="bi bi-filter"></i>
+                        </button>
+                    </div>
+                </form>
+            </div>
         </div>