Files
labelmain-demo/components/layout/AppLayout.module.css
2026-04-29 16:27:07 +08:00

122 lines
1.7 KiB
CSS

.header {
border-bottom: 1px solid #e5e6eb;
background: #ffffff;
}
.headerInner {
height: 100%;
padding: 0 16px;
}
.brand {
display: flex;
width: 196px;
align-items: center;
gap: 8px;
color: #1d2129;
font-size: 14px;
font-weight: 500;
line-height: 22px;
}
.brandMark {
display: inline-flex;
width: 20px;
height: 20px;
align-items: center;
justify-content: center;
border-radius: 4px;
background: #1874ff;
color: #ffffff;
font-size: 11px;
font-weight: 600;
}
.headerNav {
display: flex;
flex: 1;
align-items: center;
gap: 8px;
height: 100%;
}
.headerUser {
display: flex;
align-items: center;
gap: 6px;
}
.navbar {
border-right: 1px solid #e5e6eb;
background: #ffffff;
transition: width 0.2s ease;
}
.navbarScroll {
height: calc(100vh - 108px);
padding: 8px 8px 0;
}
.navbarIconLink {
display: flex;
width: 100%;
min-height: 40px;
align-items: center;
justify-content: center;
border-radius: 4px;
color: #4e5969;
transition:
background-color 0.2s ease,
color 0.2s ease;
}
.navbarIconLink:hover {
background: #eef4ff;
color: #1874ff;
}
.navbarIconLinkActive {
background: #e7efff;
color: #1874ff;
}
.navbarFooter {
border-top: 1px solid #e5e6eb;
padding: 4px 8px;
}
.navbarToggleIcon {
display: inline-flex;
width: 36px;
height: 36px;
align-items: center;
justify-content: center;
border-radius: 4px;
color: #4e5969;
transition:
background-color 0.2s ease,
color 0.2s ease;
}
.navbarToggleIcon:hover {
background: #f2f3f5;
color: #1874ff;
}
.main {
background: #f7f8fa;
}
.userName {
color: #1d2129;
font-size: 14px;
font-weight: 500;
line-height: 18px;
}
.userBaseCity {
color: #86909c;
font-size: 12px;
line-height: 14px;
}