[Problème] Mettre le sidemenu (menu mobile) à droite - Gantry 4.1.24

[FM69]

Bonjour,

Je suis devenue une adepte de Gantry et j'évolue avec lui dans la création de sites (je suis encore une novice).
Et l'une des grandes forces de Joomla...c'est sa communauté où on y trouve de l'aide et des conseils !
C'est ainsi que je reviens faire appel aux expérimentés car j'aimerais arriver à ce que le "sidemenu" pour les mobiles (template personnalisé sous Gantry) s'ouvre sur la droite au lieu de sur la gauche.

Merci pour l'aide que vous pourrez m'apporter !

Bonne journée

[webcrea]

Re : Mettre le sidemenu (menu mobile) à droite - Gantry 4.1.24

j'irais voir du côté des styles définis pour les mobiles...

[FM69]

Re : Mettre le sidemenu (menu mobile) à droite - Gantry 4.1.24

j'irais voir du côté des styles définis pour les mobiles...

J'ai déjà identifié la partie réservée à ce style "menu mobile - sidemenu" mais je ne parviens pas à le modifier à ma convenance. Voici le code original :

/* Being: Mobile sidemenu */
body.layout-mode-responsive {
.transition(left 0.2s ease-out);
position: relative;

.gf-menu-device-wrapper-sidemenu {
left: -@menuSideSize;
-webkit-overflow-scrolling: touch;
}

.gf-sidemenu-size-left {
left: 0;
.transition(left 0.2s ease-out);
}
}

body.gf-sidemenu-size-marginleft {
left: @menuSideSize;
position: relative;
overflow: hidden;
.transition(left 0.2s ease-out);
}

@media (max-width: 767px) {
.gf-menu-device-container.responsive-type-panel ~ ul.gf-menu {
display: none;
}
.layout-mode-responsive {
.gf-menu-device-wrapper {
&.gf-menu-device-wrapper-sidemenu {
margin-bottom: 0 !important;
}
}

// sidemenu

.gf-menu-device-wrapper-sidemenu {
.transition(left 0.2s ease-out);
position: fixed !important;
top: 0;
left: -@menuSideSize;
right: 0;
bottom: 0;
margin: 0 !important;
z-index: 6000;
overflow: auto !important;

background: @menuMobileBack;
border: 0;
.box-shadow(@menuInsetShadowSide);
.border-radius(0px 25px 0px 0px);
.box-sizing(border-box);
padding: 0;
width: @menuSideSize;

.gf-menu-device-container {
display: block;
padding: 0;
margin: 0;
.border-radius(0);
.box-shadow(none);
border: 0;
width: 95%;
}
}

}
}

@media (min-width: 768px) {
.layout-mode-responsive {
.gf-menu-device-wrapper-sidemenu {
left: -@menuSideSize;
}
}
body.gf-sidemenu-size-marginleft {
left: 0;
}
}
/* End: Mobile sidemenu */