Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
- <span class="sr-only">Toggle navigation</span>
- <span class="icon-bar top-bar"></span>
- <span class="icon-bar middle-bar"></span>
- <span class="icon-bar bottom-bar"></span>
- </button>
- CSS
- navbar-toggle {
- border: none;
- background: transparent !important;
- &:hover {
- background: transparent !important;
- }
- .icon-bar {
- width: 22px;
- transition: all 0.2s;
- }
- .top-bar {
- transform: rotate(45deg);
- transform-origin: 10% 10%;
- }
- .middle-bar {
- opacity: 0;
- }
- .bottom-bar {
- transform: rotate(-45deg);
- transform-origin: 10% 90%;
- }
- }
- .navbar-toggle.collapsed {
- .top-bar {
- transform: rotate(0);
- }
- .middle-bar {
- opacity: 1;
- }
- .bottom-bar {
- transform: rotate(0);
- }
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement