@transferwise/components 0.0.0-experimental-bd56e63 → 0.0.0-experimental-7d89ae8

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 (159) hide show
  1. package/package.json +1 -1
  2. package/src/accordion/Accordion.css +0 -74
  3. package/src/actionButton/ActionButton.css +0 -64
  4. package/src/actionOption/ActionOption.css +0 -4
  5. package/src/alert/Alert.css +0 -7
  6. package/src/avatar/Avatar.css +0 -250
  7. package/src/avatarLayout/AvatarLayout.css +0 -42
  8. package/src/avatarView/AvatarView.css +0 -44
  9. package/src/avatarView/Dot.css +0 -26
  10. package/src/badge/Badge.css +0 -65
  11. package/src/body/Body.css +0 -3
  12. package/src/button/Button.css +0 -246
  13. package/src/button/Button.vars.css +0 -46
  14. package/src/button/LegacyButton.css +0 -23
  15. package/src/card/Card.css +0 -100
  16. package/src/carousel/Carousel.css +0 -134
  17. package/src/checkboxButton/CheckboxButton.css +0 -43
  18. package/src/chips/Chip.css +0 -190
  19. package/src/circularButton/CircularButton.css +0 -34
  20. package/src/common/Option/Option.css +0 -120
  21. package/src/common/RadioButton/RadioButton.css +0 -4
  22. package/src/common/baseCard/BaseCard.css +0 -49
  23. package/src/common/bottomSheet/BottomSheet.css +0 -53
  24. package/src/common/circle/Circle.css +0 -43
  25. package/src/common/closeButton/CloseButton.css +0 -94
  26. package/src/common/liveRegion/LiveRegion.css +0 -3
  27. package/src/common/panel/Panel.css +0 -73
  28. package/src/container/Container.css +0 -38
  29. package/src/criticalBanner/CriticalCommsBanner.css +0 -63
  30. package/src/dateInput/DateInput.css +0 -16
  31. package/src/dateLookup/DateLookup.css +0 -93
  32. package/src/dateLookup/dateTrigger/DateTrigger.css +0 -29
  33. package/src/decision/Decision.css +0 -17
  34. package/src/definitionList/DefinitionList.css +0 -53
  35. package/src/dimmer/Dimmer.css +0 -70
  36. package/src/divider/Divider.css +0 -24
  37. package/src/drawer/Drawer.css +0 -56
  38. package/src/dropFade/DropFade.css +0 -19
  39. package/src/emphasis/Emphasis.css +0 -31
  40. package/src/expressiveMoneyInput/ExpressiveMoneyInput.css +0 -60
  41. package/src/expressiveMoneyInput/amountInput/AmountInput.css +0 -34
  42. package/src/expressiveMoneyInput/chevron/Chevron.css +0 -12
  43. package/src/expressiveMoneyInput/currencySelector/CurrencySelector.css +0 -6
  44. package/src/field/Field.css +0 -29
  45. package/src/flowNavigation/FlowNavigation.css +0 -76
  46. package/src/flowNavigation/animatedLabel/AnimatedLabel.css +0 -30
  47. package/src/header/Header.css +0 -33
  48. package/src/iconButton/IconButton.css +0 -82
  49. package/src/image/Image.css +0 -13
  50. package/src/info/Info.css +0 -9
  51. package/src/inputs/Input.css +0 -158
  52. package/src/inputs/InputGroup.css +0 -71
  53. package/src/inputs/SelectInput/BottomSheet/SelectInputBottomSheet.css +0 -96
  54. package/src/inputs/SelectInput/ButtonInput/SelectInputButtonInput.css +0 -20
  55. package/src/inputs/SelectInput/ClearButton/SelectInputClearButton.css +0 -46
  56. package/src/inputs/SelectInput/ItemView/SelectInputItemView.css +0 -16
  57. package/src/inputs/SelectInput/Option/SelectInputOption.css +0 -33
  58. package/src/inputs/SelectInput/OptionContent/SelectInputOptionContent.css +0 -37
  59. package/src/inputs/SelectInput/Options/SelectInputOptions.css +0 -81
  60. package/src/inputs/SelectInput/Popover/SelectInputPopover.css +0 -46
  61. package/src/inputs/SelectInput/SelectInput.css +0 -384
  62. package/src/inputs/TextArea.css +0 -161
  63. package/src/instructionsList/InstructionsList.css +0 -26
  64. package/src/legacylistItem/LegacyListItem.css +0 -6
  65. package/src/link/Link.css +0 -24
  66. package/src/listItem/ListItem.css +0 -660
  67. package/src/listItem/ListItem.grid.css +0 -384
  68. package/src/listItem/ListItem.vars.css +0 -0
  69. package/src/listItem/Prompt/ListItemPrompt.css +0 -4
  70. package/src/loader/Loader.css +0 -237
  71. package/src/logo/Logo.css +0 -6
  72. package/src/main.css +0 -34572
  73. package/src/modal/Modal.css +0 -82
  74. package/src/moneyInput/MoneyInput.css +0 -78
  75. package/src/navigationOption/NavigationOption.css +0 -69
  76. package/src/navigationOptionsList/NavigationOptionsList.css +0 -13
  77. package/src/nudge/Nudge.css +0 -206
  78. package/src/overlayHeader/OverlayHeader.css +0 -15
  79. package/src/phoneNumberInput/PhoneNumberInput.css +0 -28
  80. package/src/popover/Popover.css +0 -76
  81. package/src/progress/Progress.css +0 -43
  82. package/src/progressBar/ProgressBar.css +0 -14
  83. package/src/promoCard/PromoCard.css +0 -186
  84. package/src/prompt/ActionPrompt/ActionPrompt.css +0 -30
  85. package/src/prompt/CriticalBanner/CriticalBanner.css +0 -134
  86. package/src/prompt/CriticalBanner/CriticalBanner.vars.css +0 -0
  87. package/src/prompt/InfoPrompt/InfoPrompt.css +0 -57
  88. package/src/prompt/InlinePrompt/InlinePrompt.css +0 -57
  89. package/src/prompt/PrimitivePrompt/PrimitivePrompt.css +0 -51
  90. package/src/prompt/common/Expander/Expander.css +0 -8
  91. package/src/radioGroup/RadioGroup.css +0 -3
  92. package/src/section/Section.css +0 -10
  93. package/src/segmentedControl/SegmentedControl.css +0 -101
  94. package/src/select/Select.css +0 -369
  95. package/src/sentimentSurface/SentimentSurface.css +0 -487
  96. package/src/slidingPanel/SlidingPanel.css +0 -105
  97. package/src/snackbar/Snackbar.css +0 -93
  98. package/src/statusIcon/StatusIcon.css +0 -37
  99. package/src/stepper/Stepper.css +0 -77
  100. package/src/styles/less/accordion.css +0 -255
  101. package/src/styles/less/alerts.css +0 -751
  102. package/src/styles/less/background.css +0 -20
  103. package/src/styles/less/badge.css +0 -90
  104. package/src/styles/less/border-radius.css +0 -3
  105. package/src/styles/less/breadcrumbs.css +0 -20
  106. package/src/styles/less/button-groups.css +0 -495
  107. package/src/styles/less/buttons.css +0 -1390
  108. package/src/styles/less/chevron.css +0 -35
  109. package/src/styles/less/circles.css +0 -248
  110. package/src/styles/less/close.css +0 -47
  111. package/src/styles/less/column-layout.css +0 -164
  112. package/src/styles/less/core/viewport-themes.css +0 -63
  113. package/src/styles/less/currency-flags.css +0 -46
  114. package/src/styles/less/decision.css +0 -136
  115. package/src/styles/less/dropdowns.css +0 -472
  116. package/src/styles/less/droppable.css +0 -221
  117. package/src/styles/less/flex.css +0 -596
  118. package/src/styles/less/footer.css +0 -129
  119. package/src/styles/less/forms/bootstrap-forms.css +0 -2277
  120. package/src/styles/less/forms/checkbox-radio.css +0 -367
  121. package/src/styles/less/grid.css +0 -2369
  122. package/src/styles/less/input-groups.css +0 -2740
  123. package/src/styles/less/link-callout.css +0 -20
  124. package/src/styles/less/list-group.css +0 -350
  125. package/src/styles/less/loaders.css +0 -76
  126. package/src/styles/less/media.css +0 -74
  127. package/src/styles/less/modals.css +0 -185
  128. package/src/styles/less/navbar.css +0 -2406
  129. package/src/styles/less/navs.css +0 -296
  130. package/src/styles/less/neptune-social-media.css +0 -144
  131. package/src/styles/less/neptune.css +0 -25468
  132. package/src/styles/less/panels.css +0 -528
  133. package/src/styles/less/popovers.css +0 -661
  134. package/src/styles/less/process.css +0 -483
  135. package/src/styles/less/progress-bars.css +0 -64
  136. package/src/styles/less/ring.css +0 -55
  137. package/src/styles/less/select.css +0 -99
  138. package/src/styles/less/sequences.css +0 -855
  139. package/src/styles/less/table.css +0 -446
  140. package/src/styles/less/tick.css +0 -32
  141. package/src/styles/less/tooltip.css +0 -160
  142. package/src/styles/less/utilities.css +0 -133
  143. package/src/styles/less/wells.css +0 -60
  144. package/src/styles/variables/legacy-variables.css +0 -0
  145. package/src/styles/variables/neptune-tokens.css +0 -0
  146. package/src/styles/variables/zindex.css +0 -0
  147. package/src/summary/Summary.css +0 -81
  148. package/src/switch/Switch.css +0 -63
  149. package/src/switchOption/SwitchOption.css +0 -4
  150. package/src/table/Table.css +0 -274
  151. package/src/tabs/Tabs.css +0 -121
  152. package/src/tile/Tile.css +0 -68
  153. package/src/tooltip/Tooltip.css +0 -50
  154. package/src/typeahead/Typeahead.css +0 -187
  155. package/src/typeahead/typeaheadOption/TypeaheadOption.css +0 -9
  156. package/src/upload/Upload.css +0 -34
  157. package/src/uploadInput/UploadInput.css +0 -18
  158. package/src/uploadInput/uploadButton/UploadButton.css +0 -90
  159. package/src/uploadInput/uploadItem/UploadItem.css +0 -166
