Brady is part of the thoughtbot Elixir family of projects.
Brady provides helper functions for use within Phoenix templates.
Add brady to your list of dependencies in mix.exs
:
def deps do
[
{:brady, "~> 0.0.10"},
]
end
And configure it in config.exs
:
config :brady, otp_app: :my_app
The body_class function can be used like:
body class="<%= Brady.body_class @conn %>"
This will produce a string including the controller name and controller-action name. For example, The WidgetsController#show action would produce:
widgets widgets-show
To inline an image, you may use the Brady.data_uri/1
function. Pass in the
path relative to priv/static
and Brady will read the file, base64 encode it, and
return the data uri that is compatible to use within an <img>
tag.
For example:
<%= img_tag(Brady.data_uri("images/placeholder.gif"), alt: "Celery Man" %>
It's not recommended to inline images that are more than a few kilobytes in size. By default, Brady will emit a warning when inlining an image more than 2kb. You can configure this yourself with Mix config:
config :brady,
otp_app: :my_app,
inline_threshold: 10_240
The inline_svg function works by passing in your SVG file name and, optionally, any CSS attributes you'd like to apply to the SVG.
<%= Brady.inline_svg("foo", class: "bar") %>
This will embed the html safe raw SVG in your markup.
{:safe, ~s(<svg class="foo" data-role="bar" height="100" width="100"><desc>This is a test svg</desc><circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red"></circle></svg>)}
By default, it looks for files in priv/static/svg/#{file_name}.svg
but you can
configure this in your config.exs
config :brady,
otp_app: :my_app,
svg_path: "web/static/images"
See the CONTRIBUTING document. Thank you, contributors!
Brady is Copyright (c) 2015 thoughtbot, inc. It is free software, and may be redistributed under the terms specified in the LICENSE file.
Brady is maintained and funded by thoughtbot, inc. The names and logos for thoughtbot are trademarks of thoughtbot, inc.
We love open source software, Elixir, and Phoenix. See our other Elixir projects, or hire our Elixir Phoenix development team to design, develop, and grow your product.