Partage tweak CSS : affichage du panneau latéral au passage de la souris à gauche de la fenêtre

[leroimerlinbis]

Bonjour,

Je partage un tweak sympa pour userchrome.css que j'ai trouvé hier : afficher le panneau latéral au passage de la souris à gauche de l'écran :

Code : Tout sélectionner

/* Suppression de la limitation de largeur du panneau latéral et affichage au passage de la souris */
    #sidebar,
    #sidebar-header,
    #sidebar-box {
        overflow: hidden !important;
        min-width: 0px !important;
        max-width: [b]700[/b]px !important;
    }

:root {
  --sidebar-hover-width: 8px;
  --sidebar-visible-width: [b]700[/b]px;
}

#sidebar-box {
  position: relative !important;
  overflow-x: hidden !important;
  margin-right: calc(var(--sidebar-hover-width) * -1) !important;
  left: var(--sidebar-hover-width) !important;
  min-width: var(--sidebar-hover-width) !important;
  max-width: var(--sidebar-hover-width) !important;
  opacity: 0 !important;
}

#sidebar-box:hover {
  margin-right: calc(var(--sidebar-visible-width) * -1) !important;
  left: var(--sidebar-visible-width) !important;
  min-width: var(--sidebar-visible-width) !important;
  max-width: var(--sidebar-visible-width) !important;
  opacity: 1 !important;
}

#sidebar {
  opacity: 0 !important;
}

#sidebar:hover {
  opacity: 1 !important;
}

/* #sidebar-header is hidden by default, change "none" to "inherit" to restore it. */
#sidebar-header {
  display: none !important;
}

/* #sidebar-splitter styles the divider between the sidebar and the rest of the browser. */
#sidebar-splitter {
}

Les 2 valeurs "700" que j'ai mis en gras définissent la largeur de la colonne.
Vous pouvez mettre ce que vous voulez

Un clic sur le bouton du panneau latéral, et il passe en mode masquée affichable au passage de la souris.
La manip supporte le redémarrage de Firefox. Donc j'ai supprimé le bouton du panneau latéral de l'interface