All clicking through the transparent area when the menu is open but nothing is selected
This commit is contained in:
parent
da4b592e54
commit
009d6be057
|
@ -55,7 +55,7 @@
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
width: 130px;
|
width: 130px;
|
||||||
height: 43px;
|
height: 43px;
|
||||||
margin: 18px 0 17px 20px;
|
margin: 18px 0 17px 25px;
|
||||||
cursor: default;
|
cursor: default;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,6 +8,7 @@
|
||||||
transform: translateX(-100%) translateY(-100%);
|
transform: translateX(-100%) translateY(-100%);
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transition: all .4s ease-in-out;
|
transition: all .4s ease-in-out;
|
||||||
|
pointer-events: none;
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
width: 900px;
|
width: 900px;
|
||||||
|
@ -15,20 +16,10 @@
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bd-sidebar-view::after {
|
|
||||||
content: "";
|
|
||||||
height: 100%;
|
|
||||||
width: 310px;
|
|
||||||
background-color: #202225;
|
|
||||||
top: 100%;
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bd-settings-x {
|
.bd-settings-x {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 18px;
|
top: 18px;
|
||||||
left: 250px;
|
left: 255px;
|
||||||
border: 2px solid #6e6e6e;
|
border: 2px solid #6e6e6e;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
width: 25px;
|
width: 25px;
|
||||||
|
@ -39,7 +30,7 @@
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
.platform-darwin & {
|
.platform-darwin & {
|
||||||
top: 40px;
|
top: 43px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bd-x-text {
|
.bd-x-text {
|
||||||
|
@ -65,10 +56,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.bd-sidebar-region .bd-scroller {
|
|
||||||
padding-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bd-info {
|
.bd-info {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: flex-end;
|
align-items: flex-end;
|
||||||
|
@ -108,6 +95,38 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.bd-sidebar-view {
|
||||||
|
&::after {
|
||||||
|
content: "";
|
||||||
|
height: 100%;
|
||||||
|
width: 310px;
|
||||||
|
background-color: #202225;
|
||||||
|
top: 100%;
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bd-sidebar-region .bd-scroller {
|
||||||
|
padding-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bd-content-region {
|
||||||
|
width: 590px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
.bd-content-region {
|
||||||
|
transition: transform 0.4s ease-in-out, opacity 0.2s ease;
|
||||||
|
transform: none;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.bd-stop .bd-content-region {
|
||||||
|
z-index: 3003;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.platform-darwin & {
|
.platform-darwin & {
|
||||||
top: 0px;
|
top: 0px;
|
||||||
|
|
||||||
|
@ -120,19 +139,7 @@
|
||||||
top: 0;
|
top: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bd-sidebar-view.bd-stop .bd-content-region {
|
&:not(.active) > .bd-sidebar-view.active,
|
||||||
z-index: 3003;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bd-sidebar-view.active {
|
|
||||||
.bd-content-region {
|
|
||||||
transition: transform 0.4s ease-in-out, opacity 0.2s ease;
|
|
||||||
transform: none;
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:not(.active) .bd-sidebar-view.active,
|
|
||||||
&.bd-settings-out .bd-sidebar-view.active {
|
&.bd-settings-out .bd-sidebar-view.active {
|
||||||
.bd-content-region {
|
.bd-content-region {
|
||||||
transform: translate(-600px, 0%);
|
transform: translate(-600px, 0%);
|
||||||
|
|
|
@ -19,6 +19,7 @@
|
||||||
z-index: 5;
|
z-index: 5;
|
||||||
max-width: 310px;
|
max-width: 310px;
|
||||||
min-width: 310px;
|
min-width: 310px;
|
||||||
|
pointer-events: all;
|
||||||
|
|
||||||
.bd-scroller {
|
.bd-scroller {
|
||||||
padding: 10px 10px 0 0;
|
padding: 10px 10px 0 0;
|
||||||
|
@ -32,6 +33,7 @@
|
||||||
box-shadow: 0 0 4px #202225;
|
box-shadow: 0 0 4px #202225;
|
||||||
backface-visibility: hidden;
|
backface-visibility: hidden;
|
||||||
transition: transform 0.6s ease;
|
transition: transform 0.6s ease;
|
||||||
|
pointer-events: all;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.bd-stop {
|
&.bd-stop {
|
||||||
|
|
Loading…
Reference in New Issue