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

improve style for sidedrawers

Browse Source
This commit is contained in:
srgooglo 2022-10-25 14:42:16 +00:00
parent 80bf198908
commit a544d557bb
2 changed files with 16 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/app/src/components/Layout/sidedrawer/index.jsx
View File

@ -9,9 +9,11 @@ export const Sidedrawer = (props) => {
return <div
key={sidedrawerId}
id={sidedrawerId}
style={props.style}
className={
classnames("sidedrawer", {
"hided": !props.defaultVisible,
"first": props.first
})
}
>
@ -114,6 +116,10 @@ export default class SidedrawerController extends React.Component {
{
key: id,
id: id,
first: drawers.length === 0,
style: {
zIndex: 100 - drawers.length,
},
allowMultiples: options.allowMultiples ?? false,
...options.props,
close: this.close,

20
packages/app/src/components/Layout/sidedrawer/index.less
View File

@ -3,18 +3,14 @@
.sidedrawers-wrapper {
display: flex;
flex-direction: row;
> div {
transform: translate(-50px, 0);
}
.sidedrawer {
position: relative;
width: 30vw; // by default
width: auto; // by default
height: 100vh;
min-width: 700px;
min-width: 400px;
z-index: 20;
@ -22,9 +18,9 @@
border-radius: 0 @app_sidebar_borderRadius @app_sidebar_borderRadius 0;
padding: 20px;
padding-left: 70px;
padding-left: 30px;
transform: translate(-50px, 0);
transform: translate(-20px, 0);
overflow-x: hidden;
overflow-y: overlay;
@ -33,7 +29,11 @@
transition: all 150ms ease-in-out;
// create shadow on the right side
box-shadow : 0 0 5px 4px rgba(0, 0, 0, 0.1) !important;
box-shadow: 0 0 5px 4px rgba(0, 0, 0, 0.1) !important;
&.first {
transform: translate(-10px, 0);
}
&.hided {
width: 0;