@brightspace-ui/core 2.100.1 → 2.100.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -70,7 +70,6 @@ class ListItemDragHandle extends LocalizeCoreElement(RtlMixin(LitElement)) {
|
|
|
70
70
|
static get styles() {
|
|
71
71
|
return [ buttonStyles, css`
|
|
72
72
|
:host {
|
|
73
|
-
align-items: center;
|
|
74
73
|
display: flex;
|
|
75
74
|
margin: 0.25rem;
|
|
76
75
|
}
|
|
@@ -83,7 +82,27 @@ class ListItemDragHandle extends LocalizeCoreElement(RtlMixin(LitElement)) {
|
|
|
83
82
|
}
|
|
84
83
|
.d2l-list-item-drag-handle-keyboard-button {
|
|
85
84
|
display: grid;
|
|
85
|
+
gap: 2px;
|
|
86
86
|
grid-auto-rows: 1fr 1fr;
|
|
87
|
+
position: relative;
|
|
88
|
+
}
|
|
89
|
+
.d2l-list-item-drag-handle-keyboard-button-up,
|
|
90
|
+
.d2l-list-item-drag-handle-keyboard-button-down {
|
|
91
|
+
height: 1.1rem;
|
|
92
|
+
left: -0.2rem;
|
|
93
|
+
position: absolute;
|
|
94
|
+
width: 1.3rem;
|
|
95
|
+
}
|
|
96
|
+
.d2l-list-item-drag-handle-keyboard-button-up {
|
|
97
|
+
top: -0.25rem;
|
|
98
|
+
}
|
|
99
|
+
.d2l-list-item-drag-handle-keyboard-button-down {
|
|
100
|
+
bottom: -0.25rem;
|
|
101
|
+
}
|
|
102
|
+
:host([dir="rtl"]) .d2l-list-item-drag-handle-keyboard-button-up,
|
|
103
|
+
:host([dir="rtl"]) .d2l-list-item-drag-handle-keyboard-button-down {
|
|
104
|
+
left: auto;
|
|
105
|
+
right: -0.2rem;
|
|
87
106
|
}
|
|
88
107
|
.d2l-list-item-drag-handle-dragger-button,
|
|
89
108
|
.d2l-list-item-drag-handle-keyboard-button {
|
|
@@ -96,18 +115,40 @@ class ListItemDragHandle extends LocalizeCoreElement(RtlMixin(LitElement)) {
|
|
|
96
115
|
button::-moz-focus-inner {
|
|
97
116
|
border: 0;
|
|
98
117
|
}
|
|
99
|
-
.d2l-button-icon {
|
|
118
|
+
.d2l-button-dragger-icon {
|
|
100
119
|
height: 0.9rem;
|
|
101
120
|
width: 0.9rem;
|
|
102
121
|
}
|
|
122
|
+
.d2l-button-up-icon,
|
|
123
|
+
.d2l-button-down-icon {
|
|
124
|
+
border-radius: 0.1rem;
|
|
125
|
+
height: 0.85rem;
|
|
126
|
+
width: 0.9rem;
|
|
127
|
+
}
|
|
128
|
+
.d2l-button-up-icon {
|
|
129
|
+
border-top-left-radius: 0.3rem;
|
|
130
|
+
border-top-right-radius: 0.3rem;
|
|
131
|
+
}
|
|
132
|
+
.d2l-button-down-icon {
|
|
133
|
+
border-bottom-left-radius: 0.3rem;
|
|
134
|
+
border-bottom-right-radius: 0.3rem;
|
|
135
|
+
}
|
|
103
136
|
button,
|
|
104
137
|
button[disabled]:hover,
|
|
105
138
|
button[disabled]:focus {
|
|
106
139
|
background-color: var(--d2l-color-gypsum);
|
|
107
140
|
color: var(--d2l-color-ferrite);
|
|
108
141
|
}
|
|
109
|
-
button:hover,
|
|
110
|
-
button:focus {
|
|
142
|
+
.d2l-list-item-drag-handle-dragger-button:hover,
|
|
143
|
+
.d2l-list-item-drag-handle-dragger-button:focus {
|
|
144
|
+
background-color: var(--d2l-color-mica);
|
|
145
|
+
}
|
|
146
|
+
.d2l-list-item-drag-handle-keyboard-button:hover,
|
|
147
|
+
.d2l-list-item-drag-handle-keyboard-button:focus {
|
|
148
|
+
background-color: transparent;
|
|
149
|
+
}
|
|
150
|
+
.d2l-list-item-drag-handle-keyboard-button:hover > d2l-icon,
|
|
151
|
+
.d2l-list-item-drag-handle-keyboard-button:focus > d2l-icon {
|
|
111
152
|
background-color: var(--d2l-color-mica);
|
|
112
153
|
}
|
|
113
154
|
button[disabled] {
|
|
@@ -270,7 +311,7 @@ class ListItemDragHandle extends LocalizeCoreElement(RtlMixin(LitElement)) {
|
|
|
270
311
|
@keydown="${this._onInactiveKeyboard}"
|
|
271
312
|
aria-label="${this._defaultLabel}"
|
|
272
313
|
?disabled="${this.disabled}">
|
|
273
|
-
<d2l-icon icon="tier1:dragger" class="d2l-button-icon"></d2l-icon>
|
|
314
|
+
<d2l-icon icon="tier1:dragger" class="d2l-button-dragger-icon"></d2l-icon>
|
|
274
315
|
</button>
|
|
275
316
|
`;
|
|
276
317
|
}
|
|
@@ -284,8 +325,10 @@ class ListItemDragHandle extends LocalizeCoreElement(RtlMixin(LitElement)) {
|
|
|
284
325
|
@focusout="${this._onFocusOutKeyboardButton}"
|
|
285
326
|
id="${this._buttonId}"
|
|
286
327
|
@keydown="${this._onActiveKeyboard}">
|
|
287
|
-
<d2l-icon icon="tier1:arrow-toggle-up"
|
|
288
|
-
<d2l-icon icon="tier1:arrow-toggle-down"
|
|
328
|
+
<d2l-icon icon="tier1:arrow-toggle-up" class="d2l-button-up-icon"></d2l-icon>
|
|
329
|
+
<d2l-icon icon="tier1:arrow-toggle-down" class="d2l-button-down-icon"></d2l-icon>
|
|
330
|
+
<div class="d2l-list-item-drag-handle-keyboard-button-up" @click="${this._dispatchActionUp}"></div>
|
|
331
|
+
<div class="d2l-list-item-drag-handle-keyboard-button-down" @click="${this._dispatchActionDown}"></div>
|
|
289
332
|
</button>
|
|
290
333
|
${this._displayKeyboardTooltip ? html`<d2l-tooltip align="start" for="${this._buttonId}" for-type="descriptor">${this._renderTooltipContent()}</d2l-tooltip>` : ''}
|
|
291
334
|
`;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@brightspace-ui/core",
|
|
3
|
-
"version": "2.100.
|
|
3
|
+
"version": "2.100.2",
|
|
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",
|