search

thoughtbot / suspenders

A Rails template with our standard defaults.
https://thoughtbot.com
MIT License
4.01k stars 529 forks source link

Flashes not styled. #390

Closed slothbear closed 9 years ago

slothbear commented 10 years ago

I created a new app via suspenders. Flash messages appear in the right spot, but they are not styled with background color/etc.

The _flashes.html.erb partial creates a div with the id flash_notice, but _flashes.scss declares %flash-notice (with a hyphen). I noticed there have been changes – perhaps it is just the combination of versions I have.

test app: https://github.com/slothbear/suspenders-flash http://suspenders-flash.herokuapp.com/

Jberczel commented 10 years ago

I had the same problem. As a workaround, I changed the _flashes.scss selectors to get it to work.

For example: %flash-alertto #flash_alert and it worked in my suspenders app.

I'm new to sass, rails, everything, so I'm curious what the best solution is.

croaky commented 10 years ago

@kylefiedler What do you think?

https://github.com/thoughtbot/bitters/blob/master/app/assets/stylesheets/extends/_flashes.scss https://github.com/thoughtbot/suspenders/blob/master/templates/_flashes.html.erb

kylefiedler commented 10 years ago

We're going to be taking flashes out Bitters: https://github.com/thoughtbot/bitters/pull/106and moving them to Refills: https://github.com/thoughtbot/refills/pull/138. Once those PRs get merged we could add the Refills gem and add the flashes as classes instead of silent extends.

croaky commented 9 years ago

@kylefiedler What needs to happen to have Suspenders to use Refills' Flash component?

adnissen commented 9 years ago

Just ran into this as well. Would be more than happy to submit a PR to use the Refills' styling.

kylefiedler commented 9 years ago

@croaky I would think we would want to first install refills and then rails generate refills:import flashes. We'd then need to @import the flashes.scss file into application.css.scss and change the flashes.html.erb file to have classes not ids.

@adnissen if you want to take a shot that'd be awesome.

croaky commented 9 years ago

@kylefiedler Should we also drop the outer <div id="flash">? Seems like it isn't used.

croaky commented 9 years ago

@kylefiedler Any other snippets we should importing from Refills?

croaky commented 9 years ago

@kylefiedler How does https://github.com/thoughtbot/suspenders/pull/454 look?