@x-plat/design-system 0.5.11 → 0.5.13

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.
@@ -99,8 +99,9 @@
99
99
  .lib-xplat-select .select-trigger .select-trigger-icon svg {
100
100
  font-size: 20px;
101
101
  }
102
- .lib-xplat-select .select-content {
102
+ .lib-xplat-select-content {
103
103
  position: fixed;
104
+ z-index: 1000;
104
105
  padding: var(--spacing-space-1) 0;
105
106
  border-radius: var(--spacing-radius-md);
106
107
  background-color: var(--semantic-surface-neutral-default);
@@ -111,50 +112,42 @@
111
112
  opacity: 0;
112
113
  transition: transform 0.2s ease, opacity 0.2s ease;
113
114
  }
114
- .lib-xplat-select .select-content.bottom {
115
- top: 100%;
116
- margin-top: var(--spacing-space-1);
117
- margin-bottom: 0;
115
+ .lib-xplat-select-content.bottom {
118
116
  transform: translateY(-8px);
119
117
  }
120
- .lib-xplat-select .select-content.bottom.visible {
118
+ .lib-xplat-select-content.bottom.visible {
121
119
  opacity: 1;
122
120
  transform: translateY(0);
123
121
  }
124
- .lib-xplat-select .select-content.bottom.exit {
122
+ .lib-xplat-select-content.bottom.exit {
125
123
  opacity: 0;
126
124
  transform: translateY(-8px);
127
125
  }
128
- .lib-xplat-select .select-content {
129
- }
130
- .lib-xplat-select .select-content.top {
131
- bottom: 100%;
132
- margin-bottom: var(--spacing-space-1);
133
- margin-top: 0;
126
+ .lib-xplat-select-content.top {
134
127
  transform: translateY(8px);
135
128
  }
136
- .lib-xplat-select .select-content.top.visible {
129
+ .lib-xplat-select-content.top.visible {
137
130
  opacity: 1;
138
131
  transform: translateY(0);
139
132
  }
140
- .lib-xplat-select .select-content.top.exit {
133
+ .lib-xplat-select-content.top.exit {
141
134
  opacity: 0;
142
135
  transform: translateY(8px);
143
136
  }
144
- .lib-xplat-select .select-item {
137
+ .lib-xplat-select-content .select-item {
145
138
  padding: var(--spacing-space-2) var(--spacing-space-3);
146
139
  font-size: 14px;
147
140
  cursor: pointer;
148
141
  transition: background-color 0.15s ease;
149
142
  outline: none;
150
143
  }
151
- .lib-xplat-select .select-item:hover:not(.disabled) {
144
+ .lib-xplat-select-content .select-item:hover:not(.disabled) {
152
145
  background-color: var(--semantic-surface-neutral-subtle);
153
146
  }
154
- .lib-xplat-select .select-item:focus-visible:not(.disabled) {
147
+ .lib-xplat-select-content .select-item:focus-visible:not(.disabled) {
155
148
  background-color: var(--semantic-surface-neutral-subtle);
156
149
  }
157
- .lib-xplat-select .select-item.disabled {
150
+ .lib-xplat-select-content .select-item.disabled {
158
151
  cursor: not-allowed;
159
152
  color: var(--semantic-text-disabled);
160
153
  }