package/src/styles/less/forms/checkbox-radio.css DELETED
@@ -1,367 +0,0 @@
1
- .radio,
2
- .checkbox {
3
- border-color: #c9cbce;
4
- border-color: var(--color-interactive-secondary);
5
- }
6
- .radio > label,
7
- .checkbox > label {
8
- position: relative;
9
- padding-left: 48px;
10
- }
11
- [dir="rtl"] .radio > label,
12
- [dir="rtl"] .checkbox > label {
13
- padding-right: 48px;
14
- padding-left: 0;
15
- padding-left: initial;
16
- }
17
- .radio > label input[type="radio"],
18
- .checkbox > label input[type="radio"],
19
- .radio > label input[type="checkbox"],
20
- .checkbox > label input[type="checkbox"] {
21
- display: block;
22
- position: absolute;
23
- top: 13px;
24
- left: 40px;
25
- }
26
- [dir="rtl"] .radio > label input[type="radio"],
27
- [dir="rtl"] .checkbox > label input[type="radio"],
28
- [dir="rtl"] .radio > label input[type="checkbox"],
29
- [dir="rtl"] .checkbox > label input[type="checkbox"] {
30
- right: 40px;
31
- left: auto;
32
- left: initial;
33
- }
34
- .tw-checkbox-button {
35
- border: 1px solid #c9cbce;
36
- border: 1px solid var(--color-interactive-secondary);
37
- background: #ffffff;
38
- background: var(--color-background-screen);
39
- width: 22px;
40
- height: 22px;
41
- border-radius: 3px;
42
- display: inline-block;
43
- padding: 0;
44
- vertical-align: middle;
45
- text-align: center;
46
- transition: border 0.15s ease-in-out, background-color 0.15s ease-in-out;
47
- }
48
- .np-theme-personal .tw-checkbox-button {
49
- border: none;
50
- box-shadow: inset 0 0 0 1px #c9cbce;
51
- box-shadow: inset 0 0 0 1px var(--color-interactive-secondary);
52
- }
53
- .tw-checkbox-button .tw-checkbox-check,
54
- .tw-checkbox-button .np-tw-checkbox-indeterminate {
55
- width: 20px;
56
- height: 20px;
57
- margin: 0;
58
- display: none;
59
- color: #ffffff;
60
- color: var(--color-background-screen);
61
- }
62
- .tw-checkbox-button:not(.disabled):not(:disabled):hover,
63
- input[type="checkbox"]:hover + .tw-checkbox-button,
64
- .checkbox:hover .tw-checkbox-button {
65
- border-color: #b5b7ba;
66
- border-color: var(--color-interactive-secondary-hover);
67
- }
68
- .np-theme-personal .tw-checkbox-button:not(.disabled):not(:disabled):hover,
69
- .np-theme-personal input[type="checkbox"]:hover + .tw-checkbox-button,
70
- .np-theme-personal .checkbox:hover .tw-checkbox-button {
71
- box-shadow: inset 0 0 0 1px #b5b7ba;
72
- box-shadow: inset 0 0 0 1px var(--color-interactive-secondary-hover);
73
- }
74
- .tw-checkbox-button:not(.disabled):not(:disabled):focus,
75
- .tw-checkbox-button:not(.disabled):not(:disabled).focus,
76
- .tw-checkbox-button:not(.disabled):not(:disabled):focus:hover,
77
- .tw-checkbox-button:not(.disabled):not(:disabled).focus:hover,
78
- input[type="checkbox"]:focus + .tw-checkbox-button,
79
- .tw-checkbox-button:not(.disabled):not(:disabled):active,
80
- .tw-checkbox-button:not(.disabled):not(:disabled).active,
81
- input[type="checkbox"]:active + .tw-checkbox-button {
82
- border-color: #c9cbce;
83
- border-color: var(--color-interactive-secondary);
84
- outline: none;
85
- }
86
- input[type="checkbox"]:focus-visible + .tw-checkbox-button {
87
- outline: var(--ring-outline-color) solid var(--ring-outline-width);
88
- outline-offset: var(--ring-outline-offset);
89
- }
90
- .checkbox input[type="checkbox"]:focus-visible + .tw-checkbox-button {
91
- outline: none;
92
- }
93
- .tw-checkbox-button:checked,
94
- .tw-checkbox-button.checked,
95
- input[type="checkbox"]:checked + .tw-checkbox-button,
96
- input[type="checkbox"]:indeterminate + .tw-checkbox-button {
97
- border-color: #00a2dd !important;
98
- border-color: var(--color-interactive-accent) !important;
99
- background-color: #00a2dd;
100
- background-color: var(--color-interactive-accent);
101
- }
102
- .np-theme-personal .tw-checkbox-button:checked,
103
- .np-theme-personal .tw-checkbox-button.checked,
104
- .np-theme-personal input[type="checkbox"]:checked + .tw-checkbox-button,
105
- .np-theme-personal input[type="checkbox"]:indeterminate + .tw-checkbox-button {
106
- background-color: var(--color-interactive-primary);
107
- box-shadow: inset 0 0 0 1px var(--color-interactive-primary);
108
- }
109
- .tw-checkbox-button:checked .tw-checkbox-check,
110
- .tw-checkbox-button.checked .tw-checkbox-check,
111
- input[type="checkbox"]:checked + .tw-checkbox-button .tw-checkbox-check {
112
- display: inline-block;
113
- }
114
- input[type="checkbox"]:indeterminate + .tw-checkbox-button .np-tw-checkbox-indeterminate {
115
- display: inline-block;
116
- }
117
- .tw-checkbox-button:checked:hover,
118
- .tw-checkbox-button.checked:hover,
119
- input[type="checkbox"]:not(.disabled):not(:disabled):checked:hover + .tw-checkbox-button,
120
- input[type="checkbox"]:not(.disabled):not(:disabled):indeterminate:hover + .tw-checkbox-button {
121
- border-color: #008fc9 !important;
122
- border-color: var(--color-interactive-accent-hover) !important;
123
- background-color: #008fc9;
124
- background-color: var(--color-interactive-accent-hover);
125
- }
126
- .np-theme-personal .tw-checkbox-button:checked:hover,
127
- .np-theme-personal .tw-checkbox-button.checked:hover,
128
- .np-theme-personal input[type="checkbox"]:not(.disabled):not(:disabled):checked:hover + .tw-checkbox-button,
129
- .np-theme-personal input[type="checkbox"]:not(.disabled):not(:disabled):indeterminate:hover + .tw-checkbox-button {
130
- border-color: var(--color-interactive-primary-hover) !important;
131
- background-color: var(--color-interactive-primary-hover);
132
- box-shadow: inset 0 0 0 1px var(--color-interactive-primary-hover);
133
- }
134
- .tw-checkbox-button:checked:active,
135
- .tw-checkbox-button.checked:active,
136
- input[type="checkbox"]:not(.disabled):not(:disabled):checked:active + .tw-checkbox-button,
137
- input[type="checkbox"]:not(.disabled):not(:disabled):indeterminate:active + .tw-checkbox-button {
138
- border-color: #0081ba !important;
139
- border-color: var(--color-interactive-accent-active) !important;
140
- background-color: #0081ba;
141
- background-color: var(--color-interactive-accent-active);
142
- }
143
- .np-theme-personal .tw-checkbox-button:checked:active,
144
- .np-theme-personal .tw-checkbox-button.checked:active,
145
- .np-theme-personal input[type="checkbox"]:not(.disabled):not(:disabled):checked:active + .tw-checkbox-button,
146
- .np-theme-personal input[type="checkbox"]:not(.disabled):not(:disabled):indeterminate:active + .tw-checkbox-button {
147
- border-color: var(--color-interactive-primary-active) !important;
148
- background-color: var(--color-interactive-primary-active);
149
- box-shadow: inset 0 0 0 1px var(--color-interactive-primary-active);
150
- }
151
- .checkbox.has-error .tw-checkbox-button,
152
- .tw-checkbox-button.has-error {
153
- border-color: #e74848 !important;
154
- border-color: var(--color-interactive-negative) !important;
155
- }
156
- .checkbox.has-error .tw-checkbox-button:checked,
157
- .tw-checkbox-button.has-error:checked,
158
- .checkbox.has-error .tw-checkbox-button.checked,
159
- .tw-checkbox-button.has-error.checked {
160
- background-color: #e74848;
161
- background-color: var(--color-interactive-negative);
162
- }
163
- .checkbox.has-error input[type="checkbox"]:not(.disabled):not(:disabled):checked + .tw-checkbox-button,
164
- .checkbox.has-error input[type="checkbox"]:not(.disabled):not(:disabled):indeterminate + .tw-checkbox-button {
165
- border-color: #e74848 !important;
166
- border-color: var(--color-interactive-negative) !important;
167
- background-color: #e74848;
168
- background-color: var(--color-interactive-negative);
169
- }
170
- .checkbox.has-error input[type="checkbox"]:not(.disabled):not(:disabled):checked:hover + .tw-checkbox-button,
171
- .checkbox.has-error input[type="checkbox"]:not(.disabled):not(:disabled):checked:indeterminate + .tw-checkbox-button {
172
- border-color: #d03238 !important;
173
- border-color: var(--color-interactive-negative-hover) !important;
174
- background-color: #d03238;
175
- background-color: var(--color-interactive-negative-hover);
176
- }
177
- .checkbox.has-error input[type="checkbox"]:not(.disabled):not(:disabled):checked:active + .tw-checkbox-button,
178
- .checkbox.has-error input[type="checkbox"]:not(.disabled):not(:disabled):indeterminate + .tw-checkbox-button {
179
- border-color: #bf1e2c !important;
180
- border-color: var(--color-interactive-negative-active) !important;
181
- background-color: #bf1e2c;
182
- background-color: var(--color-interactive-negative-active);
183
- }
184
- .tw-radio-button {
185
- width: 24px;
186
- height: 24px;
187
- border-radius: 50%;
188
- border: 1px solid #c9cbce;
189
- border: 1px solid var(--color-interactive-secondary);
190
- background: #ffffff;
191
- background: var(--color-background-screen);
192
- display: inline-flex;
193
- align-items: center;
194
- justify-content: center;
195
- padding: 0;
196
- transition: border 0.15s ease-in-out;
197
- }
198
- .np-theme-personal .tw-radio-button {
199
- border: none;
200
- box-shadow: inset 0 0 0 1px #c9cbce;
201
- box-shadow: inset 0 0 0 1px var(--color-interactive-secondary);
202
- position: relative;
203
- top: 0;
204
- left: 0;
205
- }
206
- .tw-radio-button .tw-radio-check {
207
- border-radius: 50%;
208
- text-align: center;
209
- width: 12px;
210
- height: 12px;
211
- display: block;
212
- opacity: 0;
213
- transition: all 0.15s ease-in-out;
214
- }
215
- .radio:not(.disabled):not(:disabled):hover .tw-radio-button,
216
- .tw-radio-button:not(.disabled):not(:disabled):hover {
217
- border-color: #b5b7ba;
218
- border-color: var(--color-interactive-secondary-hover);
219
- }
220
- .np-theme-personal .radio:not(.disabled):not(:disabled):hover .tw-radio-button,
221
- .np-theme-personal .tw-radio-button:not(.disabled):not(:disabled):hover {
222
- border-color: transparent;
223
- box-shadow: inset 0 0 0 1px #b5b7ba;
224
- box-shadow: inset 0 0 0 1px var(--color-interactive-secondary-hover);
225
- }
226
- .np-theme-personal .radio:not(.disabled):not(:disabled):hover .tw-radio-button:checked,
227
- .np-theme-personal .tw-radio-button:not(.disabled):not(:disabled):hover:checked,
228
- .np-theme-personal .radio:not(.disabled):not(:disabled):hover .tw-radio-button.checked,
229
- .np-theme-personal .tw-radio-button:not(.disabled):not(:disabled):hover.checked {
230
- box-shadow: inset 0 0 0 1px var(--color-interactive-primary);
231
- }
232
- .np-theme-personal .radio:not(.disabled):not(:disabled):hover .tw-radio-button:checked .tw-radio-check,
233
- .np-theme-personal .tw-radio-button:not(.disabled):not(:disabled):hover:checked .tw-radio-check,
234
- .np-theme-personal .radio:not(.disabled):not(:disabled):hover .tw-radio-button.checked .tw-radio-check,
235
- .np-theme-personal .tw-radio-button:not(.disabled):not(:disabled):hover.checked .tw-radio-check {
236
- background-color: var(--color-interactive-primary-hover);
237
- }
238
- .tw-radio-button:not(.disabled):not(:disabled):focus,
239
- .tw-radio-button:not(.disabled):not(:disabled).focus,
240
- .tw-radio-button:not(.disabled):not(:disabled):active,
241
- .tw-radio-button:not(.disabled):not(:disabled).active {
242
- border-color: #a7a9ab;
243
- border-color: var(--color-interactive-secondary-active);
244
- outline: none;
245
- }
246
- .tw-radio-button:checked,
247
- .tw-radio-button.checked {
248
- border-color: #00a2dd !important;
249
- border-color: var(--color-interactive-accent) !important;
250
- }
251
- .tw-radio-button:checked .tw-radio-check,
252
- .tw-radio-button.checked .tw-radio-check {
253
- opacity: 1;
254
- background-color: #00a2dd;
255
- background-color: var(--color-interactive-accent);
256
- }
257
- .np-theme-personal .tw-radio-button:checked,
258
- .np-theme-personal .tw-radio-button.checked {
259
- border-color: transparent !important;
260
- box-shadow: inset 0 0 0 1px var(--color-interactive-primary);
261
- }
262
- .np-theme-personal .tw-radio-button:checked .tw-radio-check,
263
- .np-theme-personal .tw-radio-button.checked .tw-radio-check {
264
- background-color: var(--color-interactive-primary);
265
- max-height: 12px;
266
- max-width: 12px;
267
- }
268
- .radio.has-error .tw-radio-button,
269
- .tw-radio-button.has-error {
270
- border-color: #e74848 !important;
271
- border-color: var(--color-interactive-negative) !important;
272
- }
273
- .radio.has-error .tw-radio-button:checked .tw-radio-check,
274
- .tw-radio-button.has-error:checked .tw-radio-check,
275
- .radio.has-error .tw-radio-button.checked .tw-radio-check,
276
- .tw-radio-button.has-error.checked .tw-radio-check {
277
- background-color: #e74848;
278
- background-color: var(--color-interactive-negative);
279
- }
280
- .radio .tw-radio-button {
281
- position: absolute;
282
- left: 13px;
283
- top: 11px;
284
- }
285
- [dir="rtl"] .radio .tw-radio-button {
286
- right: 13px;
287
- left: auto;
288
- left: initial;
289
- }
290
- .checkbox .tw-checkbox-button {
291
- position: absolute;
292
- left: 14px;
293
- top: 12px;
294
- }
295
- [dir="rtl"] .checkbox .tw-checkbox-button {
296
- right: 14px;
297
- left: auto;
298
- left: initial;
299
- }
300
- .form-inline .tw-checkbox-button,
301
- .form-inline .tw-radio-button {
302
- vertical-align: bottom;
303
- }
304
- .form-horizontal .checkbox,
305
- .form-horizontal .radio {
306
- padding-top: 0;
307
- }
308
- .form-horizontal .checkbox > label,
309
- .form-horizontal .radio > label {
310
- margin-bottom: 0;
311
- }
312
- .np-radio.radio,
313
- .np-checkbox.checkbox {
314
- min-width: -moz-fit-content;
315
- min-width: fit-content;
316
- }
317
- .np-radio.radio .np-radio-button,
318
- .np-checkbox.checkbox .np-radio-button,
319
- .np-radio.radio .np-checkbox-button,
320
- .np-checkbox.checkbox .np-checkbox-button {
321
- position: relative;
322
- flex-shrink: 0;
323
- }
324
- .np-radio.radio .tw-checkbox-button,
325
- .np-checkbox.checkbox .tw-checkbox-button,
326
- .np-radio.radio .tw-radio-button,
327
- .np-checkbox.checkbox .tw-radio-button {
328
- position: static;
329
- }
330
- .np-radio.radio > label,
331
- .np-checkbox.checkbox > label {
332
- display: flex;
333
- align-items: center;
334
- padding: 8px 16px ;
335
- padding: var(--size-8) var(--size-16) ;
336
- }
337
- [dir="rtl"] .np-radio.radio > label,
338
- [dir="rtl"] .np-checkbox.checkbox > label {
339
- padding: 8px 16px ;
340
- padding: var(--size-8) var(--size-16) ;
341
- }
342
- .np-radio.radio > label .np-checkbox__text,
343
- .np-checkbox.checkbox > label .np-checkbox__text,
344
- .np-radio.radio > label .np-radio__text,
345
- .np-checkbox.checkbox > label .np-radio__text {
346
- display: block;
347
- padding-top: 1px;
348
- }
349
- :not(.np-theme-personal) .np-radio.radio > label .np-checkbox__text,
350
- :not(.np-theme-personal) .np-checkbox.checkbox > label .np-checkbox__text,
351
- :not(.np-theme-personal) .np-radio.radio > label .np-radio__text,
352
- :not(.np-theme-personal) .np-checkbox.checkbox > label .np-radio__text {
353
- font-weight: 400;
354
- font-weight: var(--font-weight-regular);
355
- font-size: 1rem;
356
- font-size: var(--font-size-16);
357
- line-height: 1.25rem;
358
- line-height: var(--line-height-20);
359
- padding-top: 3px;
360
- }
361
- .np-theme-personal .np-radio.radio > label,
362
- .np-theme-personal .np-checkbox.checkbox > label {
363
- padding: var(--input-padding);
364
- }
365
- .np-radio .np-radio__avatar {
366
- pointer-events: none;
367
- }