reshaped 2.10.13 → 2.10.14
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/CHANGELOG.md +5 -0
- package/bundle.css +1 -1
- package/bundle.js +8 -8
- package/components/Badge/Badge.types.d.ts +1 -1
- package/components/Calendar/CalendarMonth.js +1 -1
- package/components/Card/Card.module.css +1 -1
- package/components/Tabs/Tabs.module.css +1 -1
- package/components/Tabs/tests/Tabs.stories.js +1 -1
- package/components/TextField/TextField.module.css +1 -1
- package/components/TextField/tests/TextField.stories.js +1 -1
- package/components/View/View.module.css +1 -1
- package/package.json +1 -1
- package/styles/padding/padding.module.css +1 -1
|
@@ -16,7 +16,7 @@ type WithChildren = BaseProps & {
|
|
|
16
16
|
variant?: "faded" | "outline";
|
|
17
17
|
};
|
|
18
18
|
type WithEmpty = BaseProps & {
|
|
19
|
-
color: "critical" | "positive" | "primary";
|
|
19
|
+
color: "critical" | "warning" | "positive" | "primary";
|
|
20
20
|
children?: never;
|
|
21
21
|
variant?: never;
|
|
22
22
|
};
|
|
@@ -33,7 +33,7 @@ const CalendarMonth = (props) => {
|
|
|
33
33
|
let focusable = false;
|
|
34
34
|
if (!foundFocusableDate && date) {
|
|
35
35
|
if (!!startValue && startValue.getMonth() === (date === null || date === void 0 ? void 0 : date.getMonth())) {
|
|
36
|
-
focusable =
|
|
36
|
+
focusable = getLocalISODate({ date: startValue }) === getLocalISODate({ date });
|
|
37
37
|
}
|
|
38
38
|
else if (isoDate && month === today.getMonth()) {
|
|
39
39
|
focusable = isoDate >= isoToday && !disabled;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.root{background:var(--rs-color-background-elevation-base);border:
|
|
1
|
+
.root{--rs-border-width:1px;background:var(--rs-color-background-elevation-base);border:var(--rs-border-width) solid var(--rs-color-border-neutral-faded);color:var(--rs-color-foreground-neutral);display:block;overflow:hidden;text-align:initial;transition:var(--rs-duration-fast) var(--rs-easing-accelerate);transition-property:box-shadow,border-color}.content,.root{position:relative}.content{z-index:var(--rs-z-index-raised)}.--selected{border-color:transparent;box-shadow:0 0 0 2px var(--rs-color-border-primary);transition-timing-function:var(--rs-easing-decelerate)}.--elevated{background:var(--rs-color-background-elevation-raised);box-shadow:var(--rs-shadow-raised)}.--actionable:not(.--selected){color:inherit;cursor:pointer;outline:none;text-decoration:none}[data-rs-keyboard] .--actionable:not(.--selected):focus{box-shadow:var(--rs-focus-shadow)}.--actionable:not(.--selected):before{background:rgba(var(--rs-color-rgb-background-neutral-faded),40%);content:"";inset:0;opacity:0;pointer-events:none;position:absolute;transition:opacity var(--rs-duration-fast) var(--rs-easing-standard)}.--actionable:not(.--selected):hover:before{opacity:1}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.root{box-sizing:initial;max-width:100%}.list,.root{position:relative}.inner:after{background-color:var(--rs-color-border-neutral-faded);content:"";position:absolute;z-index:2}.listItem{--rs-tabs-gap:var(--rs-unit-x4);flex-shrink:0;position:relative}.button{overflow:hidden;position:relative;z-index:1;-webkit-tap-highlight-color:transparent}.button,.buttonContent{border-radius:var(--rs-unit-radius-medium);width:100%}.buttonContent{align-items:center;box-sizing:border-box;display:flex}.buttonContent:hover{color:var(--rs-color-foreground-neutral-faded)}.icon{color:inherit;transition:color var(--rs-duration-fast) var(--rs-easing-standard)}[data-rs-keyboard] .radio:focus+.buttonContent{box-shadow:var(--rs-focus-inset-shadow)}.icon:not(:last-child){margin-inline-end:var(--rs-unit-x2)}.--item-active:after{content:""}.--item-active:after,.selector{background:var(--rs-color-border-primary);border-radius:calc(var(--rs-unit-radius-medium) - 1px);position:absolute;z-index:var(--rs-z-index-raised)}.selector{--rs-tab-selection-x:0;--rs-tab-selection-y:0;--rs-tab-selection-scale-x:0;--rs-tab-selection-scale-y:0;transform:translate(calc(var(--rs-tab-selection-x) * 1px),calc(var(--rs-tab-selection-y) * 1px)) translateZ(0);transform-origin:0 0}.--selector-hidden{visibility:hidden}.--selector-animated{transition:var(--rs-duration-medium) var(--rs-easing-decelerate);transition-property:transform,height}.next,.prev{align-items:center;display:flex;inset-block:0;position:absolute;z-index:var(--rs-z-index-raised)}[dir=rtl] .next,[dir=rtl] .prev{transform:scaleX(-1)}.next{inset-inline-end:var(--rs-unit-x1)}.prev{inset-inline-start:var(--rs-unit-x1)}.panel{outline:none}[data-rs-keyboard] .panel:focus{box-shadow:var(--rs-focus-shadow)}.--panel-hidden{display:none}.--direction-row{margin:0 calc(var(--rs-unit-x2) * -1);overflow:hidden;padding:0 var(--rs-unit-x2)}.--direction-row .inner{margin:0 calc(var(--rs-unit-x2) * -1) -40px;overflow:auto;padding:0 var(--rs-unit-x2) 40px;white-space:nowrap;-ms-overflow-style:none;overflow:-moz-scrollbars-none;scrollbar-width:none}.--direction-row .inner::-webkit-scrollbar{display:none}.--direction-row .inner:after{height:1px;inset-inline:var(--rs-unit-x2);bottom:0}.--direction-row .list{align-items:center;display:inline-flex;flex-wrap:nowrap;vertical-align:top}.--direction-row .listItem+.listItem{margin-inline-start:var(--rs-tabs-gap)}.--direction-row .--item-active:after{height:2px;inset-inline:0;bottom:0}.--direction-row .selector{bottom:0;height:2px;left:0;width:calc(var(--rs-tab-selection-scale-x) * 1px)}.--direction-row .button{box-sizing:initial;margin:var(--rs-unit-x1) calc(var(--rs-unit-x2) * -1);padding:0 var(--rs-unit-x2)}.--direction-row .buttonContent{justify-content:center;padding:var(--rs-tabs-item-p-v) 0}.--direction-column .inner:after{bottom:0;height:100%;inset-inline-end:0;top:0;width:1px}.--direction-column .list{display:flex;flex-direction:column}.--direction-column .listItem{--rs-tabs-gap:var(--rs-unit-x1)}.--direction-column .item{padding-inline-end:var(--rs-unit-x1)}.--direction-column .listItem+.listItem{margin-top:var(--rs-tabs-gap)}.--direction-column .--item-active:after{bottom:0}.--direction-column .--item-active:after,.--direction-column .selector{height:100%;inset-inline-end:0;width:2px}.--direction-column .selector{height:calc(var(--rs-tab-selection-scale-y) * 1px);top:0}.--direction-column .button{margin-inline-start:calc(var(--rs-unit-x2) * -1);padding:var(--rs-unit-x2);width:calc(100% + var(--rs-unit-x1))}.--direction-column .buttonContent{justify-content:flex-start}.--variant-borderless .inner:after,.--variant-pills .inner:after,.--variant-pills-elevated .inner:after{content:none}.--variant-pills .button,.--variant-pills-elevated .button{margin:0;padding:0}.--variant-pills .buttonContent,.--variant-pills-elevated .buttonContent{margin:0;padding:var(--rs-tabs-item-p-v) var(--rs-tabs-item-p-h)}.--variant-pills .buttonContent:hover,.--variant-pills-elevated .buttonContent:hover{background:none}.--variant-pills .listItem,.--variant-pills-elevated .listItem{--rs-tabs-gap:var(--rs-unit-x1)}.--variant-pills .selector,.--variant-pills-elevated .selector{background-color:var(--rs-color-background-neutral);height:calc(var(--rs-tab-selection-scale-y) * 1px);opacity:.6;width:calc(var(--rs-tab-selection-scale-x) * 1px);z-index:0}.--direction-column.--variant-pills .selector,.--direction-column.--variant-pills-elevated .selector{left:0}.--direction-row.--variant-pills .selector,.--direction-row.--variant-pills-elevated .selector{top:0}.--variant-pills .--item-active:after,.--variant-pills-elevated .--item-active:after{background-color:var(--rs-color-background-neutral);opacity:.6;z-index:0}.--direction-column.--variant-pills .--item-active:after,.--direction-column.--variant-pills-elevated .--item-active:after{width:100%}.--direction-row.--variant-pills .--item-active:after,.--direction-row.--variant-pills-elevated .--item-active:after{height:100%}.--variant-pills-elevated .list{background:var(--rs-color-background-neutral-faded);border:2px solid transparent;border-radius:var(--rs-unit-radius-medium)}.--variant-pills-elevated .--item-active:after,.--variant-pills-elevated .selector{background:var(--rs-color-background-elevation-raised);box-shadow:var(--rs-shadow-raised);box-sizing:border-box;opacity:1}.--size-medium{--rs-tabs-item-p-v:var(--rs-unit-x2);--rs-tabs-item-p-h:var(--rs-unit-x3)}.--size-large{--rs-tabs-item-p-v:var(--rs-unit-x3);--rs-tabs-item-p-h:var(--rs-unit-x4)}.--item-width-equal{max-width:none}.--item-width-equal .inner{flex-wrap:wrap;overflow:hidden}.--item-width-equal .list{display:flex}.--item-width-equal .listItem{flex-basis:0;flex-grow:1;margin:0}.--cut-off-end .inner,[dir=rtl] .--cut-off-start .inner{mask-image:linear-gradient(to right,rgba(var(--rs-color-rgb-black),100%) 0,rgba(var(--rs-color-rgb-black),100%) 80%,rgba(var(--rs-color-rgb-black),10%) 95%,rgba(var(--rs-color-rgb-black),0) 100%)}.--cut-off-start .inner,[dir=rtl] .--cut-off-end .inner{mask-image:linear-gradient(to left,rgba(var(--rs-color-rgb-black),100%) 0,rgba(var(--rs-color-rgb-black),100%) 80%,rgba(var(--rs-color-rgb-black),10%) 95%,rgba(var(--rs-color-rgb-black),0) 100%)}.--cut-off-both .inner{mask-image:linear-gradient(to right,rgba(var(--rs-color-rgb-black),0) 0,rgba(var(--rs-color-rgb-black),10%) 5%,rgba(var(--rs-color-rgb-black),100%) 20%,rgba(var(--rs-color-rgb-black),100%) 80%,rgba(var(--rs-color-rgb-black),10%) 95%,rgba(var(--rs-color-rgb-black),0) 100%)}@media (--rs-viewport-s ){.next,.prev{display:none}}
|
|
1
|
+
.root{box-sizing:initial;max-width:100%}.list,.root{position:relative}.inner:after{background-color:var(--rs-color-border-neutral-faded);content:"";position:absolute;z-index:2}.listItem{--rs-tabs-gap:var(--rs-unit-x4);flex-shrink:0;position:relative}.button{overflow:hidden;position:relative;z-index:1;-webkit-tap-highlight-color:transparent}.button,.buttonContent{border-radius:var(--rs-unit-radius-medium);width:100%}.buttonContent{align-items:center;box-sizing:border-box;display:flex}.buttonContent:hover{color:var(--rs-color-foreground-neutral-faded)}.icon{color:inherit;transition:color var(--rs-duration-fast) var(--rs-easing-standard)}[data-rs-keyboard] .radio:focus+.buttonContent{box-shadow:var(--rs-focus-inset-shadow)}.icon:not(:last-child){margin-inline-end:var(--rs-unit-x2)}.--item-active:after{content:""}.--item-active:after,.selector{background:var(--rs-color-border-primary);border-radius:calc(var(--rs-unit-radius-medium) - 1px);position:absolute;z-index:var(--rs-z-index-raised)}.selector{--rs-tab-selection-x:0;--rs-tab-selection-y:0;--rs-tab-selection-scale-x:0;--rs-tab-selection-scale-y:0;transform:translate(calc(var(--rs-tab-selection-x) * 1px),calc(var(--rs-tab-selection-y) * 1px)) translateZ(0);transform-origin:0 0}.--selector-hidden{visibility:hidden}.--selector-animated{transition:var(--rs-duration-medium) var(--rs-easing-decelerate);transition-property:transform,height,width;will-change:transform,height,width}.next,.prev{align-items:center;display:flex;inset-block:0;position:absolute;z-index:var(--rs-z-index-raised)}[dir=rtl] .next,[dir=rtl] .prev{transform:scaleX(-1)}.next{inset-inline-end:var(--rs-unit-x1)}.prev{inset-inline-start:var(--rs-unit-x1)}.panel{outline:none}[data-rs-keyboard] .panel:focus{box-shadow:var(--rs-focus-shadow)}.--panel-hidden{display:none}.--direction-row{margin:0 calc(var(--rs-unit-x2) * -1);overflow:hidden;padding:0 var(--rs-unit-x2)}.--direction-row .inner{margin:0 calc(var(--rs-unit-x2) * -1) -40px;overflow:auto;padding:0 var(--rs-unit-x2) 40px;white-space:nowrap;-ms-overflow-style:none;overflow:-moz-scrollbars-none;scrollbar-width:none}.--direction-row .inner::-webkit-scrollbar{display:none}.--direction-row .inner:after{height:1px;inset-inline:var(--rs-unit-x2);bottom:0}.--direction-row .list{align-items:center;display:inline-flex;flex-wrap:nowrap;vertical-align:top}.--direction-row .listItem+.listItem{margin-inline-start:var(--rs-tabs-gap)}.--direction-row .--item-active:after{height:2px;inset-inline:0;bottom:0}.--direction-row .selector{bottom:0;height:2px;left:0;width:calc(var(--rs-tab-selection-scale-x) * 1px)}.--direction-row .button{box-sizing:initial;margin:var(--rs-unit-x1) calc(var(--rs-unit-x2) * -1);padding:0 var(--rs-unit-x2)}.--direction-row .buttonContent{justify-content:center;padding:var(--rs-tabs-item-p-v) 0}.--direction-column .inner:after{bottom:0;height:100%;inset-inline-end:0;top:0;width:1px}.--direction-column .list{display:flex;flex-direction:column}.--direction-column .listItem{--rs-tabs-gap:var(--rs-unit-x1)}.--direction-column .item{padding-inline-end:var(--rs-unit-x1)}.--direction-column .listItem+.listItem{margin-top:var(--rs-tabs-gap)}.--direction-column .--item-active:after{bottom:0}.--direction-column .--item-active:after,.--direction-column .selector{height:100%;inset-inline-end:0;width:2px}.--direction-column .selector{height:calc(var(--rs-tab-selection-scale-y) * 1px);top:0}.--direction-column .button{margin-inline-start:calc(var(--rs-unit-x2) * -1);padding:var(--rs-unit-x2);width:calc(100% + var(--rs-unit-x1))}.--direction-column .buttonContent{justify-content:flex-start}.--variant-borderless .inner:after,.--variant-pills .inner:after,.--variant-pills-elevated .inner:after{content:none}.--variant-pills .button,.--variant-pills-elevated .button{margin:0;padding:0}.--variant-pills .buttonContent,.--variant-pills-elevated .buttonContent{margin:0;padding:var(--rs-tabs-item-p-v) var(--rs-tabs-item-p-h)}.--variant-pills .buttonContent:hover,.--variant-pills-elevated .buttonContent:hover{background:none}.--variant-pills .listItem,.--variant-pills-elevated .listItem{--rs-tabs-gap:var(--rs-unit-x1)}.--variant-pills .selector,.--variant-pills-elevated .selector{background-color:var(--rs-color-background-neutral);height:calc(var(--rs-tab-selection-scale-y) * 1px);opacity:.6;width:calc(var(--rs-tab-selection-scale-x) * 1px);z-index:0}.--direction-column.--variant-pills .selector,.--direction-column.--variant-pills-elevated .selector{left:0}.--direction-row.--variant-pills .selector,.--direction-row.--variant-pills-elevated .selector{top:0}.--variant-pills .--item-active:after,.--variant-pills-elevated .--item-active:after{background-color:var(--rs-color-background-neutral);opacity:.6;z-index:0}.--direction-column.--variant-pills .--item-active:after,.--direction-column.--variant-pills-elevated .--item-active:after{width:100%}.--direction-row.--variant-pills .--item-active:after,.--direction-row.--variant-pills-elevated .--item-active:after{height:100%}.--variant-pills-elevated .list{background:var(--rs-color-background-neutral-faded);border:2px solid transparent;border-radius:var(--rs-unit-radius-medium)}.--variant-pills-elevated .--item-active:after,.--variant-pills-elevated .selector{background:var(--rs-color-background-elevation-raised);box-shadow:var(--rs-shadow-raised);box-sizing:border-box;opacity:1}.--size-medium{--rs-tabs-item-p-v:var(--rs-unit-x2);--rs-tabs-item-p-h:var(--rs-unit-x3)}.--size-large{--rs-tabs-item-p-v:var(--rs-unit-x3);--rs-tabs-item-p-h:var(--rs-unit-x4)}.--item-width-equal{max-width:none}.--item-width-equal .inner{flex-wrap:wrap;overflow:hidden}.--item-width-equal .list{display:flex}.--item-width-equal .listItem{flex-basis:0;flex-grow:1;margin:0}.--cut-off-end .inner,[dir=rtl] .--cut-off-start .inner{mask-image:linear-gradient(to right,rgba(var(--rs-color-rgb-black),100%) 0,rgba(var(--rs-color-rgb-black),100%) 80%,rgba(var(--rs-color-rgb-black),10%) 95%,rgba(var(--rs-color-rgb-black),0) 100%)}.--cut-off-start .inner,[dir=rtl] .--cut-off-end .inner{mask-image:linear-gradient(to left,rgba(var(--rs-color-rgb-black),100%) 0,rgba(var(--rs-color-rgb-black),100%) 80%,rgba(var(--rs-color-rgb-black),10%) 95%,rgba(var(--rs-color-rgb-black),0) 100%)}.--cut-off-both .inner{mask-image:linear-gradient(to right,rgba(var(--rs-color-rgb-black),0) 0,rgba(var(--rs-color-rgb-black),10%) 5%,rgba(var(--rs-color-rgb-black),100%) 20%,rgba(var(--rs-color-rgb-black),100%) 80%,rgba(var(--rs-color-rgb-black),10%) 95%,rgba(var(--rs-color-rgb-black),0) 100%)}@media (--rs-viewport-s ){.next,.prev{display:none}}
|
|
@@ -15,8 +15,8 @@ export const variant = () => (<Example>
|
|
|
15
15
|
<Example.Item title="variant: default">
|
|
16
16
|
<Tabs>
|
|
17
17
|
<Tabs.List>
|
|
18
|
-
<Tabs.Item value="0">Item 1</Tabs.Item>
|
|
19
18
|
<Tabs.Item value="1">Long item 2</Tabs.Item>
|
|
19
|
+
<Tabs.Item value="0">Item 1</Tabs.Item>
|
|
20
20
|
<Tabs.Item value="2">Very long item 3</Tabs.Item>
|
|
21
21
|
</Tabs.List>
|
|
22
22
|
</Tabs>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.root{--rs-p-v:var(--rs-unit-x1);--rs-p-h:var(--rs-text-field-gap);background:var(--rs-color-background-elevation-base);border:1px solid var(--rs-color-border-neutral);display:flex;
|
|
1
|
+
.root{--rs-p-v:var(--rs-unit-x1);--rs-p-h:var(--rs-text-field-gap);background:var(--rs-color-background-elevation-base);border:1px solid var(--rs-color-border-neutral);display:flex;padding:calc(var(--rs-p-v) - 1px) 0;position:relative;z-index:0}.root:focus-within:not(:has(button:focus,a:focus)){border-color:var(--rs-color-border-primary);box-shadow:0 0 0 1px var(--rs-color-border-primary)}.input{background:none;border:none;box-sizing:border-box;color:var(--rs-color-foreground-neutral);flex-grow:1;font-family:var(--rs-font-family-body);font-weight:var(--rs-font-weight-regular);margin:calc(var(--rs-unit-x1) * -1) 0;outline:none;padding:0 var(--rs-text-field-gap);position:relative;width:100%;z-index:1}.input:-webkit-autofill{-webkit-background-clip:text;-webkit-text-fill-color:var(--rs-color-foreground-neutral)}.affix,.icon,.slot{align-items:center;display:flex;flex-shrink:0;position:relative;z-index:5}.icon{pointer-events:none}.affix{color:var(--rs-color-foreground-neutral-faded)}.attachment{align-items:center;display:flex;flex-shrink:0}.attachment--position-start{gap:var(--rs-text-field-gap);padding-inline-start:var(--rs-text-field-gap)}.attachment--position-start .affix{border-inline-end:1px solid var(--rs-color-border-neutral-faded);padding-inline-end:var(--rs-text-field-gap)}.attachment--position-end{gap:var(--rs-unit-x1);padding-inline-end:var(--rs-unit-x1)}.attachment--position-end .affix,.attachment--position-end .icon{padding-inline-end:calc(var(--rs-text-field-gap) - var(--rs-unit-x1))}.attachment--position-end .affix{border-inline-start:1px solid var(--rs-color-border-neutral-faded);padding-inline-start:var(--rs-text-field-gap)}.root.--disabled{background:var(--rs-color-background-disabled-faded);border-color:var(--rs-color-border-disabled)}.root.--disabled,.root.--disabled .input{color:var(--rs-color-foreground-disabled);cursor:not-allowed}.--size-medium{--rs-text-field-gap:var(--rs-unit-x2);border-radius:var(--rs-unit-radius-small)}.--size-medium .input{padding-bottom:var(--rs-unit-x2);padding-top:var(--rs-unit-x2)}.--size-medium .affix,.--size-medium .input{font-size:var(--rs-font-size-body-3);line-height:var(--rs-line-height-body-3)}.--size-large{--rs-text-field-gap:var(--rs-unit-x3);border-radius:var(--rs-unit-radius-medium)}.--size-large .input{padding-bottom:var(--rs-unit-x3);padding-top:var(--rs-unit-x3)}.--size-large .affix,.--size-large .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge{--rs-text-field-gap:var(--rs-unit-x4);border-radius:var(--rs-unit-radius-medium)}.--size-xlarge .input{padding-bottom:var(--rs-unit-x4);padding-top:var(--rs-unit-x4)}.--size-xlarge .affix,.--size-xlarge .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.root.--variant-faded{background:var(--rs-color-background-neutral-faded);border-color:transparent}.root.--variant-faded:focus-within{border-color:var(--rs-color-border-primary)}.root.--variant-headless{background:transparent;border-color:transparent}.root.--variant-headless.--status-error,.root.--variant-headless.--status-error:focus-within,.root.--variant-headless:focus-within{border-color:transparent;box-shadow:none}.root.--status-error{border-color:var(--rs-color-border-critical)}.root.--status-error:focus-within{border-color:var(--rs-color-border-primary)}@media (--rs-viewport-s ) and (hover:none){.input{font-size:var(--rs-font-size-body-2)!important}}@media (--rs-viewport-m ){.--size-medium--m{--rs-text-field-gap:var(--rs-unit-x2);border-radius:var(--rs-unit-radius-small)}.--size-medium--m .input{padding-bottom:var(--rs-unit-x2);padding-top:var(--rs-unit-x2)}.--size-medium--m .affix,.--size-medium--m .input{font-size:var(--rs-font-size-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--m{--rs-text-field-gap:var(--rs-unit-x3);border-radius:var(--rs-unit-radius-medium)}.--size-large--m .input{padding-bottom:var(--rs-unit-x3);padding-top:var(--rs-unit-x3)}.--size-large--m .affix,.--size-large--m .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--m{--rs-text-field-gap:var(--rs-unit-x4);border-radius:var(--rs-unit-radius-medium)}.--size-xlarge--m .input{padding-bottom:var(--rs-unit-x4);padding-top:var(--rs-unit-x4)}.--size-xlarge--m .affix,.--size-xlarge--m .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}}@media (--rs-viewport-l ){.--size-medium--l{--rs-text-field-gap:var(--rs-unit-x2);border-radius:var(--rs-unit-radius-small)}.--size-medium--l .input{padding-bottom:var(--rs-unit-x2);padding-top:var(--rs-unit-x2)}.--size-medium--l .affix,.--size-medium--l .input{font-size:var(--rs-font-size-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--l{--rs-text-field-gap:var(--rs-unit-x3);border-radius:var(--rs-unit-radius-medium)}.--size-large--l .input{padding-bottom:var(--rs-unit-x3);padding-top:var(--rs-unit-x3)}.--size-large--l .affix,.--size-large--l .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--l{--rs-text-field-gap:var(--rs-unit-x4);border-radius:var(--rs-unit-radius-medium)}.--size-xlarge--l .input{padding-bottom:var(--rs-unit-x4);padding-top:var(--rs-unit-x4)}.--size-xlarge--l .affix,.--size-xlarge--l .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}}@media (--rs-viewport-xl ){.--size-medium--xl{--rs-text-field-gap:var(--rs-unit-x2);border-radius:var(--rs-unit-radius-small)}.--size-medium--xl .input{padding-bottom:var(--rs-unit-x2);padding-top:var(--rs-unit-x2)}.--size-medium--xl .affix,.--size-medium--xl .input{font-size:var(--rs-font-size-body-3);line-height:var(--rs-line-height-body-3)}.--size-large--xl{--rs-text-field-gap:var(--rs-unit-x3);border-radius:var(--rs-unit-radius-medium)}.--size-large--xl .input{padding-bottom:var(--rs-unit-x3);padding-top:var(--rs-unit-x3)}.--size-large--xl .affix,.--size-large--xl .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}.--size-xlarge--xl{--rs-text-field-gap:var(--rs-unit-x4);border-radius:var(--rs-unit-radius-medium)}.--size-xlarge--xl .input{padding-bottom:var(--rs-unit-x4);padding-top:var(--rs-unit-x4)}.--size-xlarge--xl .affix,.--size-xlarge--xl .input{font-size:var(--rs-font-size-body-2);line-height:var(--rs-line-height-body-2)}}
|
|
@@ -92,7 +92,7 @@ export const slots = () => (<Example>
|
|
|
92
92
|
<TextField name="Name" placeholder="Enter your name" value="Reshaped" startSlot={<Placeholder h={24}/>}/>
|
|
93
93
|
</Example.Item>
|
|
94
94
|
<Example.Item title={["endSlot", "vertical and horizontal padding aligned"]}>
|
|
95
|
-
<TextField name="Name" placeholder="Enter your name" value="Reshaped" endSlot={<
|
|
95
|
+
<TextField name="Name" placeholder="Enter your name" value="Reshaped" endSlot={<Button icon={IconZap} size="small" onClick={() => { }}/>}/>
|
|
96
96
|
</Example.Item>
|
|
97
97
|
</Example>);
|
|
98
98
|
export const formControl = () => (<Example>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.root{--rs-view-gaps-count-multiplier:1;--rs-view-z:auto;--rs-view-gap-value:calc(var(--rs-view-gap) * var(--rs-unit-x1));gap:var(--rs-view-gap-value);z-index:var(--rs-view-z)}.item{--rs-view-item-gap:calc(var(--rs-unit-x1) * var(--rs-view-item-gap-before) - var(--rs-view-gap-value));order:var(--rs-view-item-order)}.--padding{padding:calc(var(--rs-unit-x1) * var(--rs-view-p-vertical, var(--rs-view-p-top))) calc(var(--rs-unit-x1) * var(--rs-view-p-horizontal, var(--rs-view-p-start)))}.--padding-top{padding-top:calc(var(--rs-unit-x1) * var(--rs-view-p-top))}.--padding-bottom{padding-bottom:calc(var(--rs-unit-x1) * var(--rs-view-p-bottom))}.--padding-start{padding-inline-start:calc(var(--rs-unit-x1) * var(--rs-view-p-start))}.--padding-end{padding-inline-end:calc(var(--rs-unit-x1) * var(--rs-view-p-end))}.--animated{transition:var(--rs-duration-medium) var(--rs-easing-standard);transition-property:background-color,color,border-color,box-shadow}.--align-text-start{text-align:start}.--align-text-center{text-align:center}.--align-text-end{text-align:end}.--bg-neutral{background-color:var(--rs-color-background-neutral);color:var(--rs-color-on-background-neutral)}.--bg-positive{background-color:var(--rs-color-background-positive);color:var(--rs-color-on-background-positive)}.--bg-warning{background-color:var(--rs-color-background-warning);color:var(--rs-color-on-background-warning)}.--bg-critical{background-color:var(--rs-color-background-critical);color:var(--rs-color-on-background-critical)}.--bg-primary{background-color:var(--rs-color-background-primary);color:var(--rs-color-on-background-primary)}.--bg-neutral-faded{background-color:var(--rs-color-background-neutral-faded);color:var(--rs-color-foreground-neutral)}.--bg-positive-faded{background-color:var(--rs-color-background-positive-faded);color:var(--rs-color-foreground-neutral)}.--bg-warning-faded{background-color:var(--rs-color-background-warning-faded);color:var(--rs-color-foreground-neutral)}.--bg-critical-faded{background-color:var(--rs-color-background-critical-faded);color:var(--rs-color-foreground-neutral)}.--bg-primary-faded{background-color:var(--rs-color-background-primary-faded)}.--bg-page,.--bg-primary-faded{color:var(--rs-color-foreground-neutral)}.--bg-page{background-color:var(--rs-color-background-page)}.--bg-page-faded{background-color:var(--rs-color-background-page-faded)}.--bg-disabled,.--bg-page-faded{color:var(--rs-color-foreground-neutral)}.--bg-disabled{background-color:var(--rs-color-background-disabled)}.--bg-disabled-faded{background-color:var(--rs-color-background-disabled-faded);color:var(--rs-color-foreground-neutral)}.--bg-elevation-base{background-color:var(--rs-color-background-elevation-base);color:var(--rs-color-foreground-neutral)}.--bg-elevation-raised{background-color:var(--rs-color-background-elevation-raised);color:var(--rs-color-foreground-neutral)}.--bg-elevation-overlay{background-color:var(--rs-color-background-elevation-overlay);color:var(--rs-color-foreground-neutral)}.--bg-brand{background-color:var(--rs-color-brand);color:var(--rs-color-on-brand)}.--bg-white{background-color:var(--rs-color-white);color:var(--rs-color-black)}.--bg-black{background-color:var(--rs-color-black);color:var(--rs-color-white)}.--shadow-raised{box-shadow:var(--rs-shadow-raised)}.--shadow-overlay{box-shadow:var(--rs-shadow-overlay)}.--bd{border:1px solid var(--rs-view-border-color)}.--bd-neutral-faded{--rs-view-border-color:var(--rs-color-border-neutral-faded)}.--bd-neutral{--rs-view-border-color:var(--rs-color-border-neutral)}.--bd-positive{--rs-view-border-color:var(--rs-color-border-positive)}.--bd-positive-faded{--rs-view-border-color:var(--rs-color-border-positive-faded)}.--bd-warning{--rs-view-border-color:var(--rs-color-border-warning)}.--bd-warning-faded{--rs-view-border-color:var(--rs-color-border-warning-faded)}.--bd-critical{--rs-view-border-color:var(--rs-color-border-critical)}.--bd-critical-faded{--rs-view-border-color:var(--rs-color-border-critical-faded)}.--bd-primary{--rs-view-border-color:var(--rs-color-border-primary)}.--bd-primary-faded{--rs-view-border-color:var(--rs-color-border-primary-faded)}.--bd-disabled{--rs-view-border-color:var(--rs-color-border-disabled)}.--bd-brand{--rs-view-border-color:var(--rs-color-brand)}.--bd-transparent{--rs-view-border-color:transparent}.--overflow-hidden{overflow:hidden}.--overflow-auto{overflow:auto}.--divided{--rs-view-gaps-count-multiplier:2}.--flex{display:flex;flex-direction:column;justify-content:flex-start}.--direction-column{flex-direction:column;flex-wrap:nowrap}.--direction-column>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column>.item--gap-auto{margin-top:auto}.--direction-column-reverse{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse>.item--gap-auto{margin-top:auto}.--direction-row{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row>.item--gap-auto{margin-inline-start:auto}.--direction-row>button{width:auto!important}.--direction-row-reverse{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse>button{width:auto!important}.--nowrap{flex-wrap:nowrap}.--nowrap>*{flex-shrink:0}.--wrap{flex-wrap:wrap}@media (--rs-viewport-m ){.--nowrap-false--m,.--wrap-true--m{flex-wrap:wrap}.--nowrap-true--m,.--wrap-false--m{flex-wrap:nowrap}}@media (--rs-viewport-l ){.--nowrap-false--l,.--wrap-true--l{flex-wrap:wrap}.--nowrap-true--l,.--wrap-false--l{flex-wrap:nowrap}}@media (--rs-viewport-xl ){.--nowrap-false--xl,.--wrap-true--xl{flex-wrap:wrap}.--nowrap-true--xl,.--wrap-false--xl{flex-wrap:nowrap}}.--align-start{align-items:flex-start!important}.--align-end{align-items:flex-end!important}.--align-center{align-items:center!important}.--align-stretch{align-items:stretch!important}.--align-baseline{align-items:baseline!important}.--justify-start{justify-content:flex-start}.--justify-end{justify-content:flex-end}.--justify-center{justify-content:center}.--justify-space-between{justify-content:space-between}.divider{align-self:stretch}.item--grow{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--columns{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-1{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-1,.item--columns-2{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-2{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3,.item--columns-4{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-4{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5,.item--columns-6{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-6{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7,.item--columns-8{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-8{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10,.item--columns-9{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-10{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11,.item--columns-12{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-12{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto{width:auto}@media (--rs-viewport-m ){.item--columns-1--m{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-2--m{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--m{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-4--m{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--m{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-6--m{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--m{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-8--m{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9--m{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10--m{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--m{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-12--m{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto--m{width:auto}}@media (--rs-viewport-l ){.item--columns-1--l{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-2--l{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--l{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-4--l{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--l{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-6--l{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--l{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-8--l{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9--l{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10--l{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--l{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-12--l{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto--l{width:auto}}@media (--rs-viewport-xl ){.item--columns-1--xl{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-2--xl{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--xl{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-4--xl{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--xl{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-6--xl{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--xl{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-8--xl{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9--xl{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10--xl{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--xl{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-12--xl{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto--xl{width:auto}}.--padding{--rs-view-p-vertical-s:0;--rs-view-p-vertical-m:var(--rs-view-p-vertical-s);--rs-view-p-vertical-l:var(--rs-view-p-vertical-m);--rs-view-p-vertical-xl:var(--rs-view-p-vertical-l);--rs-view-p-vertical:var(--rs-view-p-vertical-s);--rs-view-p-horizontal-s:0;--rs-view-p-horizontal-m:var(--rs-view-p-horizontal-s);--rs-view-p-horizontal-l:var(--rs-view-p-horizontal-m);--rs-view-p-horizontal-xl:var(--rs-view-p-horizontal-l);--rs-view-p-horizontal:var(--rs-view-p-horizontal-s)}.--padding-top{--rs-view-p-top-s:0;--rs-view-p-top-m:var(--rs-view-p-top-s);--rs-view-p-top-l:var(--rs-view-p-top-m);--rs-view-p-top-xl:var(--rs-view-p-top-l);--rs-view-p-top:var(--rs-view-p-top-s)}.--padding-bottom{--rs-view-p-bottom-s:0;--rs-view-p-bottom-m:var(--rs-view-p-bottom-s);--rs-view-p-bottom-l:var(--rs-view-p-bottom-m);--rs-view-p-bottom-xl:var(--rs-view-p-bottom-l);--rs-view-p-bottom:var(--rs-view-p-bottom-s)}.--padding-start{--rs-view-p-start-s:0;--rs-view-p-start-m:var(--rs-view-p-start-s);--rs-view-p-start-l:var(--rs-view-p-start-m);--rs-view-p-start-xl:var(--rs-view-p-start-l);--rs-view-p-start:var(--rs-view-p-start-s)}.--padding-end{--rs-view-p-end-s:0;--rs-view-p-end-m:var(--rs-view-p-end-s);--rs-view-p-end-l:var(--rs-view-p-end-m);--rs-view-p-end-xl:var(--rs-view-p-end-l);--rs-view-p-end:var(--rs-view-p-end-s)}.root{--rs-view-gap-s:0;--rs-view-gap-m:var(--rs-view-gap-s);--rs-view-gap-l:var(--rs-view-gap-m);--rs-view-gap-xl:var(--rs-view-gap-l);--rs-view-gap:var(--rs-view-gap-s)}.root>.item{--rs-view-item-order-s:0;--rs-view-item-order-m:var(--rs-view-item-order-s);--rs-view-item-order-l:var(--rs-view-item-order-m);--rs-view-item-order-xl:var(--rs-view-item-order-l);--rs-view-item-order:var(--rs-view-item-order-s);--rs-view-item-gap-before-s:initial;--rs-view-item-gap-before-m:var(--rs-view-item-gap-before-s);--rs-view-item-gap-before-l:var(--rs-view-item-gap-before-m);--rs-view-item-gap-before-xl:var(--rs-view-item-gap-before-l);--rs-view-item-gap-before:var(--rs-view-item-gap-before-s)}@media (--rs-viewport-m ){.--direction-column--m{flex-direction:column;flex-wrap:nowrap}.--direction-column--m>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column--m>.item--gap-auto{margin-top:auto}.--direction-column-reverse--m{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse--m>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse--m>.item--gap-auto{margin-top:auto}.--direction-row--m{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row--m>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row--m>.item--gap-auto{margin-inline-start:auto}.--direction-row--m>button{width:auto!important}.--direction-row-reverse--m{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse--m>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse--m>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse--m>button{width:auto!important}.--align-start--m{align-items:flex-start!important}.--align-end--m{align-items:flex-end!important}.--align-center--m{align-items:center!important}.--align-stretch--m{align-items:stretch!important}.--align-baseline--m{align-items:baseline!important}.--justify-start--m{justify-content:flex-start}.--justify-end--m{justify-content:flex-end}.--justify-center--m{justify-content:center}.--justify-space-between--m{justify-content:space-between}.item--grow-true--m{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--grow-false--m{flex-basis:auto;flex-grow:0;flex-shrink:0;min-width:auto}.--padding{--rs-view-p-vertical:var(--rs-view-p-vertical-m);--rs-view-p-horizontal:var(--rs-view-p-horizontal-m)}.--padding-top{--rs-view-p-top:var(--rs-view-p-top-m)}.--padding-bottom{--rs-view-p-bottom:var(--rs-view-p-bottom-m)}.--padding-start{--rs-view-p-start:var(--rs-view-p-start-m)}.--padding-end{--rs-view-p-end:var(--rs-view-p-end-m)}.root{--rs-view-gap:var(--rs-view-gap-m)}.root>.item{--rs-view-item-order:var(--rs-view-item-order-m);--rs-view-item-gap-before:var(--rs-view-item-gap-before-m)}}@media (--rs-viewport-l ){.--direction-column--l{flex-direction:column;flex-wrap:nowrap}.--direction-column--l>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column--l>.item--gap-auto{margin-top:auto}.--direction-column-reverse--l{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse--l>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse--l>.item--gap-auto{margin-top:auto}.--direction-row--l{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row--l>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row--l>.item--gap-auto{margin-inline-start:auto}.--direction-row--l>button{width:auto!important}.--direction-row-reverse--l{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse--l>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse--l>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse--l>button{width:auto!important}.--align-start--l{align-items:flex-start!important}.--align-end--l{align-items:flex-end!important}.--align-center--l{align-items:center!important}.--align-stretch--l{align-items:stretch!important}.--align-baseline--l{align-items:baseline!important}.--justify-start--l{justify-content:flex-start}.--justify-end--l{justify-content:flex-end}.--justify-center--l{justify-content:center}.--justify-space-between--l{justify-content:space-between}.item--grow-true--l{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--grow-false--l{flex-basis:auto;flex-grow:0;flex-shrink:0;min-width:auto}.--padding{--rs-view-p-vertical:var(--rs-view-p-vertical-l);--rs-view-p-horizontal:var(--rs-view-p-horizontal-l)}.--padding-top{--rs-view-p-top:var(--rs-view-p-top-l)}.--padding-bottom{--rs-view-p-bottom:var(--rs-view-p-bottom-l)}.--padding-start{--rs-view-p-start:var(--rs-view-p-start-l)}.--padding-end{--rs-view-p-end:var(--rs-view-p-end-l)}.root{--rs-view-gap:var(--rs-view-gap-l)}.root>.item{--rs-view-item-order:var(--rs-view-item-order-l);--rs-view-item-gap-before:var(--rs-view-item-gap-before-l)}}@media (--rs-viewport-xl ){.--direction-column--xl{flex-direction:column;flex-wrap:nowrap}.--direction-column--xl>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column--xl>.item--gap-auto{margin-top:auto}.--direction-column-reverse--xl{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse--xl>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse--xl>.item--gap-auto{margin-top:auto}.--direction-row--xl{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row--xl>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row--xl>.item--gap-auto{margin-inline-start:auto}.--direction-row--xl>button{width:auto!important}.--direction-row-reverse--xl{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse--xl>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse--xl>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse--xl>button{width:auto!important}.--align-start--xl{align-items:flex-start!important}.--align-end--xl{align-items:flex-end!important}.--align-center--xl{align-items:center!important}.--align-stretch--xl{align-items:stretch!important}.--align-baseline--xl{align-items:baseline!important}.--justify-start--xl{justify-content:flex-start}.--justify-end--xl{justify-content:flex-end}.--justify-center--xl{justify-content:center}.--justify-space-between--xl{justify-content:space-between}.item--grow-true--xl{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--grow-false--xl{flex-basis:auto;flex-grow:0;flex-shrink:0;min-width:auto}.--padding{--rs-view-p-vertical:var(--rs-view-p-vertical-xl);--rs-view-p-horizontal:var(--rs-view-p-horizontal-xl)}.--padding-top{--rs-view-p-top:var(--rs-view-p-top-xl)}.--padding-bottom{--rs-view-p-bottom:var(--rs-view-p-bottom-xl)}.--padding-start{--rs-view-p-start:var(--rs-view-p-start-xl)}.--padding-end{--rs-view-p-end:var(--rs-view-p-end-xl)}.root{--rs-view-gap:var(--rs-view-gap-xl)}.root>.item{--rs-view-item-order:var(--rs-view-item-order-xl);--rs-view-item-gap-before:var(--rs-view-item-gap-before-xl)}}
|
|
1
|
+
.root{--rs-view-gaps-count-multiplier:1;--rs-view-z:auto;--rs-view-gap-value:calc(var(--rs-view-gap) * var(--rs-unit-x1));--rs-view-border-width:0px;gap:var(--rs-view-gap-value);z-index:var(--rs-view-z)}.item{--rs-view-item-gap:calc(var(--rs-unit-x1) * var(--rs-view-item-gap-before) - var(--rs-view-gap-value));order:var(--rs-view-item-order)}.--padding{padding:calc(var(--rs-unit-x1) * var(--rs-view-p-vertical, var(--rs-view-p-top)) - var(--rs-view-border-width)) calc(var(--rs-unit-x1) * var(--rs-view-p-horizontal, var(--rs-view-p-start)) - var(--rs-view-border-width))}.--padding-top{padding-top:calc(var(--rs-unit-x1) * var(--rs-view-p-top))}.--padding-bottom{padding-bottom:calc(var(--rs-unit-x1) * var(--rs-view-p-bottom))}.--padding-start{padding-inline-start:calc(var(--rs-unit-x1) * var(--rs-view-p-start))}.--padding-end{padding-inline-end:calc(var(--rs-unit-x1) * var(--rs-view-p-end))}.--animated{transition:var(--rs-duration-medium) var(--rs-easing-standard);transition-property:background-color,color,border-color,box-shadow}.--align-text-start{text-align:start}.--align-text-center{text-align:center}.--align-text-end{text-align:end}.--bg-neutral{background-color:var(--rs-color-background-neutral);color:var(--rs-color-on-background-neutral)}.--bg-positive{background-color:var(--rs-color-background-positive);color:var(--rs-color-on-background-positive)}.--bg-warning{background-color:var(--rs-color-background-warning);color:var(--rs-color-on-background-warning)}.--bg-critical{background-color:var(--rs-color-background-critical);color:var(--rs-color-on-background-critical)}.--bg-primary{background-color:var(--rs-color-background-primary);color:var(--rs-color-on-background-primary)}.--bg-neutral-faded{background-color:var(--rs-color-background-neutral-faded);color:var(--rs-color-foreground-neutral)}.--bg-positive-faded{background-color:var(--rs-color-background-positive-faded);color:var(--rs-color-foreground-neutral)}.--bg-warning-faded{background-color:var(--rs-color-background-warning-faded);color:var(--rs-color-foreground-neutral)}.--bg-critical-faded{background-color:var(--rs-color-background-critical-faded);color:var(--rs-color-foreground-neutral)}.--bg-primary-faded{background-color:var(--rs-color-background-primary-faded)}.--bg-page,.--bg-primary-faded{color:var(--rs-color-foreground-neutral)}.--bg-page{background-color:var(--rs-color-background-page)}.--bg-page-faded{background-color:var(--rs-color-background-page-faded)}.--bg-disabled,.--bg-page-faded{color:var(--rs-color-foreground-neutral)}.--bg-disabled{background-color:var(--rs-color-background-disabled)}.--bg-disabled-faded{background-color:var(--rs-color-background-disabled-faded);color:var(--rs-color-foreground-neutral)}.--bg-elevation-base{background-color:var(--rs-color-background-elevation-base);color:var(--rs-color-foreground-neutral)}.--bg-elevation-raised{background-color:var(--rs-color-background-elevation-raised);color:var(--rs-color-foreground-neutral)}.--bg-elevation-overlay{background-color:var(--rs-color-background-elevation-overlay);color:var(--rs-color-foreground-neutral)}.--bg-brand{background-color:var(--rs-color-brand);color:var(--rs-color-on-brand)}.--bg-white{background-color:var(--rs-color-white);color:var(--rs-color-black)}.--bg-black{background-color:var(--rs-color-black);color:var(--rs-color-white)}.--shadow-raised{box-shadow:var(--rs-shadow-raised)}.--shadow-overlay{box-shadow:var(--rs-shadow-overlay)}.--bd{--rs-view-border-width:1px;border:var(--rs-view-border-width) solid var(--rs-view-border-color)}.--bd-neutral-faded{--rs-view-border-color:var(--rs-color-border-neutral-faded)}.--bd-neutral{--rs-view-border-color:var(--rs-color-border-neutral)}.--bd-positive{--rs-view-border-color:var(--rs-color-border-positive)}.--bd-positive-faded{--rs-view-border-color:var(--rs-color-border-positive-faded)}.--bd-warning{--rs-view-border-color:var(--rs-color-border-warning)}.--bd-warning-faded{--rs-view-border-color:var(--rs-color-border-warning-faded)}.--bd-critical{--rs-view-border-color:var(--rs-color-border-critical)}.--bd-critical-faded{--rs-view-border-color:var(--rs-color-border-critical-faded)}.--bd-primary{--rs-view-border-color:var(--rs-color-border-primary)}.--bd-primary-faded{--rs-view-border-color:var(--rs-color-border-primary-faded)}.--bd-disabled{--rs-view-border-color:var(--rs-color-border-disabled)}.--bd-brand{--rs-view-border-color:var(--rs-color-brand)}.--bd-transparent{--rs-view-border-color:transparent}.--overflow-hidden{overflow:hidden}.--overflow-auto{overflow:auto}.--divided{--rs-view-gaps-count-multiplier:2}.--flex{display:flex;flex-direction:column;justify-content:flex-start}.--direction-column{flex-direction:column;flex-wrap:nowrap}.--direction-column>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column>.item--gap-auto{margin-top:auto}.--direction-column-reverse{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse>.item--gap-auto{margin-top:auto}.--direction-row{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row>.item--gap-auto{margin-inline-start:auto}.--direction-row>button{width:auto!important}.--direction-row-reverse{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse>button{width:auto!important}.--nowrap{flex-wrap:nowrap}.--nowrap>*{flex-shrink:0}.--wrap{flex-wrap:wrap}@media (--rs-viewport-m ){.--nowrap-false--m,.--wrap-true--m{flex-wrap:wrap}.--nowrap-true--m,.--wrap-false--m{flex-wrap:nowrap}}@media (--rs-viewport-l ){.--nowrap-false--l,.--wrap-true--l{flex-wrap:wrap}.--nowrap-true--l,.--wrap-false--l{flex-wrap:nowrap}}@media (--rs-viewport-xl ){.--nowrap-false--xl,.--wrap-true--xl{flex-wrap:wrap}.--nowrap-true--xl,.--wrap-false--xl{flex-wrap:nowrap}}.--align-start{align-items:flex-start!important}.--align-end{align-items:flex-end!important}.--align-center{align-items:center!important}.--align-stretch{align-items:stretch!important}.--align-baseline{align-items:baseline!important}.--justify-start{justify-content:flex-start}.--justify-end{justify-content:flex-end}.--justify-center{justify-content:center}.--justify-space-between{justify-content:space-between}.divider{align-self:stretch}.item--grow{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--columns{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-1{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-1,.item--columns-2{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-2{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3,.item--columns-4{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-4{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5,.item--columns-6{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-6{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7,.item--columns-8{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-8{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10,.item--columns-9{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-10{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11,.item--columns-12{width:calc((100% - var(--rs-view-gap-value) * var(--rs-view-gaps-count)) / var(--rs-view-columns-count) - var(--rs-view-item-gap, 0px))}.item--columns-12{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto{width:auto}@media (--rs-viewport-m ){.item--columns-1--m{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-2--m{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--m{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-4--m{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--m{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-6--m{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--m{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-8--m{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9--m{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10--m{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--m{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-12--m{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto--m{width:auto}}@media (--rs-viewport-l ){.item--columns-1--l{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-2--l{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--l{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-4--l{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--l{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-6--l{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--l{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-8--l{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9--l{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10--l{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--l{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-12--l{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto--l{width:auto}}@media (--rs-viewport-xl ){.item--columns-1--xl{--rs-view-columns-count:calc(12 / 1);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-2--xl{--rs-view-columns-count:calc(12 / 2);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-3--xl{--rs-view-columns-count:calc(12 / 3);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-4--xl{--rs-view-columns-count:calc(12 / 4);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-5--xl{--rs-view-columns-count:calc(12 / 5);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-6--xl{--rs-view-columns-count:calc(12 / 6);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-7--xl{--rs-view-columns-count:calc(12 / 7);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-8--xl{--rs-view-columns-count:calc(12 / 8);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-9--xl{--rs-view-columns-count:calc(12 / 9);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-10--xl{--rs-view-columns-count:calc(12 / 10);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-11--xl{--rs-view-columns-count:calc(12 / 11);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-12--xl{--rs-view-columns-count:calc(12 / 12);--rs-view-gaps-count:calc((var(--rs-view-columns-count) - 1) * var(--rs-view-gaps-count-multiplier))}.item--columns-auto--xl{width:auto}}.--padding{--rs-view-p-vertical-s:0;--rs-view-p-vertical-m:var(--rs-view-p-vertical-s);--rs-view-p-vertical-l:var(--rs-view-p-vertical-m);--rs-view-p-vertical-xl:var(--rs-view-p-vertical-l);--rs-view-p-vertical:var(--rs-view-p-vertical-s);--rs-view-p-horizontal-s:0;--rs-view-p-horizontal-m:var(--rs-view-p-horizontal-s);--rs-view-p-horizontal-l:var(--rs-view-p-horizontal-m);--rs-view-p-horizontal-xl:var(--rs-view-p-horizontal-l);--rs-view-p-horizontal:var(--rs-view-p-horizontal-s)}.--padding-top{--rs-view-p-top-s:0;--rs-view-p-top-m:var(--rs-view-p-top-s);--rs-view-p-top-l:var(--rs-view-p-top-m);--rs-view-p-top-xl:var(--rs-view-p-top-l);--rs-view-p-top:var(--rs-view-p-top-s)}.--padding-bottom{--rs-view-p-bottom-s:0;--rs-view-p-bottom-m:var(--rs-view-p-bottom-s);--rs-view-p-bottom-l:var(--rs-view-p-bottom-m);--rs-view-p-bottom-xl:var(--rs-view-p-bottom-l);--rs-view-p-bottom:var(--rs-view-p-bottom-s)}.--padding-start{--rs-view-p-start-s:0;--rs-view-p-start-m:var(--rs-view-p-start-s);--rs-view-p-start-l:var(--rs-view-p-start-m);--rs-view-p-start-xl:var(--rs-view-p-start-l);--rs-view-p-start:var(--rs-view-p-start-s)}.--padding-end{--rs-view-p-end-s:0;--rs-view-p-end-m:var(--rs-view-p-end-s);--rs-view-p-end-l:var(--rs-view-p-end-m);--rs-view-p-end-xl:var(--rs-view-p-end-l);--rs-view-p-end:var(--rs-view-p-end-s)}.root{--rs-view-gap-s:0;--rs-view-gap-m:var(--rs-view-gap-s);--rs-view-gap-l:var(--rs-view-gap-m);--rs-view-gap-xl:var(--rs-view-gap-l);--rs-view-gap:var(--rs-view-gap-s)}.root>.item{--rs-view-item-order-s:0;--rs-view-item-order-m:var(--rs-view-item-order-s);--rs-view-item-order-l:var(--rs-view-item-order-m);--rs-view-item-order-xl:var(--rs-view-item-order-l);--rs-view-item-order:var(--rs-view-item-order-s);--rs-view-item-gap-before-s:initial;--rs-view-item-gap-before-m:var(--rs-view-item-gap-before-s);--rs-view-item-gap-before-l:var(--rs-view-item-gap-before-m);--rs-view-item-gap-before-xl:var(--rs-view-item-gap-before-l);--rs-view-item-gap-before:var(--rs-view-item-gap-before-s)}@media (--rs-viewport-m ){.--direction-column--m{flex-direction:column;flex-wrap:nowrap}.--direction-column--m>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column--m>.item--gap-auto{margin-top:auto}.--direction-column-reverse--m{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse--m>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse--m>.item--gap-auto{margin-top:auto}.--direction-row--m{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row--m>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row--m>.item--gap-auto{margin-inline-start:auto}.--direction-row--m>button{width:auto!important}.--direction-row-reverse--m{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse--m>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse--m>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse--m>button{width:auto!important}.--align-start--m{align-items:flex-start!important}.--align-end--m{align-items:flex-end!important}.--align-center--m{align-items:center!important}.--align-stretch--m{align-items:stretch!important}.--align-baseline--m{align-items:baseline!important}.--justify-start--m{justify-content:flex-start}.--justify-end--m{justify-content:flex-end}.--justify-center--m{justify-content:center}.--justify-space-between--m{justify-content:space-between}.item--grow-true--m{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--grow-false--m{flex-basis:auto;flex-grow:0;flex-shrink:0;min-width:auto}.--padding{--rs-view-p-vertical:var(--rs-view-p-vertical-m);--rs-view-p-horizontal:var(--rs-view-p-horizontal-m)}.--padding-top{--rs-view-p-top:var(--rs-view-p-top-m)}.--padding-bottom{--rs-view-p-bottom:var(--rs-view-p-bottom-m)}.--padding-start{--rs-view-p-start:var(--rs-view-p-start-m)}.--padding-end{--rs-view-p-end:var(--rs-view-p-end-m)}.root{--rs-view-gap:var(--rs-view-gap-m)}.root>.item{--rs-view-item-order:var(--rs-view-item-order-m);--rs-view-item-gap-before:var(--rs-view-item-gap-before-m)}}@media (--rs-viewport-l ){.--direction-column--l{flex-direction:column;flex-wrap:nowrap}.--direction-column--l>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column--l>.item--gap-auto{margin-top:auto}.--direction-column-reverse--l{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse--l>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse--l>.item--gap-auto{margin-top:auto}.--direction-row--l{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row--l>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row--l>.item--gap-auto{margin-inline-start:auto}.--direction-row--l>button{width:auto!important}.--direction-row-reverse--l{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse--l>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse--l>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse--l>button{width:auto!important}.--align-start--l{align-items:flex-start!important}.--align-end--l{align-items:flex-end!important}.--align-center--l{align-items:center!important}.--align-stretch--l{align-items:stretch!important}.--align-baseline--l{align-items:baseline!important}.--justify-start--l{justify-content:flex-start}.--justify-end--l{justify-content:flex-end}.--justify-center--l{justify-content:center}.--justify-space-between--l{justify-content:space-between}.item--grow-true--l{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--grow-false--l{flex-basis:auto;flex-grow:0;flex-shrink:0;min-width:auto}.--padding{--rs-view-p-vertical:var(--rs-view-p-vertical-l);--rs-view-p-horizontal:var(--rs-view-p-horizontal-l)}.--padding-top{--rs-view-p-top:var(--rs-view-p-top-l)}.--padding-bottom{--rs-view-p-bottom:var(--rs-view-p-bottom-l)}.--padding-start{--rs-view-p-start:var(--rs-view-p-start-l)}.--padding-end{--rs-view-p-end:var(--rs-view-p-end-l)}.root{--rs-view-gap:var(--rs-view-gap-l)}.root>.item{--rs-view-item-order:var(--rs-view-item-order-l);--rs-view-item-gap-before:var(--rs-view-item-gap-before-l)}}@media (--rs-viewport-xl ){.--direction-column--xl{flex-direction:column;flex-wrap:nowrap}.--direction-column--xl>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column--xl>.item--gap-auto{margin-top:auto}.--direction-column-reverse--xl{flex-direction:column-reverse;flex-wrap:nowrap}.--direction-column-reverse--xl>.item--gap-before{margin-top:var(--rs-view-item-gap)}.--direction-column-reverse--xl>.item--gap-auto{margin-top:auto}.--direction-row--xl{align-items:flex-start;flex-direction:row;flex-wrap:wrap}.--direction-row--xl>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row--xl>.item--gap-auto{margin-inline-start:auto}.--direction-row--xl>button{width:auto!important}.--direction-row-reverse--xl{align-items:flex-start;flex-direction:row-reverse;flex-wrap:wrap}.--direction-row-reverse--xl>.item--gap-before{margin-inline-start:var(--rs-view-item-gap)}.--direction-row-reverse--xl>.item--gap-auto{margin-inline-start:auto}.--direction-row-reverse--xl>button{width:auto!important}.--align-start--xl{align-items:flex-start!important}.--align-end--xl{align-items:flex-end!important}.--align-center--xl{align-items:center!important}.--align-stretch--xl{align-items:stretch!important}.--align-baseline--xl{align-items:baseline!important}.--justify-start--xl{justify-content:flex-start}.--justify-end--xl{justify-content:flex-end}.--justify-center--xl{justify-content:center}.--justify-space-between--xl{justify-content:space-between}.item--grow-true--xl{flex-basis:0;flex-grow:1;flex-shrink:1;min-width:0}.item--grow-false--xl{flex-basis:auto;flex-grow:0;flex-shrink:0;min-width:auto}.--padding{--rs-view-p-vertical:var(--rs-view-p-vertical-xl);--rs-view-p-horizontal:var(--rs-view-p-horizontal-xl)}.--padding-top{--rs-view-p-top:var(--rs-view-p-top-xl)}.--padding-bottom{--rs-view-p-bottom:var(--rs-view-p-bottom-xl)}.--padding-start{--rs-view-p-start:var(--rs-view-p-start-xl)}.--padding-end{--rs-view-p-end:var(--rs-view-p-end-xl)}.root{--rs-view-gap:var(--rs-view-gap-xl)}.root>.item{--rs-view-item-order:var(--rs-view-item-order-xl);--rs-view-item-gap-before:var(--rs-view-item-gap-before-xl)}}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "reshaped",
|
|
3
3
|
"description": "Professionally crafted design system in React & Figma for building products of any scale and complexity",
|
|
4
|
-
"version": "2.10.
|
|
4
|
+
"version": "2.10.14",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"email": "hello@reshaped.so",
|
|
7
7
|
"homepage": "https://reshaped.so",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.root{padding:calc(var(--rs-p) * var(--rs-unit-x1));--rs-p-s:0;--rs-p-m:var(--rs-p-s);--rs-p-l:var(--rs-p-m);--rs-p-xl:var(--rs-p-l);--rs-p:var(--rs-p-s)}@media (--rs-viewport-m ){.root{--rs-p:var(--rs-p-m)}}@media (--rs-viewport-l ){.root{--rs-p:var(--rs-p-l)}}@media (--rs-viewport-xl ){.root{--rs-p:var(--rs-p-xl)}}
|
|
1
|
+
.root{padding:calc(var(--rs-p) * var(--rs-unit-x1) - var(--rs-border-width, 0px));--rs-p-s:0;--rs-p-m:var(--rs-p-s);--rs-p-l:var(--rs-p-m);--rs-p-xl:var(--rs-p-l);--rs-p:var(--rs-p-s)}@media (--rs-viewport-m ){.root{--rs-p:var(--rs-p-m)}}@media (--rs-viewport-l ){.root{--rs-p:var(--rs-p-l)}}@media (--rs-viewport-xl ){.root{--rs-p:var(--rs-p-xl)}}
|