How to insert instance variable as css rule in Rails?

Question

Let's say I've got AR class:

.........
  store :skin_properties, accessors: [
    :background_color,
    :font_size,
    :font_family,
    :color
  ]
.........

Which save values in this way:

{"background_color"=>"#f2f2f2", "font_size"=>"20px", "font_family"=>"Verdana", "color"=>"#000000"}

How can I insert it in edit.haml file as inline css?

I tried something like this, but it's not working ...

:sass
  body
    [email protected]_properties.each_with_index do |(k,v)|
      "#{k.gsub("_","-")}:#{v};"

Piotr Kruczek · Accepted Answer · 2015-06-30 11:39:00Z

1

You could try converting the hash to a style property of some tag.

Example: change

{"background_color"=>"#f2f2f2"}

to

style: {'background-color: #f2f2f2'}

answered Jun 30, 2015 at 11:39

Piotr Kruczek

2,38813 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Surya · Accepted Answer · 2015-06-30 11:50:13Z

1

You are silently running ruby code(i.e. using -, instead of =).

Also, try using dasherize for such case:

:sass
    body
       = @user.skin_properties.map{|k,v| "#{k.dasherize}: #{v};" }.join

answered Jun 30, 2015 at 11:50

Surya

16k3 gold badges55 silver badges77 bronze badges

Comments

Cyzanfar · Accepted Answer · 2015-06-30 11:38:03Z

0

I believe you need to do it this way. I don't use haml so you'll need to convert it yourself:

:sass
  body
    <% @user.skin_properties.each_with_index do |(k,v)| %>
      <%= "#{k.gsub("_","-")}:#{v};" %>
    <% end %>

answered Jun 30, 2015 at 11:38

Cyzanfar

7,1849 gold badges47 silver badges82 bronze badges

2 Comments

Justin Over a year ago

A bit nit picky, but what do you think about using sub over gsub for a little speed boost, since it looks like each property only contains at most 1 underscore.

Cyzanfar Over a year ago

Yes I think you're right, sub would be a bit more efficient since you are only substituting one character instead of changing all characters with the global gsub. Does that answer your question?

Jack · Accepted Answer · 2015-06-30 11:41:00Z

0

:sass
    body
       [email protected]_properties.map{|k,v| "#{k.gsub("_","-")}:#{v};" }.join

answered Jun 30, 2015 at 11:41

Jack

2,3893 gold badges16 silver badges23 bronze badges

1 Comment

Okku Over a year ago

You should give some explanation for your answer.

user2931706 · Accepted Answer · 2015-06-30 22:10:03Z

0

Thanks everybody, came up with something like this:

- css = @user.skin_properties.map {|k,v| "#{k.dasherize}: #{v};" }.join("\n")
%style== body { #{css} }

answered Jun 30, 2015 at 22:10

user2931706

1951 silver badge11 bronze badges

Collectives™ on Stack Overflow

How to insert instance variable as css rule in Rails?

5 Answers 5

Comments

Comments

2 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related