accordion.rb in card-1.92

- old
+ new

@@ -1,7 +1,8 @@
 format :html do
-  def accordion_group list, collapse_id=card.cardname.safe_key, args={}
+  def accordion_group list, collapse_id=nil, args={}
+    collapse_id ||= card.cardname.safe_key
     accordions = ""
     index = 1
     case list
     when Array then accordions = list.join
     when String then accordions = list
@@ -9,12 +10,11 @@
       list.each_pair do |title, content|
         accordions << accordion(title, content, "#{collapse_id}-#{index}")
         index += 1
       end
     end
-    add_class args, "panel-group"
-
+    add_class args, "act-accordion-group w-100"
     wrap_with :div, class: args[:class], id: "accordion-#{collapse_id}",
                     role: "tablist", "aria-multiselectable" => "true" do
       accordions
     end
   end
@@ -25,38 +25,38 @@
       when Hash  then accordion_group(content, collapse_id)
       when Array then content.present? && list_group(content)
       when String then content
       end
     <<-HTML.html_safe
-      <div class="panel panel-default">
+      <div class="card">
         #{accordion_panel(title, accordion_content, collapse_id)}
       </div>
     HTML
   end
 
   def accordion_panel title, body, collapse_id, _panel_heading_link=false
     if body
       <<-HTML
-        <div class="panel-heading" role="tab" id="heading-#{collapse_id}">
-          <h4 class="panel-title">
+        <div class="card-header" role="tab" id="heading-#{collapse_id}">
+          <h5 class="mb-0">
             <a data-toggle="collapse" data-parent="#accordion-#{collapse_id}" \
                href="##{collapse_id}" aria-expanded="true" \
                aria-controls="#{collapse_id}">
               #{title}
             </a>
-          </h4>
+          </h5>
         </div>
-        <div id="#{collapse_id}" class="panel-collapse collapse" \
+        <div id="#{collapse_id}" class="collapse" \
                role="tabpanel" aria-labelledby="heading-#{collapse_id}">
-          <div class="panel-body">
+          <div class="card-block">
             #{body}
           </div>
         </div>
       HTML
     else
       <<-HTML
         <li class="list-group-item">
-          <h4 class="panel-title">#{title}</h4>
+          <h4 class="card-header">#{title}</h4>
         </li>
       HTML
     end
   end
 end