Increase the filter menu margins
This will increase readability of filter menu options, by preventing
the wrapping up of long options/labels.
Signed-off-by: Sandeepa Singh <sandeepa.singh@ibm.com>
Change-Id: I75199b7608b5aeed067530e374e45750e26bb6eb
diff --git a/src/assets/styles/bmc/custom/_dropdown.scss b/src/assets/styles/bmc/custom/_dropdown.scss
index e4de581..969c4c6 100644
--- a/src/assets/styles/bmc/custom/_dropdown.scss
+++ b/src/assets/styles/bmc/custom/_dropdown.scss
@@ -4,7 +4,8 @@
padding: 0;
}
.dropdown-item {
- padding-left: $spacer/2;
+ padding-left: $spacer/4;
+ margin-top: -1 * $spacer/4;
}
.b-dropdown-form {
padding: $spacer/2;
diff --git a/src/components/Global/TableFilter.vue b/src/components/Global/TableFilter.vue
index 7b87942..7c66bea 100644
--- a/src/components/Global/TableFilter.vue
+++ b/src/components/Global/TableFilter.vue
@@ -35,7 +35,9 @@
:value="value"
:data-test-id="`tableFilter-checkbox-${value}`"
>
- {{ value }}
+ <b-dropdown-item>
+ {{ value }}
+ </b-dropdown-item>
</b-form-checkbox>
</b-form-checkbox-group>
</b-form-group>