瀏覽代碼

fix: 侧边箭头小动画调整

outaozhen 4 年之前
父節點
當前提交
d8a575d5f2

+ 2 - 2
src/components/RightContent/Book/components/UserList/index.less

@@ -159,7 +159,7 @@
   transition: all 0.5s cubic-bezier(0.34, 1.25, 0.3, 1);
   transition-delay: 0.1s;
 }
-.show-short .side-bg-current:hover {
+.show-side-bg.side-bg-current:hover {
   background: url('/sideBg-current.png') no-repeat 0 0;
-  transform: rotate(180deg);
+  transform: rotate(-180deg);
 }

+ 5 - 5
src/components/RightContent/Book/components/UserList/index.tsx

@@ -20,16 +20,16 @@ const UesrList: React.FC<UserListProps> = ({ onlineList }) => {
   const intl = useIntl()
   return (
     <>
+      <span className="absolute top-70 left-[-0.75rem]" onClick={() => setVisible(!visible)}>
+        <div className="side-bg">
+          <span className={['side-bg-current', visible ? 'show-side-bg' : ''].join(' ')} />
+        </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(' ')}>
-        <span className="absolute top-70 left-[-0.75rem]" onClick={() => setVisible(!visible)}>
-          <div className="side-bg">
-            <span className="side-bg-current" />
-          </div>
-        </span>
         <div className="flex-1 h-full custom-scroll">
           <div className="w-full">
             <ul className="list-none m-0">