benivo-ui-library 1.9.65 → 1.9.66

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.
@@ -134,39 +134,6 @@
134
134
  }
135
135
  }
136
136
 
137
- .currency-input-menu {
138
- position: absolute;
139
- top: ~'calc(100% + 6px)';
140
- right: 0;
141
- min-width: 100%;
142
- margin: 0;
143
- padding: 0.25rem 0;
144
- list-style: none;
145
- z-index: @zindex-dropdown;
146
- background: var(--white);
147
- border: 1px solid var(--border-200);
148
- .border-radius(@form-border-radius);
149
- .box-shadow(0 4px 12px 0 rgba(16, 24, 40, 0.12));
150
- max-height: 240px;
151
- overflow-y: auto;
152
- }
153
-
154
- .currency-input-option {
155
- padding: 0.5rem 0.75rem;
156
- font-size: @font-size-sm;
157
- cursor: pointer;
158
- white-space: nowrap;
159
-
160
- &:hover {
161
- background: var(--bg-50);
162
- }
163
-
164
- &.selected {
165
- font-weight: @font-weight-semibold;
166
- background: var(--bg-50);
167
- }
168
- }
169
-
170
137
  .currency-input-hint {
171
138
  display: block;
172
139
  margin-top: 0.25rem;
@@ -175,3 +142,44 @@
175
142
  color: var(--text-300);
176
143
  }
177
144
  }
145
+
146
+ // Menu is rendered through a portal into document.body, so its styles must live
147
+ // at the top level rather than nested under .currency-input.
148
+ .currency-input-menu {
149
+ position: absolute;
150
+ top: ~'calc(100% + 6px)';
151
+ right: 0;
152
+ min-width: 100%;
153
+ margin: 0;
154
+ padding: 0.25rem 0;
155
+ list-style: none;
156
+ z-index: @zindex-dropdown;
157
+ background: var(--white);
158
+ border: 1px solid var(--border-200);
159
+ .border-radius(@form-border-radius);
160
+ .box-shadow(0 4px 12px 0 rgba(16, 24, 40, 0.12));
161
+ max-height: 240px;
162
+ overflow-y: auto;
163
+
164
+ &.currency-input-menu--portal {
165
+ position: fixed;
166
+ top: auto;
167
+ z-index: @zindex-modal;
168
+ }
169
+ }
170
+
171
+ .currency-input-option {
172
+ padding: 0.5rem 0.75rem;
173
+ font-size: @font-size-sm;
174
+ cursor: pointer;
175
+ white-space: nowrap;
176
+
177
+ &:hover {
178
+ background: var(--bg-50);
179
+ }
180
+
181
+ &.selected {
182
+ font-weight: @font-weight-semibold;
183
+ background: var(--bg-50);
184
+ }
185
+ }