Duguay/teach_sys_Demo
3
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 🎸 更新了一些资源

Browse Source
This commit is contained in:
前端人绝不为奴
2025-08-18 16:21:53 +08:00
parent 161635a5d2
commit 43052841e4
6 changed files with 84 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

101
src/components/Sidebar/index.css
View File

@@ -65,45 +65,49 @@
align-items: center;
flex-direction: column;
.sidebar-menu-title {
.sidebar-menu-item-wrapper {
width: 100%;
height: 36px;
text-align: left;
line-height: 36px;
color: #bfbfbf;
font-size: 14px;
font-weight: 400;
}
.sidebar-menu-item-active {
background-color: #e8f3ff;
.sidebar-menu-icon {
color: #0275f2 !important;
}
.sidebar-menu-text {
color: #0275f2 !important;
}
}
.sidebar-menu-item {
width: 100%;
height: 40px;
display: flex;
justify-content: flex-start;
align-items: center;
border-radius: 8px;
cursor: pointer;
.sidebar-menu-icon {
margin: 0 10px;
font-size: 20px;
}
.sidebar-menu-text {
margin-left: 10px;
font-size: 16px;
.sidebar-menu-title {
width: 100%;
height: 36px;
text-align: left;
line-height: 36px;
color: #bfbfbf;
font-size: 14px;
font-weight: 400;
color: #616065;
}
.sidebar-menu-item-active {
background-color: #e8f3ff;
.sidebar-menu-icon {
color: #0275f2 !important;
}
.sidebar-menu-text {
color: #0275f2 !important;
}
}
.sidebar-menu-item {
width: 100%;
height: 40px;
display: flex;
justify-content: flex-start;
align-items: center;
border-radius: 8px;
cursor: pointer;
.sidebar-menu-icon {
margin: 0 10px;
font-size: 20px;
}
.sidebar-menu-text {
margin-left: 10px;
font-size: 16px;
font-weight: 400;
color: #616065;
}
}
}
}
@@ -165,18 +169,21 @@
opacity: 0;
transition: opacity 0.3s ease;
}
.sidebar-menu-item {
justify-content: center;
.sidebar-menu-item-wrapper {
.sidebar-menu-item {
justify-content: center;
.sidebar-menu-icon {
margin: 0;
}
.sidebar-menu-text {
opacity: 0;
transform: translateX(-10px);
pointer-events: none;
transition: opacity 0.3s ease, transform 0.3s ease;
width: 0;
.sidebar-menu-icon {
margin: 0;
}
.sidebar-menu-text {
opacity: 0;
transform: translateX(-10px);
pointer-events: none;
transition: opacity 0.3s ease, transform 0.3s ease;
width: 0;
display: none;
}
}
}
}

13
src/components/Sidebar/index.jsx
View File

@@ -44,10 +44,8 @@ const Sidebar = ({ isCollapsed, setIsCollapsed }) => {
{routes
.filter((item) => item.showMenu)
?.map((item) => (
<>
<p className="sidebar-menu-title" key={item.name}>
{item.name}
</p>
<div key={item.key} className="sidebar-menu-item-wrapper">
<p className="sidebar-menu-title">{item.name}</p>
{item.routes
?.filter((i) => i.showMenuItem)
?.map((j) => (
@@ -60,14 +58,11 @@ const Sidebar = ({ isCollapsed, setIsCollapsed }) => {
key={j.path}
onClick={() => handleNavClick(j.path)}
>
<IconFont
className="sidebar-menu-icon"
name="icon-yishiming"
/>
<IconFont className="sidebar-menu-icon" name={j.icon} />
<span className="sidebar-menu-text">{j.name}</span>
</li>
))}
</>
</div>
))}
</ul>
<div className="sidebar-btn" onClick={toggleSidebar}>