refactor: add typescript support to project
This commit is contained in:
@@ -0,0 +1,62 @@
|
||||
// import React from 'react'
|
||||
import { NavLink, useLocation } from "react-router-dom";
|
||||
import Tooltip from "../../common/component/Tooltip";
|
||||
import settingIcon from "../../assets/icons/setting.svg?url";
|
||||
import styled from "styled-components";
|
||||
const StyledMenus = styled.ul`
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
padding: 8px 12px;
|
||||
.menu {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10px;
|
||||
gap: 10px;
|
||||
.icon {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
transition: all 0.5s ease;
|
||||
}
|
||||
.txt {
|
||||
color: #4b5563;
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
`;
|
||||
export default function Menu() {
|
||||
const { pathname } = useLocation();
|
||||
return (
|
||||
<StyledMenus>
|
||||
<li className="menu link_navs">
|
||||
<NavLink className="link" to={`/setting?f=${pathname}`}>
|
||||
<Tooltip placement="right" tip="Settings">
|
||||
<img src={settingIcon} alt="setting icon" className="icon" />
|
||||
</Tooltip>
|
||||
</NavLink>
|
||||
{/* {expand && (
|
||||
<span className="txt animate__animated animate__fadeIn">
|
||||
Settings
|
||||
</span>
|
||||
)} */}
|
||||
</li>
|
||||
{/* <li className="menu" onClick={toggle}>
|
||||
<img
|
||||
src={expand ? foldIcon : unfoldIcon}
|
||||
alt="expand icon"
|
||||
className="icon"
|
||||
/>
|
||||
{expand && (
|
||||
<span className="txt animate__animated animate__fadeIn">Expand</span>
|
||||
)}
|
||||
</li> */}
|
||||
</StyledMenus>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user