diff --git a/packages/app/src/layout/sidebar/index.less b/packages/app/src/layout/sidebar/index.less index e13c0e3d..08447f30 100644 --- a/packages/app/src/layout/sidebar/index.less +++ b/packages/app/src/layout/sidebar/index.less @@ -2,54 +2,55 @@ // SIDEBAR .ant-layout-sider { - background: var(--sidebar-background-color)!important; - background-color: var(--sidebar-background-color)!important; + background : var(--sidebar-background-color) !important; + background-color: var(--sidebar-background-color) !important; border-radius: 0 @app_sidebar_borderRadius @app_sidebar_borderRadius 0; - overflow: hidden; - border: 1px solid var(--sidebar-background-color)!important; + overflow : hidden; + border : 1px solid var(--sidebar-background-color) !important; transition: all 150ms ease-in-out; - &.hidden{ - flex: 0!important; - min-width: 0!important; - background-color: transparent!important; - width: 0!important; + &.hidden { + flex : 0 !important; + min-width : 0 !important; + background-color: transparent !important; + width : 0 !important; } } -.ant-menu, .ant-menu ul { - background: transparent !important; +.ant-menu, +.ant-menu ul { + background : transparent !important; background-color: transparent !important; border-right: 0 !important; } .sidebar .ant-layout-sider-children { - margin-top: 15px !important; + margin-top : 15px !important; margin-bottom: 15px !important; - background: transparent !important; + background : transparent !important; background-color: transparent !important; - user-select: none; + user-select : none; --webkit-user-select: none; - transition: all 150ms ease-in-out; - height: 100%; - display: flex; + transition : all 150ms ease-in-out; + height : 100%; + display : flex; flex-direction: column; &.edit_mode .ant-layout-sider-children { - background: transparent !important; + background : transparent !important; background-color: transparent !important; margin-top: 15px !important; .app_sidebar_menu_wrapper { - opacity: 0; - height: 0; + opacity : 0; + height : 0; overflow: hidden; } } @@ -59,74 +60,80 @@ transition: all 450ms ease-in-out; height: 100%; - width: 100%; + width : 100%; } .app_sidebar_header { - background: transparent !important; + background : transparent !important; background-color: transparent !important; - user-select: none; + user-select : none; --webkit-user-select: none; - display: flex; + display : flex; flex-direction: column; - height: 15%; - margin-top: 5%; - margin-bottom: 5%; + height : 15%; + margin-top : 5%; + margin-bottom : 5%; } .app_sidebar_header_logo { - user-select: none; + user-select : none; --webkit-user-select: none; - display: flex; - align-items: center; + display : flex; + align-items : center; justify-content: center; - + img { - user-select: none; + user-select : none; --webkit-user-select: none; - width: 80%; + width : 80%; max-height: 80px; } + + &.collapsed { + img { + max-width: 40px; + } + } } .app_sidebar_menu { - background: transparent !important; + background : transparent !important; background-color: transparent !important; - height: 65%; - overflow: overlay; + height : 65%; + overflow : overlay; overflow-x: hidden; } .app_sidebar_bottom { - position: absolute; - bottom: 0; + position : absolute; + bottom : 0; padding-bottom: 30px; - z-index: 50; - left: 0; + z-index : 50; + left : 0; - background: transparent !important; - background-color: transparent !important; - backdrop-filter: blur(10px); + background : transparent !important; + background-color : transparent !important; + backdrop-filter : blur(10px); --webkit-backdrop-filter: blur(10px); - width: 100%; + width : 100%; height: fit-content; .ant-menu, ul { - background: transparent !important; + background : transparent !important; background-color: transparent !important; } } .user_avatar { - display: flex; - align-items: center; + display : flex; + align-items : center; justify-content: center; - padding: 0 !important; -} + padding : 0 !important; +} \ No newline at end of file