Can anyone help me with an issue I'm having? I am trying to randomize images in a header on a category page using the following code, but it doesn't seem to be working. I keep getting this error:
Invalid CSS after "...ackground: url(": expected ")", was "<%= randomized_..."
The problematic line of code is:
#necklace_header {
background: url(<%= randomized_header_image %>) no-repeat center center fixed;
width: 100%;
In my views/categories/show.html.erb file, I have the following code:
<header id="necklace_header">
<h1>
<%= @category.name %>
</h1>
</header>
<%= render "categories/table", products: @products %>
<% if current_user && current_user.admin? %>
<%= link_to 'Edit', edit_category_path(@category) %> |
<% end %>
<%= link_to 'Back', root_path %>
In my categories.scss file, I have the following code snippet:
#necklace_header {
background: url(<%= randomized_header_image %>) no-repeat center center fixed;
width: 100%;
background-size: cover;
height: 360px;
margin-bottom: 20px;
}
Additionally, in the application_helper.rb file, I defined the function for randomized_header_image as follows:
module ApplicationHelper
def randomized_header_image
images = ["assets/foo.jpg", "assets/random.jpg", "assets/super_random"]
images[rand(images.size)]
end
end
As someone new to Rails and web development, I am struggling to resolve this issue. Any assistance or clarification would be greatly appreciated.