feat: 在线列表图钉按钮

src/components/RightContent/Book/components/UserList/index.less

@@ -116,3 +116,24 @@
     transform: scale(1);
   }
 }
+.circle-one {
+  position: absolute;
+  z-index: -1;
+  width: 30px;
+  height: 46px;
+  color: #b0b0b0;
+  background: #eee6f5;
+  border: 1px solid #d9d9d9;
+  border-right: none;
+  border-top-left-radius: 80%;
+  border-top-right-radius: 70%;
+  border-bottom-right-radius: 70%;
+  border-bottom-left-radius: 80%;
+  cursor: pointer;
+}
+.circle-one:hover {
+  color: #ffffff;
+  background: #decced;
+  border: 1px solid #a590c1;
+  border-right: none;
+}

src/components/RightContent/Book/components/UserList/index.tsx

@@ -1,5 +1,6 @@
 import { useState } from 'react'
 import { useIntl } from 'umi'
+import { Right } from '@icon-park/react'
 import './index.less'
 
 interface StaffItem {
@@ -20,15 +21,16 @@ const UesrList: React.FC<UserListProps> = ({ onlineList }) => {
   const intl = useIntl()
   return (
     <>
-      <span className="absolute top-12 left-[-3rem]" onClick={() => setVisible(!visible)}>
-        固钉
+      <span className="absolute top-12 left-[-1rem]" onClick={() => setVisible(!visible)}>
+        <div className="circle-one">
+          <Right size="20" />
+        </div>
       </span>
       <div
         className={[
           'book-list border border-solid border-hex-1d1d1d border-opacity-7 bg-hex-f7f9fa flex flex-col bg-hex-f9f7fa text-hex-666',
           visible ? 'show-short' : ''
-        ].join(' ')}
-      >
+        ].join(' ')}>
         <div className="flex-1 h-full custom-scroll">
           <div className="w-full">
             <ul className="list-none m-0">
@@ -36,8 +38,7 @@ const UesrList: React.FC<UserListProps> = ({ onlineList }) => {
                 return (
                   <li
                     key={item.id}
-                    className="table px-2 py-2 text-hex-505050 hover-white hvr-rectangle-out w-full"
-                  >
+                    className="table px-2 py-2 text-hex-505050 hover-white hvr-rectangle-out w-full">
                     <div className="table-cell align-middle status status-success status-sm ">
                       <span
                         className="w-8 h-8 rounded-1/2 block"