Loomio

Angular design tweaks for dashboard

Aaron Thornton PublicSeen by 24

I havn't contributed for a while, but I am tied of squinting to look past the unfinished styling. No offence to anybody it's the last thing to get to, but sometimes the most important too.

Attached is a before and after screen shot and some commented css styles.
I have keep this as text as we all know this is a subjective art and some if not all can be used or discarded.

Some of the styles will need to be tested and carried though out the app before they go live.

Aaron Thornton

`
- change fa-bell to fa-bell-o
- remove bold from filters
- make main Loomio rounded square to be consistent with profile images

// position square logo
.lmo-navbar-logo {
padding: 3px;
}

// align width and position of search bar to match thread containers on big screens
.lmo-navbar-search {
max-width: 645px;
padding-left: 5px;
}

// adjust btn-group margin so gap between icons is less dominant and matches loom icon
.lmo-navbar-buttons {
margin-left: 10px;
}

// bring icons closer by removing button margins
.lmo-navbar-item {
margin: 0;
}

// bring icons closer by reducing padding
.lmo-navbar-btn {
padding: 6px 3px;
}

// reduce initial page margin before filters
.main-container {
padding-top: 46px;
}`

Aaron Thornton

I loose track of who is in charge of this stuff so I am just mentioning people I know have had design input prior. We need to slowly clean it up to be taken seriously as a sass product.
@matthewbartlett, @richarddbartlett, @jonlemmon, @robertguthrie, @jessedoud

Richard D. Bartlett

Nice one Aaron. I mostly agree with your changes. It's great to have an extra pair of eyes (and fingers!) on this stuff. Some notes:

  • fa-bell-o is way nicer than fa-bell
  • agree filters shouldn't be bold. I left them that way to raise the question of whether the dropdown buttons on the group page should be bold or not
  • I'm dissatisfied with our loomio branding generally. have put some money in the budget for a project on it this quarter. Will also look at developing some custom in-app icons as part of that work.

Aaron Thornton

Cool nice rich, forgot to mention the caret instead of chevron looks cleaner too(app wide)