Barre latérale
Barre latérale d'application repliable avec sections, éléments imbriqués, icônes, badges et comportement responsive. Le style complet reste visible et se replie en rail d'icônes uniquement. Le style flottant glisse en superposition avec assombrissement de l'arrière-plan.
Complet
Barre latérale standard qui se replie en rail d'icônes au basculement.
_sidebar.html.erb
███
███████ ██████████ █ ████ █████ █████████
██████
███ ██████ ██████████████████████████ ██████ █ █████ ████████ █████ ███ ██ █████████ █
█
██████ ███████
██████ █
█ ██████ ████████████ █████ ██████ █████ ████ ███████ ████ ██
█ ██████ ████████████ █████ ███████ █████ █████████████ ██████ █████ ██
sidebar_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ █████████ ███████████ ████████ ████████ ████████ ██████████ █████████████ ███████████
██████ ██████ █ █
██████████ █ █████ ████████ ████████ █████ ██
█████ █ █████ ████████ ████████ █████ ██
██████ █ █████ ███████ ████████ ██████ ██
████████ █ █████ ████████ ████████ █████ █
█
sidebar_full_component.html.erb
████ █████████████████████████
███████████████████████████████
█████████████████████████████████ █████████ ███
███████████████████████████████████
████ ███████████████████████████ ██████████ █████████████ ████
███ █████ ████ ██
████ ██████████ ██████████████████ ████
██ █████████ ██████████ ███
sidebar_full_component.rb
█ ██████████████████████ ████
█████ ████████████████████ █ ███████████████████
████████████ ██████████ ██████████████████
█████ █ █
█████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ █████ ████████ █████ █ ███ ███████ █ █ ███ ███████████ ███████████ █ █ ████ ███████ ███ █ █ ██████████ █ █ █████████ █ █ ███ █████ █ █ ███ ████ ██████████████
██████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ ██████ ███████ █ █ ███ ████████ █████████ █ █ ████ ██████ ████████ █ █ █████████████ ███ █ █ ████ █ █ █ █ ███ █████████████
█████████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ ██████████ ████████████████ ███████████ ████ ███████ █████ █ ███████ ███████████████ ████████ ████ ██████████ █████ █ ███████ ███████████████ █████ █████ █ ██████████ █████ █ ████████ █████████ ██████████ █████████ ██████████ █████ █ ████████ ███████████ ███████████ ██████████ ███████ █████ █ ██████████████████████████████████████████████████ █████ █ ██████████████████████████████████████ ████████████ █████ █ █████████████████████████████████ █████████████████ ████████ ████████████████████ ██████████████████████ ███████████████████████ ████████████████ ██████ ████ █ █ ████ █ █ █ █ ███ █████████████
██████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ █████ ███████ █ █ ██████████ █ █ ████ █████ █ █ ███ █████ █ █ ████████ █████ █ █ █████████ █ █ ███ ███████ ███ █ █ ███ █████ █ █ ███████ █████ █ █ █████████ █ █ ███ ██████ █ █ ████ ██████ █ █ ██████████████████
sidebar_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ █████████ ███████████ ████████ ████████ ████████ ██████████ █████████████ ███████████
██████ ██████ █ █
██████████ █ █████ ████████ ████████ █████ ██
█████ █ █████ ████████ ████████ █████ ██
██████ █ █████ ███████ ████████ ██████ ██
████████ █ █████ ████████ ████████ █████ █
█
Flottant
Barre latérale en superposition qui glisse depuis la gauche avec assombrissement de l'arrière-plan.
_sidebar.html.erb
███
███████ ██████████ █ ████████ █████ █████████
██████
███ ███████ ██████ ██████ ████████ ██ ████ ███████ ██
███████ █████████████████████████████████ ████████████████████████████████████████
████ ████
█████████
███ ████████ ███████ ██
sidebar_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ █████████ ███████████ ████████ ████████ ████████ ██████████ █████████████ ███████████
██████ ██████ █ █
██████████ █ █████ ████████ ████████ █████ ██
█████ █ █████ ████████ ████████ █████ ██
██████ █ █████ ███████ ████████ ██████ ██
████████ █ █████ ████████ ████████ █████ █
█
sidebar_floating_component.html.erb
████ █████████████████████████
███████████████████████████████████
███████████████████████████████
███████████████████████████████████████████████████████████
███ ████████ ██
████ ██████████████████████████████
██████████████████████████████████
████████████ ███████ ████ ███████████ ██████████████████ ████████████ █████████ █████████████████████
██████
sidebar_floating_component.rb
█ ██████████████████████ ████
█████ ████████████████████████ █ ███████████████████
████████████ ██████████ ██████████████████
█████ █ █
█████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ █████ ████████ █████ █ ███ ███████ █ █ ███ ███████████ ███████████ █ █ ████ ███████ ███ █ █ ██████████ █ █ █████████ █ █ ███ █████ █ █ ███ ████ ██████████████
██████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ ██████ ███████ █ █ ███ ████████ █████████ █ █ ████ ██████ ████████ █ █ █████████████ ███ █ █ ████ █ █ █ █ ███ █████████████
█████████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ ██████████ ████████████████ ███████████ ████ ███████ █████ █ ███████ ███████████████ ████████ ████ ██████████ █████ █ ███████ ███████████████ █████ █████ █ ██████████ █████ █ ████████ █████████ ██████████ █████████ ██████████ █████ █ ████████ ███████████ ███████████ ██████████ ███████ █████ █ ██████████████████████████████████████████████████ █████ █ ██████████████████████████████████████ ████████████ █████ █ █████████████████████████████████ █████████████████ ████████ ████████████████████ ██████████████████████ ███████████████████████ ████████████████ ██████ ████ █ █ ████ █ █ █ █ ███ █████████████
██████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ █████ ███████ █ █ ██████████ █ █ ████ █████ █ █ ███ █████ █ █ ████████ █████ █ █ █████████ █ █ ███ ███████ ███ █ █ ███ █████ █ █ ███████ █████ █ █ █████████ █ █ ███ ██████ █ █ ████ ██████ █ █ ██████████████████
sidebar_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ █████████ ███████████ ████████ ████████ ████████ ██████████ █████████████ ███████████
██████ ██████ █ █
██████████ █ █████ ████████ ████████ █████ ██
█████ █ █████ ████████ ████████ █████ ██
██████ █ █████ ███████ ████████ ██████ ██
████████ █ █████ ████████ ████████ █████ █
█
Journal des modifications
- v1.0.0: Initial release with full and floating styles
Obtenir l'accès complet
Débloquez le code source de ce composant et de tous les autres. Paiement unique pour un accès à vie.
Obtenir l'accès maintenant