我正在嘗試撰寫一個自定義構建器以與Rails 上的 Breadcrumbs一起使用。我將 Tailwind 用于我的樣式,但它似乎不能很好地與 Rails 生成的代碼配合使用。
我有以下構建器:
class TailwindBreadcrumbsBuilder < BreadcrumbsOnRails::Breadcrumbs::Builder
def render
@context.content_tag(:nav, class: 'flex py-3 px-5 text-slate-700 bg-slate-50 rounded-lg border border-slate-200', aria: { label: 'Breadcrumb' }) do
@context.content_tag(:ol, class: 'inline-flex items-center space-x-1 md:space-x-3') do
@elements.collect do |element|
render_element(element)
end.join.html_safe
end
end
end
def render_element(element)
current = @context.current_page?(compute_path(element))
aria = current ? { aria: { current: 'page' } } : {}
@context.content_tag(:li, aria) do
@context.content_tag(:div, class: 'flex items-center') do
link_or_text = @context.link_to_unless_current(compute_name(element), compute_path(element), element.options.merge(class: 'ml-1 text-sm font-medium text-slate-700 hover:text-white md:ml-2'))
divider = @context.content_tag(:span, (@options[:separator] || '>').html_safe, class: 'divider') unless current
link_or_text (divider || '')
end
end
end
end
我初始化頁面上的面包屑:
<%= render_breadcrumbs builder: ::TailwindBreadcrumbsBuilder %>
但是,并非所有樣式都被應用(例如,懸停時的白色文本不起作用)。
我懷疑 Tailwind 服務器不會編譯這些類,因為它們是 Ruby 生成的。知道如何讓這個構建器與 Tailwind 一起作業嗎?
提前致謝
uj5u.com熱心網友回復:
如果您使用的是 Tailwind v3,則默認情況下會“清除”這些類。
由于這是一個 ruby?? 助手,我假設這個特定檔案沒有添加content到tailwind.config.js.
也許嘗試添加類似這樣的組態檔:
module.exports = {
content: [
"./app/views/**/*.html.erb",
"./app/helpers/**/*.rb",
"./app/javascript/**/*.js",
"path/to/your/file.rb"
],
// ... your other configs
}
希望有幫助!
轉載請註明出處,本文鏈接:https://www.uj5u.com/qita/482602.html
