RageStudio/comty
1
0
Fork 0
mirror of https://github.com/ragestudio/comty.git synced 2025-06-10 19:14:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

format

Browse Source
This commit is contained in:
srgooglo 2022-03-02 20:36:41 +01:00
parent 0ac5a3f3e8
commit f8701a22c9
1 changed files with 56 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

105
packages/app/src/layout/sidebar/index.less
View File

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