Add a class to empty SVG element when image is not found #66
Conversation
|
I've begun using this helper in my daily development. The only issue I've had with it has been this use case. When an SVG is not found (usually because the image is being loaded dynamically) this gem dumps a loose By adding a simple helper class we can allow users to override the styling of the element in whichever way they please via CSS. |
There was a problem hiding this comment.
@meowsus thanks for the pull request. This looks like a solid, rational change to me. I had one question about the CSS class name, but otherwise I think we can ship this in a new release ASAP.
| @@ -12,7 +12,7 @@ def inline_svg(filename, transform_params={}) | |||
| configured_asset_file.named filename | |||
| end | |||
| rescue InlineSvg::AssetFile::FileNotFound | |||
| return "<svg><!-- SVG file not found: '#{filename}' #{extension_hint(filename)}--></svg>".html_safe | |||
| return "<svg class='svg-not-found'><!-- SVG file not found: '#{filename}' #{extension_hint(filename)}--></svg>".html_safe | |||
There was a problem hiding this comment.
I wonder if this CSS class should be something more specific to avoid potential collisions with existing user-defined classes. What do you think?
There was a problem hiding this comment.
My first thought was to make this configurable, but then I saw that this gem doesn't have configuration already. Maybe that might make sense to add as well? It would certainly help out the efforts of #48
There was a problem hiding this comment.
We could add this configuration to the InlineSvg::Configuration class. Is that the kind of configuration you were thinking?
We could use it like this:
InlineSvg.configure do |config|
config.svg_not_found_css_class = "my-custom-class"
end
|
@meowsus Out of curiosity, what was the resolution to this? |
|
@gerrywastaken It was merged into the latest patch in a different PR. Sorry for the confusion. |
By adding a class to the empty SVG element, users of this gem will be
able to conditionally style this use case and prevent the browser from
trying to size an empty SVG element on its own.