Barra laterale
Barra laterale dell'applicazione comprimibile con sezioni, voci nidificate, icone, badge e comportamento responsive. Lo stile completo resta visibile e si comprime a una barra di sole icone. Lo stile flottante scorre come overlay con oscuramento dello sfondo.
Completa
Barra laterale standard che si comprime a barra di sole icone al toggle.
_sidebar.html.erb
███
███████ ██████████ █ ████ █████ █████████
██████
███ ██████ ██████████████████████████ ██████ █ █████ ████████ █████ ███ ██ █████████ █
█
██████ ███████
██████ █
█ ██████ ████████████ █████ ██████ █████ ████ ███████ ████ ██
█ ██████ ████████████ █████ ███████ █████ █████████████ ██████ █████ ██
sidebar_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ █████████ ███████████ ████████ ████████ ████████ ██████████ █████████████ ███████████
██████ ██████ █ █
██████████ █ █████ ████████ ████████ █████ ██
█████ █ █████ ████████ ████████ █████ ██
██████ █ █████ ███████ ████████ ██████ ██
████████ █ █████ ████████ ████████ █████ █
█
sidebar_full_component.html.erb
████ █████████████████████████
███████████████████████████████
█████████████████████████████████ █████████ ███
███████████████████████████████████
████ ███████████████████████████ ██████████ █████████████ ████
███ █████ ████ ██
████ ██████████ ██████████████████ ████
██ █████████ ██████████ ███
sidebar_full_component.rb
█ ██████████████████████ ████
█████ ████████████████████ █ ███████████████████
████████████ ██████████ ██████████████████
█████ █ █
█████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ █████ ████████ █████ █ ███ ███████ █ █ ███ ███████████ ███████████ █ █ ████ ███████ ███ █ █ ██████████ █ █ █████████ █ █ ███ █████ █ █ ███ ████ ██████████████
██████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ ██████ ███████ █ █ ███ ████████ █████████ █ █ ████ ██████ ████████ █ █ █████████████ ███ █ █ ████ █ █ █ █ ███ █████████████
█████████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ ██████████ ████████████████ ███████████ ████ ███████ █████ █ ███████ ███████████████ ████████ ████ ██████████ █████ █ ███████ ███████████████ █████ █████ █ ██████████ █████ █ ████████ █████████ ██████████ █████████ ██████████ █████ █ ████████ ███████████ ███████████ ██████████ ███████ █████ █ ██████████████████████████████████████████████████ █████ █ ██████████████████████████████████████ ████████████ █████ █ █████████████████████████████████ █████████████████ ████████ ████████████████████ ██████████████████████ ███████████████████████ ████████████████ ██████ ████ █ █ ████ █ █ █ █ ███ █████████████
██████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ █████ ███████ █ █ ██████████ █ █ ████ █████ █ █ ███ █████ █ █ ████████ █████ █ █ █████████ █ █ ███ ███████ ███ █ █ ███ █████ █ █ ███████ █████ █ █ █████████ █ █ ███ ██████ █ █ ████ ██████ █ █ ██████████████████
sidebar_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ █████████ ███████████ ████████ ████████ ████████ ██████████ █████████████ ███████████
██████ ██████ █ █
██████████ █ █████ ████████ ████████ █████ ██
█████ █ █████ ████████ ████████ █████ ██
██████ █ █████ ███████ ████████ ██████ ██
████████ █ █████ ████████ ████████ █████ █
█
Flottante
Barra laterale overlay che scorre da sinistra con oscuramento dello sfondo.
_sidebar.html.erb
███
███████ ██████████ █ ████████ █████ █████████
██████
███ ███████ ██████ ██████ ████████ ██ ████ ███████ ██
███████ █████████████████████████████████ ████████████████████████████████████████
████ ████
█████████
███ ████████ ███████ ██
sidebar_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ █████████ ███████████ ████████ ████████ ████████ ██████████ █████████████ ███████████
██████ ██████ █ █
██████████ █ █████ ████████ ████████ █████ ██
█████ █ █████ ████████ ████████ █████ ██
██████ █ █████ ███████ ████████ ██████ ██
████████ █ █████ ████████ ████████ █████ █
█
sidebar_floating_component.html.erb
████ █████████████████████████
███████████████████████████████████
███████████████████████████████
███████████████████████████████████████████████████████████
███ ████████ ██
████ ██████████████████████████████
██████████████████████████████████
████████████ ███████ ████ ███████████ ██████████████████ ████████████ █████████ █████████████████████
██████
sidebar_floating_component.rb
█ ██████████████████████ ████
█████ ████████████████████████ █ ███████████████████
████████████ ██████████ ██████████████████
█████ █ █
█████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ █████ ████████ █████ █ ███ ███████ █ █ ███ ███████████ ███████████ █ █ ████ ███████ ███ █ █ ██████████ █ █ █████████ █ █ ███ █████ █ █ ███ ████ ██████████████
██████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ ██████ ███████ █ █ ███ ████████ █████████ █ █ ████ ██████ ████████ █ █ █████████████ ███ █ █ ████ █ █ █ █ ███ █████████████
█████████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ ██████████ ████████████████ ███████████ ████ ███████ █████ █ ███████ ███████████████ ████████ ████ ██████████ █████ █ ███████ ███████████████ █████ █████ █ ██████████ █████ █ ████████ █████████ ██████████ █████████ ██████████ █████ █ ████████ ███████████ ███████████ ██████████ ███████ █████ █ ██████████████████████████████████████████████████ █████ █ ██████████████████████████████████████ ████████████ █████ █ █████████████████████████████████ █████████████████ ████████ ████████████████████ ██████████████████████ ███████████████████████ ████████████████ ██████ ████ █ █ ████ █ █ █ █ ███ █████████████
██████ █████ ██████████ ████ ███████████ ██████████ █ ██ ███ ███████████████████████████ ██████████████████████ ███████████████████████ ████████████████ █████ ███████ █ █ ██████████ █ █ ████ █████ █ █ ███ █████ █ █ ████████ █████ █ █ █████████ █ █ ███ ███████ ███ █ █ ███ █████ █ █ ███████ █████ █ █ █████████ █ █ ███ ██████ █ █ ████ ██████ █ █ ██████████████████
sidebar_controller.js
██████ █ ██████████ █ ████ ████████████████████
██████ ███████ █████ ███████ ██████████ █
██████ ███████ █ █████████ ███████████ ████████ ████████ ████████ ██████████ █████████████ ███████████
██████ ██████ █ █
██████████ █ █████ ████████ ████████ █████ ██
█████ █ █████ ████████ ████████ █████ ██
██████ █ █████ ███████ ████████ ██████ ██
████████ █ █████ ████████ ████████ █████ █
█
Registro delle modifiche
- v1.0.0: Initial release with full and floating styles
Ottieni l'Accesso Completo
Sblocca il codice sorgente di questo componente e di tutti gli altri. Un solo pagamento per l'accesso a vita.
Ottieni l'Accesso Ora