billiedemott / spoutlets.com

Wireframes for various projects
0 stars 0 forks source link

Design of side-nav and top-nav should be changed #88

Closed akshatpradhan closed 12 years ago

akshatpradhan commented 12 years ago

I redid the Sidebar nav and the top navbar http://cdn.dropmark.com/17874/66c5bcdbb353474077a748ce4d9cd0e1fdd58b93/mood-tools-v01-plain.png

Here's how everything looks with the 12 column grid. http://akshatpradhan.dropmark.com/49897/528629

Notice a couple things

  1. The sidebar only takes up 2 columns and the top menu bar starts at the beginning of the 3rd column.
  2. The icons are 32x32. The images show sample icons, but we should still use the glphicons. Resize the icons in the ai file to be 32x32 and export into a sprite.
  3. Who's venting what takes up 2 columns.
  4. The distance between the navbar and top-menu-bar is 18px. That's the same as Bootstrap's baseLineHeight which is also 18px.
  5. I didn't wireframe "Who's Venting What". But I want you to try and make "Who's venting what?" work so that have everything fits comfortably.
akshatpradhan commented 12 years ago

Can you add these two quick corrections?

http://akshatpradhan.dropmark.com/49897/538841

And the colors I reference for the side bar look like this

http://akshatpradhan.dropmark.com/49897/538850

fcjne commented 12 years ago

A, do you mean move icons/words to the left relative to the tab or sidebar? In latest commit I moved them relative to the sidebar. Please check if this correct.

akshatpradhan commented 12 years ago

D, the icons should be centered relative to the 2 columns of the 12 column grid. Also, Support Circle should be on one line