Skip to content

Commit 26728c0

Browse files
jacobmllr95jacobmllr95
authored
Merge branch 'dev' into feat-docs-improve-icons-page
2 parents 3abf6dd + e0de687 commit 26728c0

File tree

7 files changed

+29
-15
lines changed

7 files changed

+29
-15
lines changed

‎src/components/form-tags/_form-tags.scss

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,12 @@
11
.b-form-tags {
2+
.b-form-tags-list {
3+
margin-top: -0.25rem;
4+
5+
.b-form-tag {
6+
margin-top: 0.25rem;
7+
}
8+
}
9+
210
&.focus {
311
color: $input-focus-color;
412
background-color: $input-focus-bg;
@@ -32,6 +40,7 @@
3240
font-size: 75%;
3341
font-weight: normal;
3442
line-height: $input-line-height;
43+
margin-right: 0.25rem;
3544

3645
&.disabled {
3746
opacity: 0.75;
@@ -43,6 +52,7 @@
4352
font-size: 125%;
4453
line-height: 1;
4554
float: none;
55+
margin-left: 0.25rem;
4656
}
4757
}
4858

‎src/components/form-tags/form-tag.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,7 @@ export const BFormTag = /*#__PURE__*/ Vue.extend({
5454
let $remove = h()
5555
if (!this.disabled) {
5656
$remove = h(BButtonClose, {
57-
staticClass: 'b-form-tag-remove ml-1',
57+
staticClass: 'b-form-tag-remove',
5858
props: { ariaLabel: this.removeLabel },
5959
attrs: {
6060
'aria-controls': tagId,

‎src/components/form-tags/form-tags.js

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -557,7 +557,6 @@ export const BFormTags = /*#__PURE__*/ Vue.extend({
557557
BFormTag,
558558
{
559559
key: `li-tag__${tag}`,
560-
staticClass: 'mt-1 mr-1',
561560
class: tagClass,
562561
props: {
563562
// `BFormTag` will auto generate an ID
@@ -639,7 +638,7 @@ export const BFormTags = /*#__PURE__*/ Vue.extend({
639638
'li',
640639
{
641640
key: '__li-input__',
642-
staticClass: 'flex-grow-1 mt-1',
641+
staticClass: 'flex-grow-1',
643642
attrs: {
644643
role: 'none',
645644
'aria-live': 'off',
@@ -654,7 +653,7 @@ export const BFormTags = /*#__PURE__*/ Vue.extend({
654653
'ul',
655654
{
656655
key: '_tags_list_',
657-
staticClass: 'list-unstyled mt-n1 mb-0 d-flex flex-wrap align-items-center',
656+
staticClass: 'b-form-tags-list list-unstyled mb-0 d-flex flex-wrap align-items-center',
658657
attrs: { id: tagListId }
659658
},
660659
[$tags, $field]

‎src/icons/helpers/icon-base.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ const baseAttrs = {
5252
height: '1em',
5353
focusable: 'false',
5454
role: 'img',
55-
alt: 'icon'
55+
'aria-label': 'icon'
5656
}
5757

5858
// Attributes that are nulled out when stacked
@@ -61,7 +61,7 @@ const stackedAttrs = {
6161
height: null,
6262
focusable: null,
6363
role: null,
64-
alt: null
64+
'aria-label': null
6565
}
6666

6767
// Shared private base component to reduce bundle/runtime size

‎src/icons/helpers/make-icon.js

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,9 @@ import { commonIconProps, BVIconBase } from './icon-base'
1313
export const makeIcon = (name, content) => {
1414
// For performance reason we pre-compute some values, so that
1515
// they are not computed on each render of the icon component
16+
const kebabName = kebabCase(name)
1617
const iconName = `BIcon${pascalCase(name)}`
17-
const iconNameClass = `bi-${kebabCase(name)}`
18+
const iconNameClass = `bi-${kebabName}`
1819
const svgContent = trim(content || '')
1920
// Return the icon component definition
2021
return /*#__PURE__*/ Vue.extend({
@@ -30,7 +31,11 @@ export const makeIcon = (name, content) => {
3031
render(h, { data, props }) {
3132
return h(
3233
BVIconBase,
33-
mergeData(data, { staticClass: iconNameClass, props: { ...props, content: svgContent } })
34+
mergeData(data, {
35+
staticClass: iconNameClass,
36+
props: { ...props, content: svgContent },
37+
attrs: { 'aria-label': kebabName.replace(/-/g, ' ') }
38+
})
3439
)
3540
}
3641
})

‎src/icons/icons.spec.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ describe('icons', () => {
2222
expect(wrapper.classes()).toContain('bi-alarm-fill')
2323
expect(wrapper.classes().length).toBe(3)
2424
expect(wrapper.attributes('role')).toBe('img')
25-
expect(wrapper.attributes('alt')).toBe('icon')
25+
expect(wrapper.attributes('aria-label')).toBe('alarm fill')
2626
expect(wrapper.attributes('focusable')).toBe('false')
2727
expect(wrapper.attributes('xmlns')).toBe('http://www.w3.org/2000/svg')
2828
expect(wrapper.attributes('width')).toBe('1em')
@@ -54,7 +54,7 @@ describe('icons', () => {
5454
expect(wrapper.classes()).toContain('bi-alarm-fill')
5555
expect(wrapper.classes().length).toBe(3)
5656
expect(wrapper.attributes('role')).not.toBe('img')
57-
expect(wrapper.attributes('alt')).not.toBe('icon')
57+
expect(wrapper.attributes('aria-label')).not.toBe('icon')
5858
expect(wrapper.attributes('focusable')).not.toBe('false')
5959
expect(wrapper.attributes('focusable')).not.toBe('true')
6060
expect(wrapper.attributes('xmlns')).not.toBe('http://www.w3.org/2000/svg')
@@ -153,7 +153,7 @@ describe('icons', () => {
153153
expect(wrapper.classes()).toContain('text-danger')
154154
expect(wrapper.classes().length).toBe(4)
155155
expect(wrapper.attributes('role')).toBe('img')
156-
expect(wrapper.attributes('alt')).toBe('icon')
156+
expect(wrapper.attributes('aria-label')).toBe('alarm fill')
157157
expect(wrapper.attributes('focusable')).toBe('false')
158158
expect(wrapper.find('svg > g').exists()).toBe(true)
159159
expect(wrapper.find('svg > g').attributes('transform')).not.toBeDefined()
@@ -178,7 +178,7 @@ describe('icons', () => {
178178
expect(wrapper.classes()).toContain('bi-alarm-fill')
179179
expect(wrapper.classes().length).toBe(3)
180180
expect(wrapper.attributes('role')).toBe('img')
181-
expect(wrapper.attributes('alt')).toBe('icon')
181+
expect(wrapper.attributes('aria-label')).toBe('alarm fill')
182182
expect(wrapper.attributes('focusable')).toBe('false')
183183
expect(wrapper.attributes('style')).toBeDefined()
184184
expect(wrapper.element.style.fontSize).toEqual('125%')

‎src/icons/iconstack.spec.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ describe('icons > b-iconstack', () => {
1212
expect(wrapper.classes()).toContain('bi')
1313
expect(wrapper.classes().length).toBe(3)
1414
expect(wrapper.attributes('role')).toBe('img')
15-
expect(wrapper.attributes('alt')).toBe('icon')
15+
expect(wrapper.attributes('aria-label')).toBe('icon')
1616
expect(wrapper.attributes('focusable')).toBe('false')
1717
expect(wrapper.attributes('xmlns')).toBe('http://www.w3.org/2000/svg')
1818
expect(wrapper.attributes('width')).toBe('1em')
@@ -43,7 +43,7 @@ describe('icons > b-iconstack', () => {
4343
expect(wrapper.classes()).toContain('text-danger')
4444
expect(wrapper.classes().length).toBe(4)
4545
expect(wrapper.attributes('role')).toBe('img')
46-
expect(wrapper.attributes('alt')).toBe('icon')
46+
expect(wrapper.attributes('aria-label')).toBe('icon')
4747
expect(wrapper.attributes('focusable')).toBe('false')
4848
expect(wrapper.find('svg > g').exists()).toBe(true)
4949
expect(wrapper.find('svg > g').attributes('transform')).not.toBeDefined()
@@ -65,7 +65,7 @@ describe('icons > b-iconstack', () => {
6565
expect(wrapper.classes()).toContain('bi')
6666
expect(wrapper.classes().length).toBe(3)
6767
expect(wrapper.attributes('role')).toBe('img')
68-
expect(wrapper.attributes('alt')).toBe('icon')
68+
expect(wrapper.attributes('aria-label')).toBe('icon')
6969
expect(wrapper.attributes('focusable')).toBe('false')
7070
expect(wrapper.attributes('style')).toBeDefined()
7171
expect(wrapper.element.style.fontSize).toEqual('125%')

0 commit comments

Comments
 (0)