@brightspace-ui/core 3.1.0 → 3.1.1

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.
Files changed (4) hide show
  1. package/components/table/demo/table-test.js +0 -1
  2. package/components/table/table-col-sort-button.js +3 -4
  3. package/components/table/table-wrapper.js +5 -18
  4. package/package.json +1 -1
package/components/table/demo/table-test.js CHANGED
@@ -60,7 +60,6 @@ class TestTable extends RtlMixin(DemoPassthroughMixin(TableWrapper, 'd2l-table-w
60
60
  padding-block: 0;
61
61
  }
62
62
  .d2l-table > * > tr > :has(d2l-table-col-sort-button) d2l-button-icon {
63
- margin-bottom: 4px;
64
63
  vertical-align: top;
65
64
  }
66
65
  `];
package/components/table/table-col-sort-button.js CHANGED
@@ -35,8 +35,7 @@ export class TableColSortButton extends FocusMixin(LitElement) {
35
35
  return css`
36
36
  :host {
37
37
  --d2l-table-col-sort-button-additional-padding-inline-end: 0px; /* stylelint-disable-line length-zero-no-unit */
38
- --d2l-table-col-sort-button-margin-inline-end: var(--d2l-table-cell-col-sort-button-size-offset, 4px);
39
- --d2l-table-col-sort-button-width: calc(100% - 2 * var(--d2l-table-cell-col-sort-button-size-offset));
38
+ --d2l-table-col-sort-button-width: calc(100% - var(--d2l-table-cell-col-sort-button-size-offset, 4px));
40
39
  }
41
40
  :host([nosort]) {
42
41
  --d2l-table-col-sort-button-additional-padding-inline-end: calc(0.6rem + 18px);
@@ -53,8 +52,8 @@ export class TableColSortButton extends FocusMixin(LitElement) {
53
52
  font-size: inherit;
54
53
  letter-spacing: inherit;
55
54
  line-height: 0.9rem;
56
- margin: var(--d2l-table-cell-col-sort-button-size-offset, 4px);
57
- margin-inline-end: var(--d2l-table-col-sort-button-margin-inline-end);
55
+ margin-block: 0 var(--d2l-table-cell-col-sort-button-size-offset, 4px);
56
+ margin-inline: 0 var(--d2l-table-cell-col-sort-button-size-offset, 4px);
58
57
  padding: calc(var(--d2l-table-cell-padding) - var(--d2l-table-cell-col-sort-button-size-offset, 4px));
59
58
  padding-inline-end: calc(var(--d2l-table-cell-padding) - var(--d2l-table-cell-col-sort-button-size-offset, 4px) + var(--d2l-table-col-sort-button-additional-padding-inline-end));
60
59
  text-decoration: none;
package/components/table/table-wrapper.js CHANGED
@@ -94,22 +94,13 @@ export const tableStyles = css`
94
94
  }
95
95
  d2l-table-col-sort-button:not(:only-child) {
96
96
  --d2l-table-col-sort-button-additional-padding-inline-end: 0px; /* stylelint-disable-line length-zero-no-unit */
97
- display: inline-flex;
98
- margin-inline-start: calc(-1 * var(--d2l-table-cell-col-sort-button-size-offset));
99
- margin-top: calc(-1 * var(--d2l-table-cell-col-sort-button-size-offset));
100
- }
101
- d2l-table-col-sort-button:not(:last-child) {
102
- --d2l-table-col-sort-button-margin-inline-end: 0;
103
97
  }
104
98
 
105
99
  /* TODO: once we only support browsers that support :has the section below can be removed up until @supports */
106
100
  .d2l-table th.d2l-table-header-col-sortable {
107
- height: var(--d2l-table-cell-overall-height);
108
- padding: 0;
109
- }
110
- .d2l-table th.d2l-table-header-col-sortable.d2l-table-header-col-sortable-siblings {
111
101
  height: calc(var(--d2l-table-cell-overall-height) - var(--d2l-table-cell-col-sort-button-size-offset));
112
- padding-top: var(--d2l-table-cell-col-sort-button-size-offset);
102
+ padding-block: var(--d2l-table-cell-col-sort-button-size-offset) 0;
103
+ padding-inline: var(--d2l-table-cell-col-sort-button-size-offset) 0;
113
104
  }
114
105
  .d2l-table th.d2l-table-header-col-sortable-siblings d2l-table-col-sort-button {
115
106
  --d2l-table-col-sort-button-width: unset;
@@ -118,14 +109,10 @@ export const tableStyles = css`
118
109
  padding-inline-end: calc(0.6rem + 18px);
119
110
  }
120
111
  @supports selector(:has(a, b)) {
121
- .d2l-table th:has(d2l-table-col-sort-button) {
122
- height: var(--d2l-table-cell-overall-height);
123
- padding: 0;
124
- }
125
- .d2l-table th:has(d2l-table-col-sort-button:not(:only-child)) {
112
+ .d2l-table > * > tr > th:has(d2l-table-col-sort-button) {
126
113
  height: calc(var(--d2l-table-cell-overall-height) - var(--d2l-table-cell-col-sort-button-size-offset));
127
- padding-inline-start: var(--d2l-table-cell-col-sort-button-size-offset);
128
- padding-top: var(--d2l-table-cell-col-sort-button-size-offset);
114
+ padding-block: var(--d2l-table-cell-col-sort-button-size-offset) 0;
115
+ padding-inline: var(--d2l-table-cell-col-sort-button-size-offset) 0;
129
116
  }
130
117
  .d2l-table th:has(d2l-table-col-sort-button:not(:only-child)) d2l-table-col-sort-button {
131
118
  --d2l-table-col-sort-button-width: unset;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@brightspace-ui/core",
3
- "version": "3.1.0",
3
+ "version": "3.1.1",
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",