@brightspace-ui/core 3.28.1 → 3.28.3

Sign up to get free protection for your applications and to get access to all the features.
@@ -271,9 +271,9 @@ Nested menus can be defined by placing a `d2l-menu` inside a `d2l-menu-item`. F
271
271
  </d2l-menu>
272
272
  ```
273
273
 
274
- ## ACCESSIBILITY
274
+ ## Accessibility
275
275
 
276
- - The `label` property for `d2l-menu` is only required for the root menu
277
- - For nested menus, the label is automatically applied based on its parent menu-item
278
276
  - The `d2l-menu` component and its items all follow W3C's [menu](https://www.w3.org/WAI/ARIA/apg/patterns/menubar/) pattern best practices
279
277
  - This includes the expected keyboard behaviour, which allows for seamless navigation within the menu and any submenus within it
278
+ - The `label` property for `d2l-menu` is only required for the root menu
279
+ - For nested menus, the label is automatically applied based on its parent menu-item
@@ -25,25 +25,16 @@ class MeterLinear extends MeterMixin(RtlMixin(LitElement)) {
25
25
  }
26
26
 
27
27
  :host > div {
28
- display: block;
28
+ display: flex;
29
+ flex-direction: column;
30
+ gap: 0.45rem;
29
31
  }
30
32
 
31
33
  :host([text-inline]) > div {
32
34
  align-items: center;
33
- display: flex;
34
35
  flex-direction: row;
35
36
  }
36
37
 
37
- :host([text-inline]) .d2l-meter-linear-full-bar {
38
- margin-bottom: 0;
39
- margin-left: 0;
40
- margin-right: 0.45rem;
41
- }
42
- :host([dir="rtl"][text-inline]) .d2l-meter-linear-full-bar {
43
- margin-left: 0.45rem;
44
- margin-right: 0;
45
- }
46
-
47
38
  .d2l-meter-linear-full-bar,
48
39
  .d2l-meter-linear-inner-bar {
49
40
  border-radius: 0.225rem;
@@ -54,7 +45,6 @@ class MeterLinear extends MeterMixin(RtlMixin(LitElement)) {
54
45
 
55
46
  .d2l-meter-linear-full-bar {
56
47
  background-color: var(--d2l-color-gypsum);
57
- margin-bottom: 0.45rem;
58
48
  position: relative;
59
49
  }
60
50
 
@@ -64,14 +54,11 @@ class MeterLinear extends MeterMixin(RtlMixin(LitElement)) {
64
54
 
65
55
  .d2l-meter-linear-inner-bar {
66
56
  background-color: var(--d2l-color-celestine);
67
- left: 0;
57
+ inset-inline-start: 0;
68
58
  max-width: 100%;
69
59
  position: absolute;
70
60
  top: 0;
71
61
  }
72
- :host([dir="rtl"]) .d2l-meter-linear-inner-bar {
73
- right: 0;
74
- }
75
62
  :host([foreground-light]) .d2l-meter-linear-inner-bar {
76
63
  background-color: white;
77
64
  }
@@ -80,11 +67,16 @@ class MeterLinear extends MeterMixin(RtlMixin(LitElement)) {
80
67
  color: var(--d2l-color-ferrite);
81
68
  display: flex;
82
69
  flex-direction: row;
70
+ gap: 0.45rem;
83
71
  line-height: 1em;
72
+ width: 100%;
84
73
  }
85
74
  :host([foreground-light]) .d2l-meter-linear-text {
86
75
  color: white;
87
76
  }
77
+ :host([text-inline]) .d2l-meter-linear-text {
78
+ width: auto;
79
+ }
88
80
 
89
81
  .d2l-meter-linear-text-space-between {
90
82
  justify-content: space-between;
@@ -133,7 +125,7 @@ class MeterLinear extends MeterMixin(RtlMixin(LitElement)) {
133
125
  <div class="d2l-meter-linear-inner-bar" style="width:${percentage}%;"></div>
134
126
  </div>
135
127
  <div class=${classMap(textClasses)}>
136
- <div class=${classMap(primaryTextClasses)}>${primary}&nbsp;</div>
128
+ <div class=${classMap(primaryTextClasses)}>${primary}</div>
137
129
  ${secondaryTextElement}
138
130
  </div>
139
131
  </div>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@brightspace-ui/core",
3
- "version": "3.28.1",
3
+ "version": "3.28.3",
4
4
  "description": "A collection of accessible, free, open-source web components for building Brightspace applications",
5
5
  "type": "module",
6
6
  "repository": "https://github.com/BrightspaceUI/core.git",