@transferwise/components 0.0.0-experimental-4f2af7f → 0.0.0-experimental-8bbf3ee
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/build/actionOption/ActionOption.js.map +1 -1
- package/build/actionOption/ActionOption.mjs.map +1 -1
- package/build/checkboxOption/CheckboxOption.js.map +1 -1
- package/build/checkboxOption/CheckboxOption.mjs.map +1 -1
- package/build/index.js +0 -2
- package/build/index.js.map +1 -1
- package/build/index.mjs +0 -1
- package/build/index.mjs.map +1 -1
- package/build/legacylistItem/LegacyListItem.js.map +1 -1
- package/build/legacylistItem/LegacyListItem.mjs.map +1 -1
- package/build/main.css +1 -771
- package/build/navigationOption/NavigationOption.js.map +1 -1
- package/build/navigationOption/NavigationOption.mjs.map +1 -1
- package/build/navigationOptionsList/NavigationOptionsList.js.map +1 -1
- package/build/navigationOptionsList/NavigationOptionsList.mjs.map +1 -1
- package/build/radioOption/RadioOption.js.map +1 -1
- package/build/radioOption/RadioOption.mjs.map +1 -1
- package/build/styles/button/Button.css +1 -1
- package/build/styles/main.css +1 -771
- package/build/summary/Summary.js +0 -8
- package/build/summary/Summary.js.map +1 -1
- package/build/summary/Summary.mjs +0 -8
- package/build/summary/Summary.mjs.map +1 -1
- package/build/switchOption/SwitchOption.js +0 -8
- package/build/switchOption/SwitchOption.js.map +1 -1
- package/build/switchOption/SwitchOption.mjs +0 -8
- package/build/switchOption/SwitchOption.mjs.map +1 -1
- package/build/types/actionOption/ActionOption.d.ts +0 -8
- package/build/types/actionOption/ActionOption.d.ts.map +1 -1
- package/build/types/checkboxOption/CheckboxOption.d.ts +0 -8
- package/build/types/checkboxOption/CheckboxOption.d.ts.map +1 -1
- package/build/types/index.d.ts +0 -2
- package/build/types/index.d.ts.map +1 -1
- package/build/types/legacylistItem/LegacyListItem.d.ts +0 -8
- package/build/types/legacylistItem/LegacyListItem.d.ts.map +1 -1
- package/build/types/navigationOption/NavigationOption.d.ts +0 -8
- package/build/types/navigationOption/NavigationOption.d.ts.map +1 -1
- package/build/types/navigationOptionsList/NavigationOptionsList.d.ts +0 -9
- package/build/types/navigationOptionsList/NavigationOptionsList.d.ts.map +1 -1
- package/build/types/radioOption/RadioOption.d.ts +0 -8
- package/build/types/radioOption/RadioOption.d.ts.map +1 -1
- package/build/types/summary/Summary.d.ts +0 -8
- package/build/types/summary/Summary.d.ts.map +1 -1
- package/build/types/switchOption/SwitchOption.d.ts +0 -8
- package/build/types/switchOption/SwitchOption.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/actionButton/ActionButton.story.tsx +1 -1
- package/src/actionOption/ActionOption.story.tsx +0 -4
- package/src/actionOption/ActionOption.tsx +0 -8
- package/src/avatar/Avatar.story.tsx +1 -1
- package/src/avatarWrapper/AvatarWrapper.story.tsx +1 -1
- package/src/badge/Badge.story.tsx +1 -1
- package/src/button/Button.css +1 -1
- package/src/button/Button.less +1 -1
- package/src/button/Button.story.tsx +46 -10
- package/src/button/LegacyButton.story.tsx +1 -1
- package/src/checkboxOption/CheckboxOption.story.tsx +0 -4
- package/src/checkboxOption/CheckboxOption.tsx +0 -8
- package/src/index.ts +0 -15
- package/src/legacylistItem/LegacyListItem.story.tsx +1 -5
- package/src/legacylistItem/LegacyListItem.tests.story.tsx +1 -2
- package/src/legacylistItem/LegacyListItem.tsx +0 -8
- package/src/list/List.story.tsx +3 -13
- package/src/main.css +1 -771
- package/src/main.less +0 -1
- package/src/navigationOption/NavigationOption.story.tsx +1 -4
- package/src/navigationOption/NavigationOption.tsx +0 -8
- package/src/navigationOptionsList/NavigationOptionsList.story.tsx +0 -4
- package/src/navigationOptionsList/NavigationOptionsList.tsx +0 -9
- package/src/radioOption/RadioOption.story.tsx +0 -4
- package/src/radioOption/RadioOption.tsx +0 -8
- package/src/select/Select.story.tsx +1 -1
- package/src/summary/Summary.story.tsx +0 -4
- package/src/summary/Summary.tsx +0 -8
- package/src/switchOption/SwitchOption.story.tsx +1 -4
- package/src/switchOption/SwitchOption.tsx +0 -8
- package/build/listItem/AdditionalInfo/ListItemAdditionalInfo.js +0 -56
- package/build/listItem/AdditionalInfo/ListItemAdditionalInfo.js.map +0 -1
- package/build/listItem/AdditionalInfo/ListItemAdditionalInfo.mjs +0 -54
- package/build/listItem/AdditionalInfo/ListItemAdditionalInfo.mjs.map +0 -1
- package/build/listItem/AvatarLayout/ListItemAvatarLayout.js +0 -23
- package/build/listItem/AvatarLayout/ListItemAvatarLayout.js.map +0 -1
- package/build/listItem/AvatarLayout/ListItemAvatarLayout.mjs +0 -21
- package/build/listItem/AvatarLayout/ListItemAvatarLayout.mjs.map +0 -1
- package/build/listItem/AvatarView/ListItemAvatarView.js +0 -23
- package/build/listItem/AvatarView/ListItemAvatarView.js.map +0 -1
- package/build/listItem/AvatarView/ListItemAvatarView.mjs +0 -21
- package/build/listItem/AvatarView/ListItemAvatarView.mjs.map +0 -1
- package/build/listItem/Button/ListItemButton.js +0 -43
- package/build/listItem/Button/ListItemButton.js.map +0 -1
- package/build/listItem/Button/ListItemButton.mjs +0 -41
- package/build/listItem/Button/ListItemButton.mjs.map +0 -1
- package/build/listItem/Checkbox/ListItemCheckbox.js +0 -30
- package/build/listItem/Checkbox/ListItemCheckbox.js.map +0 -1
- package/build/listItem/Checkbox/ListItemCheckbox.mjs +0 -28
- package/build/listItem/Checkbox/ListItemCheckbox.mjs.map +0 -1
- package/build/listItem/IconButton/ListItemIconButton.js +0 -56
- package/build/listItem/IconButton/ListItemIconButton.js.map +0 -1
- package/build/listItem/IconButton/ListItemIconButton.mjs +0 -54
- package/build/listItem/IconButton/ListItemIconButton.mjs.map +0 -1
- package/build/listItem/Image/ListItemImage.js +0 -31
- package/build/listItem/Image/ListItemImage.js.map +0 -1
- package/build/listItem/Image/ListItemImage.mjs +0 -29
- package/build/listItem/Image/ListItemImage.mjs.map +0 -1
- package/build/listItem/ListItem.js +0 -309
- package/build/listItem/ListItem.js.map +0 -1
- package/build/listItem/ListItem.mjs +0 -304
- package/build/listItem/ListItem.mjs.map +0 -1
- package/build/listItem/ListItemContext.js +0 -8
- package/build/listItem/ListItemContext.js.map +0 -1
- package/build/listItem/ListItemContext.mjs +0 -6
- package/build/listItem/ListItemContext.mjs.map +0 -1
- package/build/listItem/Navigation/ListItemNavigation.js +0 -44
- package/build/listItem/Navigation/ListItemNavigation.js.map +0 -1
- package/build/listItem/Navigation/ListItemNavigation.mjs +0 -42
- package/build/listItem/Navigation/ListItemNavigation.mjs.map +0 -1
- package/build/listItem/Prompt/ListItemPrompt.js +0 -59
- package/build/listItem/Prompt/ListItemPrompt.js.map +0 -1
- package/build/listItem/Prompt/ListItemPrompt.mjs +0 -54
- package/build/listItem/Prompt/ListItemPrompt.mjs.map +0 -1
- package/build/listItem/Radio/ListItemRadio.js +0 -30
- package/build/listItem/Radio/ListItemRadio.js.map +0 -1
- package/build/listItem/Radio/ListItemRadio.mjs +0 -28
- package/build/listItem/Radio/ListItemRadio.mjs.map +0 -1
- package/build/listItem/Switch/ListItemSwitch.js +0 -30
- package/build/listItem/Switch/ListItemSwitch.js.map +0 -1
- package/build/listItem/Switch/ListItemSwitch.mjs +0 -28
- package/build/listItem/Switch/ListItemSwitch.mjs.map +0 -1
- package/build/listItem/useListItemControl.js +0 -22
- package/build/listItem/useListItemControl.js.map +0 -1
- package/build/listItem/useListItemControl.mjs +0 -20
- package/build/listItem/useListItemControl.mjs.map +0 -1
- package/build/listItem/useListItemMedia.js +0 -21
- package/build/listItem/useListItemMedia.js.map +0 -1
- package/build/listItem/useListItemMedia.mjs +0 -19
- package/build/listItem/useListItemMedia.mjs.map +0 -1
- package/build/styles/listItem/ListItem.css +0 -770
- package/build/styles/listItem/ListItem.grid.css +0 -370
- package/build/styles/listItem/Prompt/ListItemPrompt.css +0 -157
- package/build/types/listItem/AdditionalInfo/ListItemAdditionalInfo.d.ts +0 -15
- package/build/types/listItem/AdditionalInfo/ListItemAdditionalInfo.d.ts.map +0 -1
- package/build/types/listItem/AdditionalInfo/index.d.ts +0 -3
- package/build/types/listItem/AdditionalInfo/index.d.ts.map +0 -1
- package/build/types/listItem/AvatarLayout/ListItemAvatarLayout.d.ts +0 -18
- package/build/types/listItem/AvatarLayout/ListItemAvatarLayout.d.ts.map +0 -1
- package/build/types/listItem/AvatarLayout/index.d.ts +0 -3
- package/build/types/listItem/AvatarLayout/index.d.ts.map +0 -1
- package/build/types/listItem/AvatarView/ListItemAvatarView.d.ts +0 -16
- package/build/types/listItem/AvatarView/ListItemAvatarView.d.ts.map +0 -1
- package/build/types/listItem/AvatarView/index.d.ts +0 -3
- package/build/types/listItem/AvatarView/index.d.ts.map +0 -1
- package/build/types/listItem/Button/ListItemButton.d.ts +0 -20
- package/build/types/listItem/Button/ListItemButton.d.ts.map +0 -1
- package/build/types/listItem/Button/index.d.ts +0 -3
- package/build/types/listItem/Button/index.d.ts.map +0 -1
- package/build/types/listItem/Checkbox/ListItemCheckbox.d.ts +0 -14
- package/build/types/listItem/Checkbox/ListItemCheckbox.d.ts.map +0 -1
- package/build/types/listItem/Checkbox/index.d.ts +0 -3
- package/build/types/listItem/Checkbox/index.d.ts.map +0 -1
- package/build/types/listItem/IconButton/ListItemIconButton.d.ts +0 -18
- package/build/types/listItem/IconButton/ListItemIconButton.d.ts.map +0 -1
- package/build/types/listItem/IconButton/index.d.ts +0 -3
- package/build/types/listItem/IconButton/index.d.ts.map +0 -1
- package/build/types/listItem/Image/ListItemImage.d.ts +0 -25
- package/build/types/listItem/Image/ListItemImage.d.ts.map +0 -1
- package/build/types/listItem/Image/index.d.ts +0 -3
- package/build/types/listItem/Image/index.d.ts.map +0 -1
- package/build/types/listItem/ListItem.d.ts +0 -111
- package/build/types/listItem/ListItem.d.ts.map +0 -1
- package/build/types/listItem/ListItemContext.d.ts +0 -21
- package/build/types/listItem/ListItemContext.d.ts.map +0 -1
- package/build/types/listItem/Navigation/ListItemNavigation.d.ts +0 -15
- package/build/types/listItem/Navigation/ListItemNavigation.d.ts.map +0 -1
- package/build/types/listItem/Navigation/index.d.ts +0 -3
- package/build/types/listItem/Navigation/index.d.ts.map +0 -1
- package/build/types/listItem/Prompt/ListItemPrompt.d.ts +0 -16
- package/build/types/listItem/Prompt/ListItemPrompt.d.ts.map +0 -1
- package/build/types/listItem/Prompt/index.d.ts +0 -3
- package/build/types/listItem/Prompt/index.d.ts.map +0 -1
- package/build/types/listItem/Radio/ListItemRadio.d.ts +0 -14
- package/build/types/listItem/Radio/ListItemRadio.d.ts.map +0 -1
- package/build/types/listItem/Radio/index.d.ts +0 -3
- package/build/types/listItem/Radio/index.d.ts.map +0 -1
- package/build/types/listItem/Switch/ListItemSwitch.d.ts +0 -14
- package/build/types/listItem/Switch/ListItemSwitch.d.ts.map +0 -1
- package/build/types/listItem/Switch/index.d.ts +0 -3
- package/build/types/listItem/Switch/index.d.ts.map +0 -1
- package/build/types/listItem/_stories/helpers.d.ts +0 -27
- package/build/types/listItem/_stories/helpers.d.ts.map +0 -1
- package/build/types/listItem/_stories/subcomponents.d.ts +0 -18
- package/build/types/listItem/_stories/subcomponents.d.ts.map +0 -1
- package/build/types/listItem/index.d.ts +0 -14
- package/build/types/listItem/index.d.ts.map +0 -1
- package/build/types/listItem/test-utils.d.ts +0 -7
- package/build/types/listItem/test-utils.d.ts.map +0 -1
- package/build/types/listItem/useListItemControl.d.ts +0 -5
- package/build/types/listItem/useListItemControl.d.ts.map +0 -1
- package/build/types/listItem/useListItemMedia.d.ts +0 -6
- package/build/types/listItem/useListItemMedia.d.ts.map +0 -1
- package/src/listItem/AdditionalInfo/ListItemAdditionalInfo.spec.tsx +0 -56
- package/src/listItem/AdditionalInfo/ListItemAdditionalInfo.story.tsx +0 -198
- package/src/listItem/AdditionalInfo/ListItemAdditionalInfo.tsx +0 -36
- package/src/listItem/AdditionalInfo/index.ts +0 -2
- package/src/listItem/AvatarLayout/ListItemAvatarLayout.spec.tsx +0 -59
- package/src/listItem/AvatarLayout/ListItemAvatarLayout.story.tsx +0 -124
- package/src/listItem/AvatarLayout/ListItemAvatarLayout.tsx +0 -27
- package/src/listItem/AvatarLayout/index.ts +0 -2
- package/src/listItem/AvatarView/ListItemAvatarView.spec.tsx +0 -75
- package/src/listItem/AvatarView/ListItemAvatarView.story.tsx +0 -339
- package/src/listItem/AvatarView/ListItemAvatarView.tsx +0 -27
- package/src/listItem/AvatarView/index.ts +0 -2
- package/src/listItem/Button/ListItemButton.spec.tsx +0 -68
- package/src/listItem/Button/ListItemButton.story.tsx +0 -473
- package/src/listItem/Button/ListItemButton.tsx +0 -56
- package/src/listItem/Button/index.ts +0 -2
- package/src/listItem/Checkbox/ListItemCheckbox.spec.tsx +0 -82
- package/src/listItem/Checkbox/ListItemCheckbox.story.tsx +0 -128
- package/src/listItem/Checkbox/ListItemCheckbox.tsx +0 -33
- package/src/listItem/Checkbox/index.ts +0 -2
- package/src/listItem/IconButton/ListItemIconButton.spec.tsx +0 -119
- package/src/listItem/IconButton/ListItemIconButton.story.tsx +0 -284
- package/src/listItem/IconButton/ListItemIconButton.tsx +0 -73
- package/src/listItem/IconButton/index.ts +0 -2
- package/src/listItem/Image/ListItemImage.spec.tsx +0 -30
- package/src/listItem/Image/ListItemImage.story.tsx +0 -80
- package/src/listItem/Image/ListItemImage.tsx +0 -46
- package/src/listItem/Image/index.ts +0 -2
- package/src/listItem/ListItem.css +0 -770
- package/src/listItem/ListItem.grid.css +0 -370
- package/src/listItem/ListItem.grid.less +0 -622
- package/src/listItem/ListItem.less +0 -287
- package/src/listItem/ListItem.spec.tsx +0 -1511
- package/src/listItem/ListItem.tsx +0 -438
- package/src/listItem/ListItemContext.tsx +0 -26
- package/src/listItem/Navigation/ListItemNavigation.spec.tsx +0 -59
- package/src/listItem/Navigation/ListItemNavigation.story.tsx +0 -112
- package/src/listItem/Navigation/ListItemNavigation.tsx +0 -39
- package/src/listItem/Navigation/index.ts +0 -2
- package/src/listItem/Prompt/ListItemPrompt.css +0 -157
- package/src/listItem/Prompt/ListItemPrompt.less +0 -134
- package/src/listItem/Prompt/ListItemPrompt.spec.tsx +0 -36
- package/src/listItem/Prompt/ListItemPrompt.story.tsx +0 -204
- package/src/listItem/Prompt/ListItemPrompt.tsx +0 -32
- package/src/listItem/Prompt/index.ts +0 -2
- package/src/listItem/Radio/ListItemRadio.spec.tsx +0 -66
- package/src/listItem/Radio/ListItemRadio.story.tsx +0 -111
- package/src/listItem/Radio/ListItemRadio.tsx +0 -33
- package/src/listItem/Radio/index.ts +0 -2
- package/src/listItem/Switch/ListItemSwitch.spec.tsx +0 -47
- package/src/listItem/Switch/ListItemSwitch.story.tsx +0 -79
- package/src/listItem/Switch/ListItemSwitch.tsx +0 -33
- package/src/listItem/Switch/index.ts +0 -2
- package/src/listItem/_stories/ListItem.focus.test.story.tsx +0 -265
- package/src/listItem/_stories/ListItem.layout.test.story.tsx +0 -354
- package/src/listItem/_stories/ListItem.scenarios.story.tsx +0 -228
- package/src/listItem/_stories/ListItem.story.tsx +0 -774
- package/src/listItem/_stories/ListItem.variants.test.story.tsx +0 -271
- package/src/listItem/_stories/helpers.tsx +0 -53
- package/src/listItem/_stories/subcomponents.tsx +0 -139
- package/src/listItem/index.ts +0 -14
- package/src/listItem/test-utils.tsx +0 -33
- package/src/listItem/useListItemControl.tsx +0 -18
- package/src/listItem/useListItemMedia.tsx +0 -16
package/build/styles/main.css
CHANGED
|
@@ -741,7 +741,7 @@
|
|
|
741
741
|
justify-content: center;
|
|
742
742
|
vertical-align: middle;
|
|
743
743
|
text-align: center;
|
|
744
|
-
white-space:
|
|
744
|
+
white-space: nowrap;
|
|
745
745
|
word-wrap: break-word;
|
|
746
746
|
-webkit-appearance: none;
|
|
747
747
|
-moz-appearance: none;
|
|
@@ -2635,776 +2635,6 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
|
|
|
2635
2635
|
border-radius: 9999px !important;
|
|
2636
2636
|
border-radius: var(--radius-full) !important;
|
|
2637
2637
|
}
|
|
2638
|
-
.wds-list-item-gridWrapper {
|
|
2639
|
-
display: grid;
|
|
2640
|
-
grid-gap: 4px 16px;
|
|
2641
|
-
grid-gap: var(--size-4) var(--size-16);
|
|
2642
|
-
gap: 4px 16px;
|
|
2643
|
-
gap: var(--size-4) var(--size-16);
|
|
2644
|
-
}
|
|
2645
|
-
@container (min-width: 375px) {
|
|
2646
|
-
.wds-list-item-gridWrapper .wds-list-item-media-image {
|
|
2647
|
-
-o-object-position: center;
|
|
2648
|
-
object-position: center;
|
|
2649
|
-
}
|
|
2650
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-hasPrompt {
|
|
2651
|
-
grid-template-columns: auto 1fr auto;
|
|
2652
|
-
grid-template-rows: auto auto auto;
|
|
2653
|
-
grid-template-areas: "media body control" ". info ." ". prompt prompt";
|
|
2654
|
-
}
|
|
2655
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-noPrompt {
|
|
2656
|
-
grid-template-columns: auto 1fr auto;
|
|
2657
|
-
grid-template-rows: auto auto;
|
|
2658
|
-
grid-template-areas: "media body control" ". info .";
|
|
2659
|
-
}
|
|
2660
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt {
|
|
2661
|
-
grid-template-columns: auto 1fr auto;
|
|
2662
|
-
grid-template-rows: auto auto;
|
|
2663
|
-
grid-template-areas: "media body control" ". prompt prompt";
|
|
2664
|
-
}
|
|
2665
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-noPrompt {
|
|
2666
|
-
grid-template-columns: auto 1fr auto;
|
|
2667
|
-
grid-template-rows: auto;
|
|
2668
|
-
grid-template-areas: "media body control";
|
|
2669
|
-
}
|
|
2670
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-hasInfo-hasPrompt {
|
|
2671
|
-
grid-template-columns: auto 1fr;
|
|
2672
|
-
grid-template-rows: auto auto;
|
|
2673
|
-
grid-template-areas: "media body" ". info" ". prompt";
|
|
2674
|
-
}
|
|
2675
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-hasInfo-noPrompt {
|
|
2676
|
-
grid-template-columns: auto 1fr;
|
|
2677
|
-
grid-template-rows: auto auto auto;
|
|
2678
|
-
grid-template-areas: "media body" ". info";
|
|
2679
|
-
}
|
|
2680
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt {
|
|
2681
|
-
grid-template-columns: auto 1fr;
|
|
2682
|
-
grid-template-rows: auto auto;
|
|
2683
|
-
grid-template-areas: "media body" ". prompt";
|
|
2684
|
-
}
|
|
2685
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-noPrompt {
|
|
2686
|
-
grid-template-columns: auto 1fr;
|
|
2687
|
-
grid-template-rows: auto;
|
|
2688
|
-
grid-template-areas: "media body";
|
|
2689
|
-
}
|
|
2690
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl .wds-list-item-prompt {
|
|
2691
|
-
grid-column: 1 / -1;
|
|
2692
|
-
}
|
|
2693
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-hasPrompt {
|
|
2694
|
-
grid-template-columns: 1fr auto;
|
|
2695
|
-
grid-template-rows: auto auto auto;
|
|
2696
|
-
grid-template-areas: "body control" "info ." "prompt prompt";
|
|
2697
|
-
}
|
|
2698
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-noPrompt {
|
|
2699
|
-
grid-template-columns: 1fr auto;
|
|
2700
|
-
grid-template-rows: auto auto;
|
|
2701
|
-
grid-template-areas: "body control" "info .";
|
|
2702
|
-
}
|
|
2703
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-hasPrompt {
|
|
2704
|
-
grid-template-columns: 1fr auto;
|
|
2705
|
-
grid-template-rows: auto auto;
|
|
2706
|
-
grid-template-areas: "body control" "prompt prompt";
|
|
2707
|
-
}
|
|
2708
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-noPrompt {
|
|
2709
|
-
grid-template-columns: 1fr auto;
|
|
2710
|
-
grid-template-rows: auto;
|
|
2711
|
-
grid-template-areas: "body control";
|
|
2712
|
-
}
|
|
2713
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl .wds-list-item-prompt {
|
|
2714
|
-
grid-column: 1 / -1;
|
|
2715
|
-
}
|
|
2716
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-hasInfo-hasPrompt {
|
|
2717
|
-
grid-template-columns: 1fr;
|
|
2718
|
-
grid-template-rows: auto auto auto;
|
|
2719
|
-
grid-template-areas: "body" "info" "prompt";
|
|
2720
|
-
}
|
|
2721
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-hasInfo-noPrompt {
|
|
2722
|
-
grid-template-columns: 1fr;
|
|
2723
|
-
grid-template-rows: auto auto;
|
|
2724
|
-
grid-template-areas: "body" "info";
|
|
2725
|
-
}
|
|
2726
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-noInfo-hasPrompt {
|
|
2727
|
-
grid-template-columns: 1fr;
|
|
2728
|
-
grid-template-rows: auto auto;
|
|
2729
|
-
grid-template-areas: "body" "prompt";
|
|
2730
|
-
}
|
|
2731
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-noInfo-noPrompt {
|
|
2732
|
-
grid-template-columns: 1fr;
|
|
2733
|
-
grid-template-rows: auto;
|
|
2734
|
-
grid-template-areas: "body";
|
|
2735
|
-
}
|
|
2736
|
-
}
|
|
2737
|
-
@container (min-width: 297px) and (max-width: 375px) {
|
|
2738
|
-
.wds-list-item-gridWrapper .wds-list-item-media-image {
|
|
2739
|
-
-o-object-position: bottom left;
|
|
2740
|
-
object-position: bottom left;
|
|
2741
|
-
}
|
|
2742
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl .wds-list-item-media {
|
|
2743
|
-
margin-bottom: 12px;
|
|
2744
|
-
margin-bottom: var(--size-12);
|
|
2745
|
-
}
|
|
2746
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-hasPrompt {
|
|
2747
|
-
grid-template-columns: 1fr auto;
|
|
2748
|
-
grid-template-rows: auto auto auto auto;
|
|
2749
|
-
grid-template-areas: "media media" "body control" "info control" "prompt prompt";
|
|
2750
|
-
}
|
|
2751
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-hasPrompt:has(.wds-list-item-button-control) {
|
|
2752
|
-
grid-template-columns: 1fr;
|
|
2753
|
-
grid-template-areas: "media" "body" "info" "prompt" "control";
|
|
2754
|
-
}
|
|
2755
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-noPrompt {
|
|
2756
|
-
grid-template-columns: 1fr auto;
|
|
2757
|
-
grid-template-rows: auto auto auto;
|
|
2758
|
-
grid-template-areas: "media media" "body control" "info control";
|
|
2759
|
-
}
|
|
2760
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-noPrompt:has(.wds-list-item-button-control) {
|
|
2761
|
-
grid-template-columns: 1fr;
|
|
2762
|
-
grid-template-areas: "media" "body" "info" "control";
|
|
2763
|
-
}
|
|
2764
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt {
|
|
2765
|
-
grid-template-columns: 1fr auto;
|
|
2766
|
-
grid-template-rows: auto auto auto;
|
|
2767
|
-
grid-template-areas: "media media" "body control" "prompt prompt";
|
|
2768
|
-
}
|
|
2769
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:has(.wds-list-item-button-control) {
|
|
2770
|
-
grid-template-columns: 1fr;
|
|
2771
|
-
grid-template-areas: "media" "body" "prompt" "control";
|
|
2772
|
-
}
|
|
2773
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-noPrompt {
|
|
2774
|
-
grid-template-columns: 1fr auto;
|
|
2775
|
-
grid-template-rows: auto auto;
|
|
2776
|
-
grid-template-areas: "media media" "body control";
|
|
2777
|
-
}
|
|
2778
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-noPrompt:has(.wds-list-item-button-control) {
|
|
2779
|
-
grid-template-columns: 1fr;
|
|
2780
|
-
grid-template-areas: "media" "body" "control";
|
|
2781
|
-
}
|
|
2782
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl .wds-list-item-media {
|
|
2783
|
-
margin-bottom: 12px;
|
|
2784
|
-
margin-bottom: var(--size-12);
|
|
2785
|
-
}
|
|
2786
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-hasInfo-hasPrompt {
|
|
2787
|
-
grid-template-columns: auto auto;
|
|
2788
|
-
grid-template-rows: auto auto auto auto;
|
|
2789
|
-
grid-template-areas: "media media" "body body" "info info" "prompt prompt";
|
|
2790
|
-
}
|
|
2791
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-hasInfo-noPrompt {
|
|
2792
|
-
grid-template-columns: auto 1fr;
|
|
2793
|
-
grid-template-rows: auto auto auto;
|
|
2794
|
-
grid-template-areas: "media media" "body body" "info info";
|
|
2795
|
-
}
|
|
2796
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt {
|
|
2797
|
-
grid-template-columns: auto 1fr;
|
|
2798
|
-
grid-template-rows: auto auto auto;
|
|
2799
|
-
grid-template-areas: "media media" "body body" "prompt prompt";
|
|
2800
|
-
}
|
|
2801
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-noPrompt {
|
|
2802
|
-
grid-template-columns: 1fr;
|
|
2803
|
-
grid-template-rows: auto auto;
|
|
2804
|
-
grid-template-areas: "media" "body";
|
|
2805
|
-
}
|
|
2806
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl .wds-list-item-prompt {
|
|
2807
|
-
grid-column: 1 / -1;
|
|
2808
|
-
}
|
|
2809
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-hasPrompt {
|
|
2810
|
-
grid-template-columns: 1fr auto;
|
|
2811
|
-
grid-template-rows: auto auto auto;
|
|
2812
|
-
grid-template-areas: "body control" "info control" "prompt prompt";
|
|
2813
|
-
}
|
|
2814
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-hasPrompt:has(.wds-list-item-button-control) {
|
|
2815
|
-
grid-template-columns: 1fr;
|
|
2816
|
-
grid-template-areas: "body" "info" "prompt" "control";
|
|
2817
|
-
}
|
|
2818
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-noPrompt {
|
|
2819
|
-
grid-template-columns: 1fr auto;
|
|
2820
|
-
grid-template-rows: auto auto;
|
|
2821
|
-
grid-template-areas: "body control" "info control";
|
|
2822
|
-
}
|
|
2823
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-noPrompt:has(.wds-list-item-button-control) {
|
|
2824
|
-
grid-template-columns: 1fr;
|
|
2825
|
-
grid-template-areas: "body" "info" "control";
|
|
2826
|
-
}
|
|
2827
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-hasPrompt {
|
|
2828
|
-
grid-template-columns: 1fr auto;
|
|
2829
|
-
grid-template-rows: auto auto;
|
|
2830
|
-
grid-template-areas: "body control" "prompt prompt";
|
|
2831
|
-
}
|
|
2832
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-hasPrompt:has(.wds-list-item-button-control) {
|
|
2833
|
-
grid-template-columns: 1fr;
|
|
2834
|
-
grid-template-areas: "body" "prompt" "control";
|
|
2835
|
-
}
|
|
2836
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-noPrompt {
|
|
2837
|
-
grid-template-columns: 1fr auto;
|
|
2838
|
-
grid-template-rows: auto;
|
|
2839
|
-
grid-template-areas: "body control";
|
|
2840
|
-
}
|
|
2841
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-noPrompt:has(.wds-list-item-button-control) {
|
|
2842
|
-
grid-template-columns: 1fr;
|
|
2843
|
-
grid-template-areas: "body" "control";
|
|
2844
|
-
}
|
|
2845
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl .wds-list-item-prompt {
|
|
2846
|
-
grid-column: 1 / -1;
|
|
2847
|
-
}
|
|
2848
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-hasInfo-hasPrompt {
|
|
2849
|
-
grid-template-columns: 1fr;
|
|
2850
|
-
grid-template-rows: auto auto auto;
|
|
2851
|
-
grid-template-areas: "body" "info" "prompt";
|
|
2852
|
-
}
|
|
2853
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-hasInfo-noPrompt {
|
|
2854
|
-
grid-template-columns: 1fr;
|
|
2855
|
-
grid-template-rows: auto auto;
|
|
2856
|
-
grid-template-areas: "body" "info";
|
|
2857
|
-
}
|
|
2858
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-noInfo-hasPrompt {
|
|
2859
|
-
grid-template-columns: 1fr;
|
|
2860
|
-
grid-template-rows: auto auto;
|
|
2861
|
-
grid-template-areas: "body" "prompt";
|
|
2862
|
-
}
|
|
2863
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-noInfo-noPrompt {
|
|
2864
|
-
grid-template-columns: 1fr;
|
|
2865
|
-
grid-template-rows: auto;
|
|
2866
|
-
grid-template-areas: "body";
|
|
2867
|
-
}
|
|
2868
|
-
}
|
|
2869
|
-
@container (max-width: 297px) {
|
|
2870
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-hasPrompt {
|
|
2871
|
-
grid-template-columns: auto 1fr;
|
|
2872
|
-
grid-template-rows: auto auto auto;
|
|
2873
|
-
grid-template-areas: "body control" "info control" "prompt prompt";
|
|
2874
|
-
}
|
|
2875
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-hasPrompt:has(.wds-list-item-button-control) {
|
|
2876
|
-
grid-template-columns: 1fr;
|
|
2877
|
-
grid-template-rows: auto;
|
|
2878
|
-
grid-template-areas: "body" "info" "prompt" "control";
|
|
2879
|
-
}
|
|
2880
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-noPrompt {
|
|
2881
|
-
grid-template-columns: auto 1fr;
|
|
2882
|
-
grid-template-rows: auto auto;
|
|
2883
|
-
grid-template-areas: "body control" "info control";
|
|
2884
|
-
}
|
|
2885
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-hasInfo-noPrompt:has(.wds-list-item-button-control) {
|
|
2886
|
-
grid-template-columns: 1fr;
|
|
2887
|
-
grid-template-areas: "body" "info" "control";
|
|
2888
|
-
}
|
|
2889
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt {
|
|
2890
|
-
grid-template-columns: auto 1fr;
|
|
2891
|
-
grid-template-rows: auto auto;
|
|
2892
|
-
grid-template-areas: "body control" "prompt prompt";
|
|
2893
|
-
}
|
|
2894
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-hasPrompt:has(.wds-list-item-button-control) {
|
|
2895
|
-
grid-template-columns: 1fr;
|
|
2896
|
-
grid-template-areas: "body" "prompt" "control";
|
|
2897
|
-
}
|
|
2898
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-noPrompt {
|
|
2899
|
-
grid-template-columns: auto 1fr;
|
|
2900
|
-
grid-template-rows: auto;
|
|
2901
|
-
grid-template-areas: "body control";
|
|
2902
|
-
}
|
|
2903
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-hasControl.wds-list-item-noInfo-noPrompt:has(.wds-list-item-button-control) {
|
|
2904
|
-
grid-template-columns: 1fr;
|
|
2905
|
-
grid-template-areas: "body" "control";
|
|
2906
|
-
}
|
|
2907
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-hasInfo-hasPrompt {
|
|
2908
|
-
grid-template-columns: auto;
|
|
2909
|
-
grid-template-rows: auto auto;
|
|
2910
|
-
grid-template-areas: "body" "info" "prompt";
|
|
2911
|
-
}
|
|
2912
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-hasInfo-noPrompt {
|
|
2913
|
-
grid-template-columns: auto;
|
|
2914
|
-
grid-template-rows: auto auto auto;
|
|
2915
|
-
grid-template-areas: "body" "info";
|
|
2916
|
-
}
|
|
2917
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-hasPrompt {
|
|
2918
|
-
grid-template-columns: auto;
|
|
2919
|
-
grid-template-rows: auto auto;
|
|
2920
|
-
grid-template-areas: "body" "prompt";
|
|
2921
|
-
}
|
|
2922
|
-
.wds-list-item-gridWrapper.wds-list-item-hasMedia-noControl.wds-list-item-noInfo-noPrompt {
|
|
2923
|
-
grid-template-columns: 1fr;
|
|
2924
|
-
grid-template-rows: auto;
|
|
2925
|
-
grid-template-areas: "body";
|
|
2926
|
-
}
|
|
2927
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl .wds-list-item-prompt {
|
|
2928
|
-
grid-column: 1 / -1;
|
|
2929
|
-
}
|
|
2930
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-hasPrompt {
|
|
2931
|
-
grid-template-columns: 1fr auto;
|
|
2932
|
-
grid-template-rows: auto auto auto;
|
|
2933
|
-
grid-template-areas: "body control" "info control" "prompt prompt";
|
|
2934
|
-
}
|
|
2935
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-hasPrompt:has(.wds-list-item-button-control) {
|
|
2936
|
-
grid-template-columns: 1fr;
|
|
2937
|
-
grid-template-rows: auto;
|
|
2938
|
-
grid-template-areas: "body" "info" "prompt" "control";
|
|
2939
|
-
}
|
|
2940
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-noPrompt {
|
|
2941
|
-
grid-template-columns: 1fr auto;
|
|
2942
|
-
grid-template-rows: auto auto;
|
|
2943
|
-
grid-template-areas: "body control" "info control";
|
|
2944
|
-
}
|
|
2945
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-hasInfo-noPrompt:has(.wds-list-item-button-control) {
|
|
2946
|
-
grid-template-columns: 1fr;
|
|
2947
|
-
grid-template-rows: auto;
|
|
2948
|
-
grid-template-areas: "body" "info" "control";
|
|
2949
|
-
}
|
|
2950
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-hasPrompt {
|
|
2951
|
-
grid-template-columns: 1fr auto;
|
|
2952
|
-
grid-template-rows: auto auto;
|
|
2953
|
-
grid-template-areas: "body control" "prompt prompt";
|
|
2954
|
-
}
|
|
2955
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-hasPrompt:has(.wds-list-item-button-control) {
|
|
2956
|
-
grid-template-columns: 1fr;
|
|
2957
|
-
grid-template-rows: auto;
|
|
2958
|
-
grid-template-areas: "body" "prompt" "control";
|
|
2959
|
-
}
|
|
2960
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-noPrompt {
|
|
2961
|
-
grid-template-columns: 1fr auto;
|
|
2962
|
-
grid-template-rows: auto;
|
|
2963
|
-
grid-template-areas: "body control";
|
|
2964
|
-
}
|
|
2965
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-hasControl.wds-list-item-noInfo-noPrompt:has(.wds-list-item-button-control) {
|
|
2966
|
-
grid-template-columns: 1fr;
|
|
2967
|
-
grid-template-rows: auto;
|
|
2968
|
-
grid-template-areas: "body" "control";
|
|
2969
|
-
}
|
|
2970
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl .wds-list-item-prompt {
|
|
2971
|
-
grid-column: 1 / -1;
|
|
2972
|
-
}
|
|
2973
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-hasInfo-hasPrompt {
|
|
2974
|
-
grid-template-columns: 1fr;
|
|
2975
|
-
grid-template-rows: auto auto auto;
|
|
2976
|
-
grid-template-areas: "body" "info" "prompt";
|
|
2977
|
-
}
|
|
2978
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-hasInfo-noPrompt {
|
|
2979
|
-
grid-template-columns: 1fr;
|
|
2980
|
-
grid-template-rows: auto auto;
|
|
2981
|
-
grid-template-areas: "body" "info";
|
|
2982
|
-
}
|
|
2983
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-noInfo-hasPrompt {
|
|
2984
|
-
grid-template-columns: 1fr;
|
|
2985
|
-
grid-template-rows: auto auto;
|
|
2986
|
-
grid-template-areas: "body" "prompt";
|
|
2987
|
-
}
|
|
2988
|
-
.wds-list-item-gridWrapper.wds-list-item-noMedia-noControl.wds-list-item-noInfo-noPrompt {
|
|
2989
|
-
grid-template-columns: 1fr;
|
|
2990
|
-
grid-template-rows: auto;
|
|
2991
|
-
grid-template-areas: "body";
|
|
2992
|
-
}
|
|
2993
|
-
.wds-list-item-gridWrapper .wds-list-item-media {
|
|
2994
|
-
display: none;
|
|
2995
|
-
}
|
|
2996
|
-
.wds-list-item-gridWrapper .wds-list-item-body {
|
|
2997
|
-
grid-area: body;
|
|
2998
|
-
display: grid;
|
|
2999
|
-
grid-template-columns: 1fr;
|
|
3000
|
-
justify-items: start;
|
|
3001
|
-
grid-gap: 0;
|
|
3002
|
-
gap: 0;
|
|
3003
|
-
}
|
|
3004
|
-
.wds-list-item-gridWrapper .wds-list-item-body .wds-list-item-value {
|
|
3005
|
-
text-align: left;
|
|
3006
|
-
}
|
|
3007
|
-
}
|
|
3008
|
-
.wds-list-item-prompt {
|
|
3009
|
-
grid-area: prompt;
|
|
3010
|
-
display: inline-flex;
|
|
3011
|
-
justify-self: start;
|
|
3012
|
-
text-align: left;
|
|
3013
|
-
padding-top: calc(8px / 2);
|
|
3014
|
-
padding-top: calc(var(--padding-x-small) / 2);
|
|
3015
|
-
padding-bottom: calc(8px / 2);
|
|
3016
|
-
padding-bottom: calc(var(--padding-x-small) / 2);
|
|
3017
|
-
padding-left: calc(8px - 1px);
|
|
3018
|
-
padding-left: calc(var(--padding-x-small) - 1px);
|
|
3019
|
-
padding-right: 8px;
|
|
3020
|
-
padding-right: var(--padding-x-small);
|
|
3021
|
-
border-radius: 10px;
|
|
3022
|
-
border-radius: var(--radius-small);
|
|
3023
|
-
word-break: break-word;
|
|
3024
|
-
word-wrap: break-word;
|
|
3025
|
-
}
|
|
3026
|
-
.wds-list-item-prompt:has(a),
|
|
3027
|
-
.wds-list-item-prompt:has(button) {
|
|
3028
|
-
position: relative;
|
|
3029
|
-
z-index: 1;
|
|
3030
|
-
}
|
|
3031
|
-
.wds-list-item-prompt a,
|
|
3032
|
-
.wds-list-item-prompt button {
|
|
3033
|
-
text-underline-offset: calc(4px / 2);
|
|
3034
|
-
text-underline-offset: calc(var(--size-4) / 2);
|
|
3035
|
-
}
|
|
3036
|
-
.wds-list-item-prompt a:first-of-type:before,
|
|
3037
|
-
.wds-list-item-prompt button:first-of-type:before {
|
|
3038
|
-
content: '';
|
|
3039
|
-
position: absolute;
|
|
3040
|
-
inset: 0;
|
|
3041
|
-
}
|
|
3042
|
-
.wds-list-item-prompt.np-prompt-icon {
|
|
3043
|
-
padding-left: calc(8px - 1px);
|
|
3044
|
-
padding-left: calc(var(--padding-x-small) - 1px);
|
|
3045
|
-
padding-right: 8px;
|
|
3046
|
-
padding-right: var(--padding-x-small);
|
|
3047
|
-
display: inline-flex;
|
|
3048
|
-
align-items: center;
|
|
3049
|
-
gap: 4px;
|
|
3050
|
-
gap: var(--size-4);
|
|
3051
|
-
}
|
|
3052
|
-
.wds-list-item-prompt .np-prompt-icon {
|
|
3053
|
-
padding-right: calc(12px / 2);
|
|
3054
|
-
padding-right: calc(var(--size-12) / 2);
|
|
3055
|
-
padding-top: calc(4px - 1px);
|
|
3056
|
-
padding-top: calc(var(--size-4) - 1px);
|
|
3057
|
-
padding-bottom: calc(4px - 1px);
|
|
3058
|
-
padding-bottom: calc(var(--size-4) - 1px);
|
|
3059
|
-
}
|
|
3060
|
-
.wds-list-item-prompt .np-prompt-icon .tw-icon-tags,
|
|
3061
|
-
.wds-list-item-prompt .np-prompt-icon .tw-icon-confetti {
|
|
3062
|
-
color: var(--color-sentiment-positive-primary);
|
|
3063
|
-
}
|
|
3064
|
-
.wds-list-item-prompt.negative {
|
|
3065
|
-
background-color: var(--color-sentiment-negative-secondary);
|
|
3066
|
-
color: var(--color-sentiment-negative-primary);
|
|
3067
|
-
}
|
|
3068
|
-
.wds-list-item-prompt.negative a,
|
|
3069
|
-
.wds-list-item-prompt.negative button {
|
|
3070
|
-
color: var(--color-sentiment-negative-primary);
|
|
3071
|
-
}
|
|
3072
|
-
.wds-list-item-prompt.negative a:hover,
|
|
3073
|
-
.wds-list-item-prompt.negative button:hover {
|
|
3074
|
-
color: var(--color-sentiment-negative-primary-hover);
|
|
3075
|
-
}
|
|
3076
|
-
.wds-list-item-prompt.negative a:active,
|
|
3077
|
-
.wds-list-item-prompt.negative button:active {
|
|
3078
|
-
color: var(--color-sentiment-negative-primary-active);
|
|
3079
|
-
}
|
|
3080
|
-
.wds-list-item-prompt.wds-list-item-prompt.negative:has(a, button):hover {
|
|
3081
|
-
background-color: var(--color-sentiment-negative-secondary-hover);
|
|
3082
|
-
}
|
|
3083
|
-
.wds-list-item-prompt.wds-list-item-prompt.negative:has(a, button):active {
|
|
3084
|
-
background-color: var(--color-sentiment-negative-secondary-active);
|
|
3085
|
-
}
|
|
3086
|
-
.wds-list-item-prompt.positive,
|
|
3087
|
-
.wds-list-item-prompt.discount,
|
|
3088
|
-
.wds-list-item-prompt.savings {
|
|
3089
|
-
background-color: var(--color-sentiment-positive-secondary);
|
|
3090
|
-
color: var(--color-sentiment-positive-primary);
|
|
3091
|
-
}
|
|
3092
|
-
.wds-list-item-prompt.positive a,
|
|
3093
|
-
.wds-list-item-prompt.discount a,
|
|
3094
|
-
.wds-list-item-prompt.savings a,
|
|
3095
|
-
.wds-list-item-prompt.positive button,
|
|
3096
|
-
.wds-list-item-prompt.discount button,
|
|
3097
|
-
.wds-list-item-prompt.savings button {
|
|
3098
|
-
color: var(--color-sentiment-positive-primary);
|
|
3099
|
-
}
|
|
3100
|
-
.wds-list-item-prompt.positive a:hover,
|
|
3101
|
-
.wds-list-item-prompt.discount a:hover,
|
|
3102
|
-
.wds-list-item-prompt.savings a:hover,
|
|
3103
|
-
.wds-list-item-prompt.positive button:hover,
|
|
3104
|
-
.wds-list-item-prompt.discount button:hover,
|
|
3105
|
-
.wds-list-item-prompt.savings button:hover {
|
|
3106
|
-
color: var(--color-sentiment-positive-primary-hover);
|
|
3107
|
-
}
|
|
3108
|
-
.wds-list-item-prompt.positive a:active,
|
|
3109
|
-
.wds-list-item-prompt.discount a:active,
|
|
3110
|
-
.wds-list-item-prompt.savings a:active,
|
|
3111
|
-
.wds-list-item-prompt.positive button:active,
|
|
3112
|
-
.wds-list-item-prompt.discount button:active,
|
|
3113
|
-
.wds-list-item-prompt.savings button:active {
|
|
3114
|
-
color: var(--color-sentiment-positive-primary-active);
|
|
3115
|
-
}
|
|
3116
|
-
.wds-list-item-prompt.wds-list-item-prompt.positive:has(a, button):hover,
|
|
3117
|
-
.wds-list-item-prompt.wds-list-item-prompt.discount:has(a, button):hover,
|
|
3118
|
-
.wds-list-item-prompt.wds-list-item-prompt.savings:has(a, button):hover {
|
|
3119
|
-
background-color: var(--color-sentiment-positive-secondary-hover);
|
|
3120
|
-
}
|
|
3121
|
-
.wds-list-item-prompt.wds-list-item-prompt.positive:has(a, button):active,
|
|
3122
|
-
.wds-list-item-prompt.wds-list-item-prompt.discount:has(a, button):active,
|
|
3123
|
-
.wds-list-item-prompt.wds-list-item-prompt.savings:has(a, button):active {
|
|
3124
|
-
background-color: var(--color-sentiment-positive-secondary-active);
|
|
3125
|
-
}
|
|
3126
|
-
.wds-list-item-prompt.neutral {
|
|
3127
|
-
background-color: rgba(134,167,189,0.10196);
|
|
3128
|
-
background-color: var(--color-background-neutral);
|
|
3129
|
-
color: #37517e;
|
|
3130
|
-
color: var(--color-content-primary);
|
|
3131
|
-
}
|
|
3132
|
-
.wds-list-item-prompt.neutral a,
|
|
3133
|
-
.wds-list-item-prompt.neutral button {
|
|
3134
|
-
color: #37517e;
|
|
3135
|
-
color: var(--color-content-primary);
|
|
3136
|
-
}
|
|
3137
|
-
.wds-list-item-prompt.wds-list-item-prompt.neutral:has(a, button):hover {
|
|
3138
|
-
background-color: var(--color-background-neutral-hover);
|
|
3139
|
-
}
|
|
3140
|
-
.wds-list-item-prompt.wds-list-item-prompt.neutral:has(a, button):active {
|
|
3141
|
-
background-color: var(--color-background-neutral-active);
|
|
3142
|
-
}
|
|
3143
|
-
.wds-list-item-prompt.warning {
|
|
3144
|
-
background-color: var(--color-sentiment-warning-secondary);
|
|
3145
|
-
color: var(--color-sentiment-warning-content);
|
|
3146
|
-
}
|
|
3147
|
-
.wds-list-item-prompt.warning a,
|
|
3148
|
-
.wds-list-item-prompt.warning button {
|
|
3149
|
-
color: var(--color-sentiment-warning-content);
|
|
3150
|
-
}
|
|
3151
|
-
.wds-list-item-prompt.warning a:hover,
|
|
3152
|
-
.wds-list-item-prompt.warning button:hover {
|
|
3153
|
-
color: var(--color-sentiment-warning-content-hover);
|
|
3154
|
-
}
|
|
3155
|
-
.wds-list-item-prompt.warning a:active,
|
|
3156
|
-
.wds-list-item-prompt.warning button:active {
|
|
3157
|
-
color: var(--color-sentiment-warning-content-active);
|
|
3158
|
-
}
|
|
3159
|
-
.wds-list-item-prompt.wds-list-item-prompt.warning:has(a, button):hover {
|
|
3160
|
-
background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 92%, var(--color-sentiment-warning-primary));
|
|
3161
|
-
}
|
|
3162
|
-
.wds-list-item-prompt.wds-list-item-prompt.warning:has(a, button):active {
|
|
3163
|
-
background-color: color-mix(in srgb, var(--color-sentiment-warning-secondary) 84%, var(--color-sentiment-warning-primary));
|
|
3164
|
-
}
|
|
3165
|
-
.wds-list-item {
|
|
3166
|
-
list-style: none;
|
|
3167
|
-
width: 100%;
|
|
3168
|
-
border-radius: 16px;
|
|
3169
|
-
border-radius: var(--radius-medium);
|
|
3170
|
-
background-color: #ffffff;
|
|
3171
|
-
background-color: var(--color-background-screen);
|
|
3172
|
-
position: relative;
|
|
3173
|
-
padding: 12px 0;
|
|
3174
|
-
padding: var(--size-12) 0;
|
|
3175
|
-
container-type: inline-size;
|
|
3176
|
-
}
|
|
3177
|
-
.wds-list-item + .wds-list-item-spotlight,
|
|
3178
|
-
.wds-list-item-spotlight + .wds-list-item {
|
|
3179
|
-
margin-top: 16px;
|
|
3180
|
-
margin-top: var(--size-16);
|
|
3181
|
-
}
|
|
3182
|
-
.wds-list-item:focus-within {
|
|
3183
|
-
z-index: 1;
|
|
3184
|
-
}
|
|
3185
|
-
.wds-list-item-view {
|
|
3186
|
-
display: grid;
|
|
3187
|
-
grid-column: 1 / -1;
|
|
3188
|
-
grid-row: 1 / -1;
|
|
3189
|
-
grid-template-columns: subgrid;
|
|
3190
|
-
grid-template-rows: subgrid;
|
|
3191
|
-
}
|
|
3192
|
-
.wds-list-item-view.fullyInteractive {
|
|
3193
|
-
margin-bottom: 0;
|
|
3194
|
-
}
|
|
3195
|
-
.wds-list-item-view.fullyInteractive:before {
|
|
3196
|
-
content: '';
|
|
3197
|
-
position: absolute;
|
|
3198
|
-
inset: 0;
|
|
3199
|
-
}
|
|
3200
|
-
.wds-list-item a {
|
|
3201
|
-
text-underline-offset: calc(4px / 2);
|
|
3202
|
-
text-underline-offset: calc(var(--size-4) / 2);
|
|
3203
|
-
}
|
|
3204
|
-
.wds-list-item-interactive .wds-list-item-control:focus-visible,
|
|
3205
|
-
.wds-list-item-interactive .np-checkbox-button:has(input[type="checkbox"]:focus-visible) .tw-checkbox-button {
|
|
3206
|
-
outline: none;
|
|
3207
|
-
}
|
|
3208
|
-
.wds-list-item-interactive .wds-list-item-additional-info {
|
|
3209
|
-
--ring-outline-offset: 0;
|
|
3210
|
-
}
|
|
3211
|
-
.wds-list-item-interactive a.wds-list-item-control,
|
|
3212
|
-
.wds-list-item-interactive a.wds-list-item-control:hover,
|
|
3213
|
-
.wds-list-item-interactive a.wds-list-item-control:focus {
|
|
3214
|
-
-webkit-text-decoration: none;
|
|
3215
|
-
text-decoration: none;
|
|
3216
|
-
}
|
|
3217
|
-
.wds-list-item-interactive a.wds-list-item-control:has(.wds-list-item-control_pseudo-element) {
|
|
3218
|
-
position: relative;
|
|
3219
|
-
z-index: 1;
|
|
3220
|
-
}
|
|
3221
|
-
.wds-list-item-interactive a.wds-list-item-control.wds-list-item-control_pseudo-element:before {
|
|
3222
|
-
content: '';
|
|
3223
|
-
position: absolute;
|
|
3224
|
-
inset: 0;
|
|
3225
|
-
}
|
|
3226
|
-
.wds-list-item-interactive.wds-list-item-spotlight:has(.wds-list-item-control:focus-visible),
|
|
3227
|
-
.wds-list-item-interactive.wds-list-item-spotlight:has(input[type="checkbox"]:focus-visible) {
|
|
3228
|
-
outline: var(--ring-outline-color) solid var(--ring-outline-width);
|
|
3229
|
-
outline-offset: var(--ring-outline-offset);
|
|
3230
|
-
outline-offset: -1px;
|
|
3231
|
-
}
|
|
3232
|
-
.wds-list-item-interactive.wds-list-item-spotlight:not(.disabled):not(:disabled):hover {
|
|
3233
|
-
background-color: var(--color-background-screen-hover);
|
|
3234
|
-
}
|
|
3235
|
-
.wds-list-item-interactive.wds-list-item-spotlight:not(.disabled):not(:disabled):active {
|
|
3236
|
-
background-color: var(--color-background-screen-active);
|
|
3237
|
-
}
|
|
3238
|
-
.wds-list-item-interactive.wds-list-item-spotlight:has(.wds-list-item-prompt:hover a, .wds-list-item-prompt:hover button):hover {
|
|
3239
|
-
background-color: transparent;
|
|
3240
|
-
background-color: initial;
|
|
3241
|
-
}
|
|
3242
|
-
.wds-list-item-interactive:not(.wds-list-item-spotlight):has(.wds-list-item-control:focus-visible):before,
|
|
3243
|
-
.wds-list-item-interactive:not(.wds-list-item-spotlight):has(input[type="checkbox"]:focus-visible):before {
|
|
3244
|
-
outline: var(--ring-outline-color) solid var(--ring-outline-width);
|
|
3245
|
-
outline-offset: var(--ring-outline-offset);
|
|
3246
|
-
content: '';
|
|
3247
|
-
position: absolute;
|
|
3248
|
-
inset: 0 -8px;
|
|
3249
|
-
border-radius: 16px;
|
|
3250
|
-
border-radius: var(--radius-medium);
|
|
3251
|
-
outline-offset: -1px;
|
|
3252
|
-
}
|
|
3253
|
-
.wds-list-item-interactive:not(.wds-list-item-spotlight):not(.disabled):not(:disabled):hover:before,
|
|
3254
|
-
.wds-list-item-interactive:not(.wds-list-item-spotlight):not(.disabled):not(:disabled):active:before {
|
|
3255
|
-
content: '';
|
|
3256
|
-
position: absolute;
|
|
3257
|
-
inset: 0 -8px;
|
|
3258
|
-
border-radius: 16px;
|
|
3259
|
-
border-radius: var(--radius-medium);
|
|
3260
|
-
}
|
|
3261
|
-
.wds-list-item-interactive:not(.wds-list-item-spotlight):not(.disabled):not(:disabled):hover:before {
|
|
3262
|
-
background-color: var(--color-background-screen-hover);
|
|
3263
|
-
}
|
|
3264
|
-
.wds-list-item-interactive:not(.wds-list-item-spotlight):not(.disabled):not(:disabled):active:before {
|
|
3265
|
-
background-color: var(--color-background-screen-active);
|
|
3266
|
-
}
|
|
3267
|
-
.wds-list-item-interactive:not(.wds-list-item-spotlight):has(.wds-list-item-prompt:hover a, .wds-list-item-prompt:hover button):hover:before {
|
|
3268
|
-
background-color: transparent;
|
|
3269
|
-
background-color: initial;
|
|
3270
|
-
}
|
|
3271
|
-
.wds-list-item-interactive:not(.disabled):not(:disabled):hover .wds-list-item-control-wrapper .wds-Button {
|
|
3272
|
-
background-color: var(--Button-background-hover);
|
|
3273
|
-
color: var(--Button-color-hover);
|
|
3274
|
-
transition: none;
|
|
3275
|
-
}
|
|
3276
|
-
.wds-list-item-interactive .wds-list-item-button-control .wds-Button {
|
|
3277
|
-
transition: none;
|
|
3278
|
-
}
|
|
3279
|
-
.wds-list-item-media {
|
|
3280
|
-
grid-area: media;
|
|
3281
|
-
display: flex;
|
|
3282
|
-
align-items: start;
|
|
3283
|
-
}
|
|
3284
|
-
.wds-list-item-media-image-wrapper {
|
|
3285
|
-
width: var(--wds-list-item-media-size);
|
|
3286
|
-
height: var(--wds-list-item-media-size);
|
|
3287
|
-
}
|
|
3288
|
-
.wds-list-item-media-image {
|
|
3289
|
-
width: 100%;
|
|
3290
|
-
height: 100%;
|
|
3291
|
-
-o-object-fit: contain;
|
|
3292
|
-
object-fit: contain;
|
|
3293
|
-
}
|
|
3294
|
-
.wds-list-item-body {
|
|
3295
|
-
grid-area: body;
|
|
3296
|
-
align-items: center;
|
|
3297
|
-
width: 100%;
|
|
3298
|
-
display: grid;
|
|
3299
|
-
grid-template-columns: 1fr max-content;
|
|
3300
|
-
grid-template-columns: var(--wds-list-item-body-left, 1fr) var(--wds-list-item-body-right, max-content);
|
|
3301
|
-
grid-gap: 16px;
|
|
3302
|
-
grid-gap: var(--size-16);
|
|
3303
|
-
gap: 16px;
|
|
3304
|
-
gap: var(--size-16);
|
|
3305
|
-
word-break: break-word;
|
|
3306
|
-
}
|
|
3307
|
-
.wds-list-item-title,
|
|
3308
|
-
.wds-list-item-title-value {
|
|
3309
|
-
color: #37517e;
|
|
3310
|
-
color: var(--color-content-primary);
|
|
3311
|
-
}
|
|
3312
|
-
.wds-list-item-value {
|
|
3313
|
-
text-align: right;
|
|
3314
|
-
}
|
|
3315
|
-
.wds-list-item-body-center {
|
|
3316
|
-
display: flex;
|
|
3317
|
-
flex-direction: row;
|
|
3318
|
-
align-items: center;
|
|
3319
|
-
}
|
|
3320
|
-
.wds-list-item-additional-info {
|
|
3321
|
-
grid-area: info;
|
|
3322
|
-
color: #768e9c;
|
|
3323
|
-
color: var(--color-content-tertiary);
|
|
3324
|
-
margin-top: calc(4px * -1);
|
|
3325
|
-
margin-top: calc(var(--size-4) * -1);
|
|
3326
|
-
}
|
|
3327
|
-
.wds-list-item-control-wrapper {
|
|
3328
|
-
grid-area: control;
|
|
3329
|
-
align-content: center;
|
|
3330
|
-
height: var(--wds-list-item-control-wrapper-height);
|
|
3331
|
-
}
|
|
3332
|
-
.wds-list-item-navigation .tw-icon-chevron-right {
|
|
3333
|
-
color: #c9cbce;
|
|
3334
|
-
color: var(--color-interactive-secondary);
|
|
3335
|
-
}
|
|
3336
|
-
.wds-list-item-control {
|
|
3337
|
-
flex: 0 0 auto;
|
|
3338
|
-
}
|
|
3339
|
-
.wds-list-item.disabled {
|
|
3340
|
-
filter: none;
|
|
3341
|
-
opacity: 1;
|
|
3342
|
-
}
|
|
3343
|
-
.wds-list-item.disabled label {
|
|
3344
|
-
cursor: not-allowed;
|
|
3345
|
-
}
|
|
3346
|
-
.wds-list-item.disabled .tw-icon-backslash-circle {
|
|
3347
|
-
color: #768e9c;
|
|
3348
|
-
color: var(--color-content-tertiary);
|
|
3349
|
-
}
|
|
3350
|
-
.wds-list-item-spotlight {
|
|
3351
|
-
padding-left: 12px;
|
|
3352
|
-
padding-left: var(--size-12);
|
|
3353
|
-
padding-right: 12px;
|
|
3354
|
-
padding-right: var(--size-12);
|
|
3355
|
-
}
|
|
3356
|
-
.wds-list-item-spotlight-active {
|
|
3357
|
-
background-color: rgba(134,167,189,0.10196);
|
|
3358
|
-
background-color: var(--color-background-neutral);
|
|
3359
|
-
}
|
|
3360
|
-
.wds-list-item-spotlight-active:not(.disabled):not(:disabled):hover {
|
|
3361
|
-
background-color: var(--color-background-neutral-hover);
|
|
3362
|
-
}
|
|
3363
|
-
.wds-list-item-spotlight-active:not(.disabled):not(:disabled):active {
|
|
3364
|
-
background-color: var(--color-background-neutral-active);
|
|
3365
|
-
}
|
|
3366
|
-
.wds-list-item-spotlight-inactive {
|
|
3367
|
-
background-color: rgba(134, 167, 189, 0.025);
|
|
3368
|
-
}
|
|
3369
|
-
@supports (color: color-mix(in lch, red, blue)) {
|
|
3370
|
-
.wds-list-item-spotlight-inactive {
|
|
3371
|
-
background-color: color-mix(in srgb, var(--color-background-neutral) 25%, transparent);
|
|
3372
|
-
}
|
|
3373
|
-
}
|
|
3374
|
-
.wds-list-item-spotlight-inactive:not(.disabled):not(:disabled):hover {
|
|
3375
|
-
background-color: color-mix(in srgb, var(--color-background-neutral-hover) 25%, transparent);
|
|
3376
|
-
}
|
|
3377
|
-
.wds-list-item-spotlight-inactive:not(.disabled):not(:disabled):active {
|
|
3378
|
-
background-color: color-mix(in srgb, var(--color-background-neutral-active) 25%, transparent);
|
|
3379
|
-
}
|
|
3380
|
-
.wds-list-item .wds-list-item-spotlight__border {
|
|
3381
|
-
position: absolute;
|
|
3382
|
-
inset: 0;
|
|
3383
|
-
width: 100%;
|
|
3384
|
-
height: 100%;
|
|
3385
|
-
}
|
|
3386
|
-
.wds-list-item .wds-list-item-spotlight__border rect {
|
|
3387
|
-
--wds-list-item-spotlight-borderWidth: 1px;
|
|
3388
|
-
--wds-list-item-spotlight-borderWidthOffset: 0.5px;
|
|
3389
|
-
--wds-list-item-spotlight-strokeDashSize: calc(var(--size-12) * 0.5);
|
|
3390
|
-
fill: none;
|
|
3391
|
-
stroke: rgba(0,0,0,0.10196);
|
|
3392
|
-
stroke: var(--color-border-neutral);
|
|
3393
|
-
width: calc(100% - 1px);
|
|
3394
|
-
width: calc(100% - var(--wds-list-item-spotlight-borderWidth));
|
|
3395
|
-
height: calc(100% - 1px);
|
|
3396
|
-
height: calc(100% - var(--wds-list-item-spotlight-borderWidth));
|
|
3397
|
-
x: 0.5px;
|
|
3398
|
-
x: var(--wds-list-item-spotlight-borderWidthOffset);
|
|
3399
|
-
y: 0.5px;
|
|
3400
|
-
y: var(--wds-list-item-spotlight-borderWidthOffset);
|
|
3401
|
-
rx: calc(16px - 0.5px);
|
|
3402
|
-
rx: calc(var(--radius-medium) - var(--wds-list-item-spotlight-borderWidthOffset));
|
|
3403
|
-
ry: calc(16px - 0.5px);
|
|
3404
|
-
ry: calc(var(--radius-medium) - var(--wds-list-item-spotlight-borderWidthOffset));
|
|
3405
|
-
stroke-dasharray: calc(12px * 0.5) calc(12px * 0.5);
|
|
3406
|
-
stroke-dasharray: var(--wds-list-item-spotlight-strokeDashSize) var(--wds-list-item-spotlight-strokeDashSize);
|
|
3407
|
-
}
|
|
3408
2638
|
.np-field-control {
|
|
3409
2639
|
margin-top: 4px;
|
|
3410
2640
|
margin-top: var(--size-4);
|