ruby-grape
how to override default assets?
I wanna to custom style for swagger,
I copy application.css from grape-swagger-rails and place into myapp/app/assets/stylesheets/grape_swagger_rails.
/*
*= require reset
*= require screen
*= require_self
*/
ul {
margin-left: 10px;
}
but it throw error:
couldn't find file 'reset'
I am not familiar with where Rails looks for these files, but I suspect that this require is relative, so it works when with other grape-swagger-rails assets. Maybe you need to tell Rails to add a CSS path from the gem? If you find out it would be great to document how to properly customize this.
Also, maybe you don't need to copy all this. Just add a stylesheet to your app and make sure it loads with the grape-swagger UI and override whatever styles you need?
I put a custom CSS file into app/assets/stylesheets/grape_swagger_rails, and also have a copy of grape-swagger-rails's index.html.erb in app/views/grape_swagger_rails/application. In my own index.html.erb, I add a css link tag to include the custom CSS file.
/app/assets/stylesheets/grape_swagger_rails/custom.css.scss
ul {
margin-left: 10px;
}
/app/views/grape_swagger_rails/index.html.erb
...
<head>
<title>...</title>
<%= stylesheet_link_tag 'grape_swagger_rails/application.css' %>
<%= stylesheet_link_tag 'grape_swagger_rails/custom.css' %>
...
</head>
...
/config/initializers/assets.rb
Rails.application.config.assets.precompile += %w(
grape_swagger_rails/custom.css
# other assets...
)
@abarre, yes, it works well for me. By the way, I'm using master branch, latest commit.
The idea of being able to customize the layout that the UI renders inside of seems like it would be a nice addition and within the scope of the gem. Maybe using some content_for statements within the index.html.erb in this project would allow dropping in a layout without without breaking any compatibility.
I'll leave this issue open as a reminder. If anybody would like to attempt a solution, feel free to take a whack at it.
@calfzhou Thanks so much for this solution, however this is a small mistake which might trip some people up. For the location of the index.html.erb the file path should be
/app/views/grape_swagger_rails/application/index.html.erb
Hey everyone, I just pushed a new test branch that splits out layout components so that you simply need to have a different layout file that contains a yield :head and yield statement, meaning that you're left with an essentially clean slate to impose your own style.
To change the default layout, simply overwrite the GrapeSwaggerRails.options.swagger_ui_layout with the location of your custom layout.
If you want to test out the gem locally, you can replace
gem 'grape-swagger-rails'
with
gem 'grape-swagger-rails', github: 'ruby-grape/grape-swagger-rails', branch: 'change-layout-test-branch'
and then run bundle update grape-swagger-rails.
Currently the features are undocumented and have no tests. If anybody has any recommendations or preferences, please share them here and I'll take them into consideration as I work on it. If you run into compatibility issues, please let me know.
This is awesome - thanks! :+1: Only issue I have is being able to access url helpers and things I've set up in my ApplicationController (like current_user) etc, but I can probably work round that for now. Any tips would be appreciated if there's anything obvious I can do though.
@TangMonk
It should be:
/*
*= require grape_swagger_rails/reset
*= require grape_swagger_rails/screen
*= require_self
*/
not
/*
*= require reset
*= require screen
*= require_self
*/
We wanted to keep most of what was there, so we forked the original repo and just added an option for pulling in our own stylesheet.
https://github.com/assignr/grape-swagger-rails
