Display Of The "Light/Dark" Button -- Affichage Du Bouton "Clair/Sombre" - Question | JoomShaper

Display Of The "Light/Dark" Button -- Affichage Du Bouton "Clair/Sombre"

CP

CASIEZ Pascal

Template 1 month ago

Hello, I'm currently working on your excellent "Artolio" template. My daughter, for whom the future website is intended, and I are wondering how to move the module that allows switching between dark and light mode. While it's relatively unobtrusive on a computer, on a mobile phone it takes up a large part of the screen and obscures some information. I would appreciate it if you could tell me where the management elements for this item are located and what they are called. Also, is it possible to move it or display it in a section of the top menu or at the bottom of the page to improve the display on mobile devices? Thank you for your help. Sincerely, Pascal

French Bonjour, Je travaille actuellement sur votre excellent template "Artolio". Avec ma fille, pour qui est destiné le futur site, nous nous demandons comment faire pour déplacer le module qui permet de passer en mode sombre ou clair. Autant sur un ordinateur, il passe relativement inaperçu, cependant sur un téléphone mobile, il occupe une grande partie de l'écran et occulte certaines informations. Je vous serais reconnaissant de me préciser où se trouvent, et comment se nomment les éléments de gestion de cet élément. Par ailleurs, est-il possible de le déplacer ou de le faire s'afficher, dans une partie du "top menu" ou dans le bas de page afin de libérer l'affichage sur mobile. Je vous remercie pour votre retour. Bien à vous, Pascal

0
5 Answers
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 1 month ago #211471

Hi there!

Thanks for reaching out.

Your site URL here would have been better though. However, you may try the following code snippet in your custom CSS:

.sppb-color-switcher-modes {
    right: 24px !important;
    top: 40% !important;
}

Please note that you can change the top value, right value according to your need. You even can introduce bottom value instead of the top value.

Best regards,

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 1 month ago #213160

Hi Pascal,

I haven’t heard back from you regarding this issue. Could you please confirm if everything is working fine now? If so, kindly accept the most helpful answer to close the post.

Best regards,

0
CP
CASIEZ Pascal
Accepted Answer
1 month ago #213212

Hello Rashida,

Sorry for not replying sooner, I was tied up with a business trip.

I tried the code snippet you provided in Artolio's custom CSS, but it didn't really work. My goal is to either hide the background selector (light/dark) or display it somewhere other than the main page of the site (see screenshot). https://www.photo-pick.com/online/lI1Fnoyc.link

If this element is a module (which I haven't been able to find!), I'd like to be able to integrate it either in the "menu" position or in the "footer x" position so I can manage it properly. Please tell me where I can find the code that handles this display.

Thank you for your feedback, and have a lovely day. Pascal

Bonjour Rashida,

Désolé pour ma non-réponse, j'étais retenu sur un déplacement professionnel. J'ai essayé le fragment de code que vous m'avez fourni dans le CSS personnalisé d'Artolio, sans réelle efficacité. Mon souhait serait de ne pas afficher le sélecteur de fond (clair/sombre) ou de pouvoir l'afficher ailleurs que sur la page principale du site (Cf. copie d'écran). https://www.photo-pick.com/online/lI1Fnoyc.link

Si cet élément est un module (que je n'ai pas trouvé !) je souhaiterais pouvoir l'intégrer soit en position "menu" soit en position "footer x" pour pouvoir le gérer correctement. Je vous remercie de me dire où je peux trouver le code qui gère cet affichage.

Merci pour votre retour, et belle journée à vous. Pascal

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 3 weeks ago #213810

Hi Pascal,

Please accept my apologies.

I have given you the custom CSS earlier, with the help of that css you can change the position of the switcher by changing the value of top and right.

However, if you want to hide it completely, then try the following code:

.sppb-color-switcher-modes {
            display: none !important;
}

If you want it close to the bottom part, then use the following code instead:

.sppb-color-switcher-modes {
    bottom: 10% !important;
}

Best regards,

0
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 2 weeks ago #214339

Did that help?

0