@gitlab/ui 66.7.0 → 66.8.0

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gitlab/ui",
3
- "version": "66.7.0",
3
+ "version": "66.8.0",
4
4
  "description": "GitLab UI Components",
5
5
  "license": "MIT",
6
6
  "main": "dist/index.js",
@@ -16,14 +16,45 @@
16
16
  @include gl-mb-0;
17
17
  }
18
18
 
19
- &:active,
20
19
  &:hover,
21
- &:focus,
20
+ &:focus {
21
+ .gl-new-dropdown-item-content {
22
+ @include gl-bg-gray-50;
23
+ }
24
+ }
25
+
26
+ &:active,
22
27
  &:focus:active {
28
+ .gl-new-dropdown-item-content {
29
+ @include gl-bg-gray-100;
30
+ }
31
+ }
32
+
33
+ &[aria-selected="true"] {
23
34
  .gl-new-dropdown-item-content {
24
35
  @include gl-bg-gray-50;
25
- @include gl-text-decoration-none;
26
- @include gl-text-gray-900;
36
+ }
37
+
38
+ &:hover,
39
+ &:focus {
40
+ .gl-new-dropdown-item-content {
41
+ @include gl-bg-gray-100;
42
+ }
43
+
44
+ .gl-new-dropdown-item-check-icon {
45
+ @include gl-text-blue-600
46
+ }
47
+ }
48
+
49
+ &:active,
50
+ &:focus:active {
51
+ .gl-new-dropdown-item-content {
52
+ @include gl-bg-gray-200;
53
+ }
54
+
55
+ .gl-new-dropdown-item-check-icon {
56
+ @include gl-text-blue-700
57
+ }
27
58
  }
28
59
  }
29
60
 
@@ -52,6 +83,7 @@
52
83
  @include gl-py-0;
53
84
  @include gl-relative;
54
85
  @include gl-rounded-base;
86
+ @include gl-text-decoration-none;
55
87
  @include gl-text-gray-900;
56
88
  @include gl-text-left;
57
89
  @include gl-white-space-normal;
@@ -59,7 +91,7 @@
59
91
  .gl-new-dropdown-item-check-icon {
60
92
  @include gl-flex-shrink-0;
61
93
  @include gl-mr-3;
62
- @include gl-text-blue-400;
94
+ @include gl-text-blue-500;
63
95
  }
64
96
 
65
97
  .gl-new-dropdown-item-icon {
@@ -59,7 +59,7 @@ export default {
59
59
  @click="toggleSelection"
60
60
  @keydown="onKeydown"
61
61
  >
62
- <span class="gl-new-dropdown-item-content" :class="{ 'gl-bg-gray-50!': isSelected }">
62
+ <span class="gl-new-dropdown-item-content">
63
63
  <gl-icon
64
64
  name="mobile-issue-close"
65
65
  data-testid="dropdown-item-checkbox"
@@ -5579,6 +5579,18 @@
5579
5579
  max-width: 80% !important;
5580
5580
  }
5581
5581
  }
5582
+
5583
+ .gl-lg-max-w-50p {
5584
+ @include gl-media-breakpoint-up(lg) {
5585
+ max-width: 50%;
5586
+ }
5587
+ }
5588
+
5589
+ .gl-lg-max-w-50p\! {
5590
+ @include gl-media-breakpoint-up(lg) {
5591
+ max-width: 50% !important;
5592
+ }
5593
+ }
5582
5594
  .gl-p-0 {
5583
5595
  padding: 0;
5584
5596
  }
@@ -527,3 +527,9 @@
527
527
  max-width: 80%;
528
528
  }
529
529
  }
530
+
531
+ @mixin gl-lg-max-w-50p {
532
+ @include gl-media-breakpoint-up(lg) {
533
+ max-width: 50%;
534
+ }
535
+ }