verdnatura/salix
verdnatura
/
salix
3
4
Fork 0
Code Issues Pull Requests 59 Releases Wiki Activity

changes
gitea/salix/pipeline/head This commit looks good Details

This commit is contained in:
Joan Sanchez 2021-10-18 09:31:25 +02:00
parent 19b1190480
commit 558c79315f
3 changed files with 14 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
front/salix/components/layout/style.scss
View File

@ -72,9 +72,13 @@ vn-layout {
& > vn-topbar > .start {
width: 80px + $menu-width;
}
&.shown > .main-view {
& > .main-view {
padding-left: $menu-width;
}
&.shown > .main-view {
padding-left: 0;
}
}
&.right-menu {
& > vn-topbar > .end {

33
front/salix/components/side-menu/side-menu.js
View File

@ -27,31 +27,6 @@ export default class SideMenu extends Component {
this.layout.leftMenu = this;
this.layout.element.classList.add('left-menu');
}
// Eliminar todos los eventos keydown para prevenir pulsar escape despues de minimizar y maximizar ventana
this.stateHandler = this.$transitions.onStart({}, t => this.onTransition(t));
const resizeHandler = target => {
const stateParts = this.$state.current.name.split('.');
const handler = e => this.onEscape(e);
if (target.innerWidth <= this.mobileWidth) {
this.handler = handler;
this.$window.addEventListener('keydown', this.handler);
this.hide();
} else {
this.$window.removeEventListener('keydown', handler);
if (this.side == 'right' || stateParts[1] === 'card')
this.show();
}
};
this.$window.addEventListener('resize', event => {
resizeHandler(event.target);
this.$.$digest();
});
resizeHandler(this.$window);
}
$onDestroy() {
@ -75,15 +50,9 @@ export default class SideMenu extends Component {
}
onTransition(transition) {
const stateParts = transition.to().name.split('.');
if (transition.from().name !== transition.to().name) {
if (stateParts[1] === 'card')
this.show();
else
if (transition.from().name !== transition.to().name)
this.hide();
}
}
toggle() {
if (this.shown) this.hide();

13
front/salix/components/side-menu/style.scss
View File

@ -17,16 +17,14 @@ vn-side-menu > .menu {
transition: transform 200ms ease-out;
&.left {
transform: translateZ(0) translateX(-$menu-width);
left: 0
}
&.right {
transform: translateZ(0) translateX($menu-width);
right: 0
right: 0;
}
&.shown {
transform: translateZ(0) translateX(0);
transform: translateZ(0) translateX(-$menu-width);
}
@media screen and (max-width: $mobile-width) {
@ -34,11 +32,14 @@ vn-side-menu > .menu {
top: 0;
&.left {
transform: 0;
transform: translateZ(0) translateX(-$menu-width);
}
&.right {
top: 0;
transform: 0;
transform: translateZ(0) translateX($menu-width);
}
&.shown {
transform: translateZ(0) translateX(0);
}
}
}