Fixing the toggle button for mobile
We created our page using the principles of mobile-first development, although some of the components here are not appearing properly or are simply not appearing, and we must fix that.
First is the toggle button, .navbar-toggle
, in the navigation bar. It is actually appearing, but with a really bad colorization. Let's fix that with some CSS:
.navbar-toggle { border-color: #252830; background-color: #e5e9ec; margin-top: 13px } .navbar-toggle .icon-bar { background-color: #252830; }
The toggle button should appear like what is shown in the next screenshot, now using gray colors:
As you can see, there are many other things that we can do to improve the visualization in mobiles and small viewports. We will fix all that in the next chapters while adding some more cool effects. Wait and you will see!