Skip to content

Commit

Permalink
fix(b-tags): replace spacing utility with static CSS (fixes #5523) (#…
Browse files Browse the repository at this point in the history
…5544)

* remove spacing utility

* use mt-auto for better centering

* update

* add new class to avoid issues with custom rendering

Co-authored-by: Jacob Müller <jacob.mueller.elz@gmail.com>
  • Loading branch information
Hiws and jacobmllr95 authored Jul 16, 2020
1 parent 72a1363 commit e0de687
Show file tree
Hide file tree
Showing 3 changed files with 13 additions and 4 deletions.
10 changes: 10 additions & 0 deletions src/components/form-tags/_form-tags.scss
Original file line number Diff line number Diff line change
@@ -1,4 +1,12 @@
.b-form-tags {
.b-form-tags-list {
margin-top: -0.25rem;

.b-form-tag {
margin-top: 0.25rem;
}
}

&.focus {
color: $input-focus-color;
background-color: $input-focus-bg;
Expand Down Expand Up @@ -32,6 +40,7 @@
font-size: 75%;
font-weight: normal;
line-height: $input-line-height;
margin-right: 0.25rem;

&.disabled {
opacity: 0.75;
Expand All @@ -43,6 +52,7 @@
font-size: 125%;
line-height: 1;
float: none;
margin-left: 0.25rem;
}
}

Expand Down
2 changes: 1 addition & 1 deletion src/components/form-tags/form-tag.js
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ export const BFormTag = /*#__PURE__*/ Vue.extend({
let $remove = h()
if (!this.disabled) {
$remove = h(BButtonClose, {
staticClass: 'b-form-tag-remove ml-1',
staticClass: 'b-form-tag-remove',
props: { ariaLabel: this.removeLabel },
attrs: {
'aria-controls': tagId,
Expand Down
5 changes: 2 additions & 3 deletions src/components/form-tags/form-tags.js
Original file line number Diff line number Diff line change
Expand Up @@ -557,7 +557,6 @@ export const BFormTags = /*#__PURE__*/ Vue.extend({
BFormTag,
{
key: `li-tag__${tag}`,
staticClass: 'mt-1 mr-1',
class: tagClass,
props: {
// `BFormTag` will auto generate an ID
Expand Down Expand Up @@ -639,7 +638,7 @@ export const BFormTags = /*#__PURE__*/ Vue.extend({
'li',
{
key: '__li-input__',
staticClass: 'flex-grow-1 mt-1',
staticClass: 'flex-grow-1',
attrs: {
role: 'none',
'aria-live': 'off',
Expand All @@ -654,7 +653,7 @@ export const BFormTags = /*#__PURE__*/ Vue.extend({
'ul',
{
key: '_tags_list_',
staticClass: 'list-unstyled mt-n1 mb-0 d-flex flex-wrap align-items-center',
staticClass: 'b-form-tags-list list-unstyled mb-0 d-flex flex-wrap align-items-center',
attrs: { id: tagListId }
},
[$tags, $field]
Expand Down

1 comment on commit e0de687

@vercel
Copy link

@vercel vercel bot commented on e0de687 Jul 16, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.