From 4b28e9d31c6ef1a030f19f34a92b379c7aa07113 Mon Sep 17 00:00:00 2001
From: slhmy <1484836413@qq.com>
Date: Tue, 26 Sep 2023 16:25:26 +0800
Subject: [PATCH] Adjust pages

---
 src/layouts/adminLayout/Sidebar.tsx | 31 ++++++++---------------------
 src/layouts/userLayout/Header.tsx   | 28 +++++++++++++++-----------
 2 files changed, 24 insertions(+), 35 deletions(-)

diff --git a/src/layouts/adminLayout/Sidebar.tsx b/src/layouts/adminLayout/Sidebar.tsx
index c5873efd8..b3ef29028 100644
--- a/src/layouts/adminLayout/Sidebar.tsx
+++ b/src/layouts/adminLayout/Sidebar.tsx
@@ -2,7 +2,6 @@ import { Fragment, useState } from "react";
 import { Dialog, Menu, Transition } from "@headlessui/react";
 import {
   Bars3Icon,
-  BellIcon,
   HomeIcon,
   UsersIcon,
   XMarkIcon,
@@ -19,7 +18,7 @@ const user = {
   imageUrl: "./avatars/male-avatar-1.svg",
 };
 const userNavigation = [
-  { name: "Your profile", href: "#" },
+  { name: "Main Page", href: "/problem" },
   { name: "Sign out", href: "#" },
 ];
 
@@ -141,7 +140,7 @@ export default function Sidebar(props: SidebarProps) {
         </Transition.Root>
 
         {/* Static sidebar for desktop */}
-        <div className="hidden lg:fixed lg:inset-y-0 lg:z-50 lg:flex lg:w-72 lg:flex-col">
+        <div className="hidden max-w-xs lg:fixed lg:inset-y-0 lg:z-50 lg:flex lg:w-80 lg:flex-col">
           {/* Sidebar component, swap this element with another sidebar if you like */}
           <div className="flex grow flex-col gap-y-5 overflow-y-auto bg-indigo-600 px-6 pb-4">
             <div className="flex h-16 shrink-0 items-center gap-4">
@@ -187,8 +186,8 @@ export default function Sidebar(props: SidebarProps) {
           </div>
         </div>
 
-        <div className="lg:pl-72">
-          <div className="sticky top-0 z-40 flex h-16 shrink-0 items-center gap-x-4 border-b border-gray-200 bg-white px-4 shadow-sm sm:gap-x-6 sm:px-6 lg:px-8">
+        <div className="lg:pl-80">
+          <div className="sticky top-0 z-40 flex h-16 shrink-0 items-center gap-x-4 border-b border-gray-200 bg-white px-4 shadow-sm sm:gap-x-6">
             <button
               type="button"
               className="-m-2.5 p-2.5 text-gray-700 lg:hidden"
@@ -200,20 +199,6 @@ export default function Sidebar(props: SidebarProps) {
 
             <div className="flex flex-1 justify-end gap-x-4 self-stretch lg:gap-x-6">
               <div className="flex items-center gap-x-4 lg:gap-x-6">
-                <button
-                  type="button"
-                  className="-m-2.5 p-2.5 text-gray-400 hover:text-gray-500"
-                >
-                  <span className="sr-only">View notifications</span>
-                  <BellIcon className="h-6 w-6" aria-hidden="true" />
-                </button>
-
-                {/* Separator */}
-                <div
-                  className="hidden lg:block lg:h-6 lg:w-px lg:bg-gray-900/10"
-                  aria-hidden="true"
-                />
-
                 {/* Profile dropdown */}
                 <Menu as="div" className="relative">
                   <Menu.Button className="-m-1.5 flex items-center p-1.5">
@@ -238,22 +223,22 @@ export default function Sidebar(props: SidebarProps) {
                   </Menu.Button>
                   <Transition
                     as={Fragment}
-                    enter="transition ease-out duration-100"
+                    enter="transition ease-out duration-200"
                     enterFrom="transform opacity-0 scale-95"
                     enterTo="transform opacity-100 scale-100"
                     leave="transition ease-in duration-75"
                     leaveFrom="transform opacity-100 scale-100"
                     leaveTo="transform opacity-0 scale-95"
                   >
-                    <Menu.Items className="absolute right-0 z-10 mt-2.5 w-32 origin-top-right rounded-md bg-white py-2 shadow-lg ring-1 ring-gray-900/5 focus:outline-none">
+                    <Menu.Items className="absolute right-0 z-10 mt-2 w-48 origin-top-right rounded-md bg-white py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none">
                       {userNavigation.map((item) => (
                         <Menu.Item key={item.name}>
                           {({ active }) => (
                             <a
                               href={item.href}
                               className={classNames(
-                                active ? "bg-gray-50" : "",
-                                "block px-3 py-1 text-sm leading-6 text-gray-900",
+                                active ? "bg-gray-100" : "",
+                                "block px-4 py-2 text-sm text-gray-700",
                               )}
                             >
                               {item.name}
diff --git a/src/layouts/userLayout/Header.tsx b/src/layouts/userLayout/Header.tsx
index cf543fa3b..e7bf7c66f 100644
--- a/src/layouts/userLayout/Header.tsx
+++ b/src/layouts/userLayout/Header.tsx
@@ -7,6 +7,7 @@ import {
   TrophyIcon,
   ListBulletIcon,
 } from "@heroicons/react/24/outline";
+import { ChevronDownIcon } from "@heroicons/react/20/solid";
 
 const user = {
   name: "Tom Cook",
@@ -28,8 +29,7 @@ const navigation = [
   },
 ];
 const userNavigation = [
-  { name: "Your Profile", href: "#" },
-  { name: "Settings", href: "#" },
+  { name: "Admin Page", href: "/admin" },
   { name: "Sign out", href: "#" },
 ];
 
@@ -42,7 +42,7 @@ export default function Header() {
     <Disclosure as="nav" className="h-auto border-b border-gray-200 bg-white">
       {({ open }) => (
         <>
-          <div className="mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
+          <div className="mx-auto px-4">
             <div className="flex h-16 justify-between">
               <div className="flex">
                 <div className="flex flex-shrink-0 items-center">
@@ -77,24 +77,28 @@ export default function Header() {
                 </div>
               </div>
               <div className="hidden sm:ml-6 sm:flex sm:items-center">
-                <button
-                  type="button"
-                  className="rounded-full bg-white p-1 text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
-                >
-                  <span className="sr-only">View notifications</span>
-                  <BellIcon className="h-6 w-6" aria-hidden="true" />
-                </button>
-
                 {/* Profile dropdown */}
                 <Menu as="div" className="relative ml-3">
                   <div>
-                    <Menu.Button className="flex max-w-xs items-center rounded-full bg-white text-sm focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2">
+                    <Menu.Button className="-m-1.5 flex items-center p-1.5">
                       <span className="sr-only">Open user menu</span>
                       <img
                         className="h-8 w-8 rounded-full"
                         src={user.imageUrl}
                         alt=""
                       />
+                      <span className="hidden lg:flex lg:items-center">
+                        <span
+                          className="ml-4 text-sm font-semibold leading-6 text-gray-900"
+                          aria-hidden="true"
+                        >
+                          {user.name}
+                        </span>
+                        <ChevronDownIcon
+                          className="ml-2 h-5 w-5 text-gray-400"
+                          aria-hidden="true"
+                        />
+                      </span>
                     </Menu.Button>
                   </div>
                   <Transition