From e82e6b4bfd04489d0c97e6fffd3c385fd11ee2ac Mon Sep 17 00:00:00 2001
From: Kenji Okimoto <okimoto@clear-code.com>
Date: Thu, 4 Oct 2018 18:06:00 +0900
Subject: [PATCH] Use b-card

Signed-off-by: Kenji Okimoto <okimoto@clear-code.com>
---
 app/views/shared/settings/_form.html.haml     | 14 +++++++------
 .../shared/vue/_owned_plugin_form.html.haml   | 20 ++++++++++---------
 .../shared/vue/_parser_plugin_form.html.haml  | 20 ++++++++++---------
 3 files changed, 30 insertions(+), 24 deletions(-)

diff --git a/app/views/shared/settings/_form.html.haml b/app/views/shared/settings/_form.html.haml
index a4c4b1e..837a1f2 100644
--- a/app/views/shared/settings/_form.html.haml
+++ b/app/views/shared/settings/_form.html.haml
@@ -43,12 +43,14 @@
                          "v-bind:plugin-label" => "'Format'"}
 
     - if setting.advanced_options.present?
-      .card.card-body.bg-light
-        %h4{"v-b-toggle" => "'advanced-setting'"}
-          = icon('fa-caret-down')
-          = t('terms.advanced_setting')
+      %b-card(no-body){"bg-variant" => "light"}
+        %template{"slot" => "header"}
+          %h4{"v-b-toggle" => "'advanced-setting'"}
+            = icon('fa-caret-down')
+            = t('terms.advanced_setting')
         %b-collapse{"id" => "advanced-setting"}
-          - setting.advanced_options.each do |key|
-            = form.field(key)
+          %b-card-body
+            - setting.advanced_options.each do |key|
+              = form.field(key)
 
     = form.submit t('fluentd.common.finish'), class: "btn btn-lg btn-primary float-right mt-3"
diff --git a/app/views/shared/vue/_owned_plugin_form.html.haml b/app/views/shared/vue/_owned_plugin_form.html.haml
index 0a818d0..bd3d80f 100644
--- a/app/views/shared/vue/_owned_plugin_form.html.haml
+++ b/app/views/shared/vue/_owned_plugin_form.html.haml
@@ -2,7 +2,7 @@
 
 %script{type: "text/x-template", id: "vue-owned-plugin-form"}
   .form-group.card.bg-light.mb-3{"v-bind:id" => "id"}
-    .card-body
+    %b-card{"bg-variant" => "light"}
       %label{"v-bind:for" => "selectId(pluginType)"}
         {{ pluginLabel }}
       %select{"v-bind:id" => "selectId(pluginType)",
@@ -20,12 +20,14 @@
                     "v-bind:plugin-type" => "pluginType",
                     "v-bind:option" => "option"}
       %template{"v-if" => '!_.isEmpty(advancedOptions)'}
-        .card.card-body.bg-light
-          %h4{"v-b-toggle" => "`${id}-advanced-setting`"}
-            = icon('fa-caret-down')
-            = t('terms.advanced_setting')
+        %b-card(no-body){"bg-variant" => "light"}
+          %template{"slot" => "header"}
+            %h4{"v-b-toggle" => "`${id}-advanced-setting`"}
+              = icon('fa-caret-down')
+              = t('terms.advanced_setting')
           %b-collapse{"v-bind:id" => "`${id}-advanced-setting`"}
-            %config-field{"v-for" => "option in advancedOptions",
-                          "v-bind:key" => "option.name",
-                          "v-bind:plugin-type" => "pluginType",
-                          "v-bind:option" => "option"}
+            %b-card-body
+              %config-field{"v-for" => "option in advancedOptions",
+                            "v-bind:key" => "option.name",
+                            "v-bind:plugin-type" => "pluginType",
+                            "v-bind:option" => "option"}
diff --git a/app/views/shared/vue/_parser_plugin_form.html.haml b/app/views/shared/vue/_parser_plugin_form.html.haml
index 73289c6..7153429 100644
--- a/app/views/shared/vue/_parser_plugin_form.html.haml
+++ b/app/views/shared/vue/_parser_plugin_form.html.haml
@@ -3,7 +3,7 @@
 
 %script{type: "text/x-template", id: "vue-parser-plugin-form"}
   .form-group.card.bg-light.mb-3{"v-bind:id" => "id"}
-    .card-body
+    %b-card{"bg-variant" => "light"}
       %label{"v-bind:for" => "selectId(pluginType)"}
         {{ pluginLabel }}
       %select{"v-bind:id" => "selectId(pluginType)",
@@ -27,12 +27,14 @@
                         "v-bind:initial-text-value" => "initialParams[option.name]",
                         "v-on:change-parse-config" => "onChangeParseConfig"}
         %template{"v-if" => '!_.isEmpty(advancedOptions)'}
-          .card.card-body.bg-light
-            %h4{"v-b-toggle" => '"parser-section-advanced-setting"'}
-              = icon('fa-caret-down')
-              = t('terms.advanced_setting')
+          %b-card(no-body){"bg-variant" => "light"}
+            %template{"slot" => "header"}
+              %h4{"v-b-toggle" => '"parser-section-advanced-setting"'}
+                = icon('fa-caret-down')
+                = t('terms.advanced_setting')
             %b-collapse{"id" => "parser-section-advanced-setting"}
-              %config-field{"v-for" => "option in advancedOptions",
-                            "v-bind:key" => "option.name",
-                            "v-bind:plugin-type" => "pluginType",
-                            "v-bind:option" => "option"}
+              %b-card-body
+                %config-field{"v-for" => "option in advancedOptions",
+                              "v-bind:key" => "option.name",
+                              "v-bind:plugin-type" => "pluginType",
+                              "v-bind:option" => "option"}