@skyscanner/backpack-web 42.19.0 → 42.19.1-dev-v26382036205.1
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/bpk-component-badge/src/BpkBadge.module.css +1 -1
- package/bpk-component-banner-alert/src/BpkBannerAlert.module.css +1 -1
- package/bpk-component-barchart/src/BpkBarchartBar.module.css +1 -1
- package/bpk-component-bottom-sheet/src/BpkBottomSheet.module.css +1 -1
- package/bpk-component-button/src/BpkButton.module.css +1 -1
- package/bpk-component-calendar/src/BpkCalendarDate.module.css +1 -1
- package/bpk-component-calendar/src/BpkCalendarNav.module.css +1 -1
- package/bpk-component-chatbot-input/src/BpkChatbotInput.module.css +1 -1
- package/bpk-component-checkbox/src/BpkCheckbox.module.css +1 -1
- package/bpk-component-checkbox/src/BpkCheckboxV2/BpkCheckboxV2.module.css +1 -1
- package/bpk-component-checkbox-card/src/BpkCheckboxCard.js +1 -3
- package/bpk-component-checkbox-card/src/BpkCheckboxCard.module.css +1 -1
- package/bpk-component-checkbox-card/src/BpkCheckboxCardRoot.js +1 -3
- package/bpk-component-chip/src/BpkSelectableChip.module.css +1 -1
- package/bpk-component-form-validation/src/BpkFormValidation.module.css +1 -1
- package/bpk-component-horizontal-nav/src/BpkHorizontalNavItem.module.css +1 -1
- package/bpk-component-icon/scripts/generate-figma-connect.js +2 -2
- package/bpk-component-input/src/BpkInput.module.css +1 -1
- package/bpk-component-label/src/BpkLabel.module.css +1 -1
- package/bpk-component-link/src/BpkLink.module.css +1 -1
- package/bpk-component-map/src/BpkIconMarker.module.css +1 -1
- package/bpk-component-map/src/BpkIconMarkerBackground.module.css +1 -1
- package/bpk-component-navigation-bar/src/BpkNavigationBar.module.css +1 -1
- package/bpk-component-navigation-bar/src/BpkNavigationBarIconButton.module.css +1 -1
- package/bpk-component-pagination/src/BpkPaginationPage.module.css +1 -1
- package/bpk-component-progress/src/BpkProgress.module.css +1 -1
- package/bpk-component-radio/src/BpkRadio.module.css +1 -1
- package/bpk-component-select/src/BpkSelect.module.css +1 -1
- package/bpk-component-skip-link/src/BpkSkipLink.module.css +1 -1
- package/bpk-component-spinner/src/BpkSpinner.module.css +1 -1
- package/bpk-component-star-rating/src/BpkStar.module.css +1 -1
- package/bpk-component-switch/src/BpkSwitch.module.css +1 -1
- package/bpk-component-textarea/src/BpkTextarea.module.css +1 -1
- package/bpk-mixins/_utils.scss +9 -4
- package/bpk-stylesheets/base.css +2 -2
- package/bpk-stylesheets/index.js +3 -0
- package/bpk-stylesheets/primitives.css +40 -0
- package/bpk-stylesheets/theme-backpack-dark.css +189 -0
- package/bpk-stylesheets/theme-backpack-light.css +189 -0
- package/package.json +1 -1
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-badge{display:inline-flex;padding:.25rem .5rem;align-items:center;border-radius
|
|
18
|
+
.bpk-badge{display:inline-flex;padding:.25rem .5rem;align-items:center;border-radius:var(--bpk-badge-border-radius, 0.25rem);margin:0;font-size:.875rem;line-height:1.25rem;font-weight:400;font-size:var(--bpk-badge-font-size, 0.875rem);font-weight:var(--bpk-badge-font-weight, 400);line-height:var(--bpk-badge-line-height, 1.25rem)}.bpk-badge--centered{vertical-align:text-bottom}.bpk-badge--docked-right{position:absolute;top:0;right:0;border-top-left-radius:0;border-top-right-radius:0;border-bottom-right-radius:0}html[dir=rtl] .bpk-badge--docked-right{right:inherit;left:0;border-bottom-left-radius:0;border-bottom-right-radius:.25rem}.bpk-badge--docked-left{position:absolute;top:0;left:0;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:0}html[dir=rtl] .bpk-badge--docked-left{right:0;left:inherit;border-bottom-left-radius:.25rem;border-bottom-right-radius:0}.bpk-badge--warning{background-color:var(--bpk-badge-warning-background-color, rgb(239, 243, 248));color:var(--bpk-badge-warning-text-color, rgb(22, 22, 22));fill:var(--bpk-badge-warning-icon-color, rgb(245, 93, 66))}.bpk-badge--success{background-color:var(--bpk-badge-success-background-color, rgb(239, 243, 248));color:var(--bpk-badge-success-text-color, rgb(22, 22, 22));fill:var(--bpk-badge-success-icon-color, rgb(12, 131, 138))}.bpk-badge--critical{background-color:var(--bpk-badge-critical-background-color, rgb(239, 243, 248));color:var(--bpk-badge-critical-text-color, rgb(22, 22, 22));fill:var(--bpk-badge-critical-icon-color, rgb(231, 8, 102))}.bpk-badge--normal{background-color:var(--bpk-badge-normal-background-color, rgb(239, 243, 248));color:var(--bpk-badge-normal-text-color, rgb(22, 22, 22));fill:var(--bpk-badge-normal-icon-color, rgb(22, 22, 22))}.bpk-badge--inverse{background-color:var(--bpk-badge-inverse-background-color, rgb(255, 255, 255));color:var(--bpk-badge-inverse-text-color, rgb(22, 22, 22));fill:var(--bpk-badge-inverse-icon-color, rgb(22, 22, 22))}.bpk-badge--outline{box-shadow:inset 0 0 0 1px #fff;box-shadow:inset 0 0 0 1px var(--bpk-badge-outline-text-color, rgb(255, 255, 255));background-color:var(--bpk-badge-outline-background-color, transparent);color:var(--bpk-badge-outline-text-color, rgb(255, 255, 255));fill:var(--bpk-badge-outline-icon-color, rgb(255, 255, 255))}.bpk-badge--strong{background-color:var(--bpk-badge-strong-background-color, rgb(5, 32, 60));color:var(--bpk-badge-strong-text-color, rgb(255, 255, 255));fill:var(--bpk-badge-strong-icon-color, rgb(255, 255, 255))}.bpk-badge--brand{background-color:var(--bpk-badge-brand-background-color, rgb(0, 98, 227));color:var(--bpk-badge-brand-text-color, rgb(255, 255, 255));fill:var(--bpk-badge-brand-icon-color, rgb(255, 255, 255))}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-banner-alert{background-color:#fff;overflow:hidden;border-radius:.5rem}.bpk-banner-alert--primary{box-shadow:0 0 0 1px var(--bpk-banner-alert-primary-color, rgb(0, 98, 227))}.bpk-banner-alert--success{box-shadow:0 0 0 1px var(--bpk-banner-alert-success-color, rgb(12, 131, 138))}.bpk-banner-alert--warn{box-shadow:0 0 0 1px var(--bpk-banner-alert-warn-color, rgb(245, 93, 66))}.bpk-banner-alert--error{box-shadow:0 0 0 1px var(--bpk-banner-alert-error-color, rgb(231, 8, 102))}.bpk-banner-alert--neutral{box-shadow:0 0 0 1px #c1c7cf}.bpk-banner-alert__header{display:flex;padding:.5rem;flex-direction:row;align-items:center}.bpk-banner-alert__header--expandable{cursor:pointer}.bpk-no-touch-support .bpk-banner-alert__header--expandable:hover:not(:active):not(:disabled){background-color:#eff3f8}:global(.bpk-no-touch-support) .bpk-banner-alert__header--expandable:hover:not(:active):not(:disabled){background-color:#eff3f8}.bpk-banner-alert__header--expandable:active{background-color:#eff3f8}.bpk-banner-alert__icon,.bpk-banner-alert__message,.bpk-banner-alert__toggle{display:inline-block}.bpk-banner-alert__message{padding:0 .5rem;flex-grow:1}.bpk-banner-alert__primary-icon{fill
|
|
18
|
+
.bpk-banner-alert{background-color:#fff;overflow:hidden;border-radius:.5rem}.bpk-banner-alert--primary{box-shadow:0 0 0 1px var(--bpk-banner-alert-primary-color, rgb(0, 98, 227))}.bpk-banner-alert--success{box-shadow:0 0 0 1px var(--bpk-banner-alert-success-color, rgb(12, 131, 138))}.bpk-banner-alert--warn{box-shadow:0 0 0 1px var(--bpk-banner-alert-warn-color, rgb(245, 93, 66))}.bpk-banner-alert--error{box-shadow:0 0 0 1px var(--bpk-banner-alert-error-color, rgb(231, 8, 102))}.bpk-banner-alert--neutral{box-shadow:0 0 0 1px #c1c7cf}.bpk-banner-alert__header{display:flex;padding:.5rem;flex-direction:row;align-items:center}.bpk-banner-alert__header--expandable{cursor:pointer}.bpk-no-touch-support .bpk-banner-alert__header--expandable:hover:not(:active):not(:disabled){background-color:#eff3f8}:global(.bpk-no-touch-support) .bpk-banner-alert__header--expandable:hover:not(:active):not(:disabled){background-color:#eff3f8}.bpk-banner-alert__header--expandable:active{background-color:#eff3f8}.bpk-banner-alert__icon,.bpk-banner-alert__message,.bpk-banner-alert__toggle{display:inline-block}.bpk-banner-alert__message{padding:0 .5rem;flex-grow:1}.bpk-banner-alert__primary-icon{fill:var(--bpk-banner-alert-primary-color, rgb(0, 98, 227))}.bpk-banner-alert__success-icon{fill:var(--bpk-banner-alert-success-color, rgb(12, 131, 138))}.bpk-banner-alert__warn-icon{fill:var(--bpk-banner-alert-warn-color, rgb(245, 93, 66))}.bpk-banner-alert__error-icon{fill:var(--bpk-banner-alert-error-color, rgb(231, 8, 102))}.bpk-banner-alert__neutral-icon{fill:#626971}.bpk-banner-alert__toggle-button{padding:0;border:0;background-color:rgba(0,0,0,0);cursor:pointer;appearance:none}.bpk-banner-alert__expand-icon{fill:#626971}.bpk-banner-alert__expand-icon--flipped{transform:scaleY(-1)}.bpk-banner-alert__children-container{padding:0 2.5rem .5rem 2rem;color:#626971;margin:0;font-size:.75rem;line-height:1rem;font-weight:400}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-barchart-bar{fill
|
|
18
|
+
.bpk-barchart-bar{fill:var(--bpk-barchart-bar-background-color, rgb(193, 199, 207))}.bpk-barchart-bar--interactive:not(.bpk-barchart-bar--selected){cursor:pointer}.bpk-no-touch-support .bpk-barchart-bar--interactive:not(.bpk-barchart-bar--selected):hover:not(:active):not(:disabled){fill:var(--bpk-barchart-bar-hover-background-color, rgb(5, 32, 60))}:global(.bpk-no-touch-support) .bpk-barchart-bar--interactive:not(.bpk-barchart-bar--selected):hover:not(:active):not(:disabled){fill:var(--bpk-barchart-bar-hover-background-color, rgb(5, 32, 60))}.bpk-barchart-bar--interactive:not(.bpk-barchart-bar--selected):active{fill:var(--bpk-barchart-bar-active-background-color, rgb(0, 98, 227))}.bpk-barchart-bar--selected{fill:var(--bpk-barchart-bar-selected-background-color, rgb(0, 98, 227))}.bpk-barchart-bar__rect{fill:inherit;shape-rendering:auto}.bpk-barchart-bar__rect--outlier{mask:url(#bpk-barchart__def-mask)}.bpk-barchart-bar__tappable-area{fill:rgba(0,0,0,0)}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-bottom-sheet{z-index:1100;width:100%;max-width:32rem;margin:auto;transition:opacity 200ms ease-in-out,transform 200ms ease-in-out;outline:0;background-color:#fff;opacity:1;overflow:hidden;overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none;-webkit-tap-highlight-color:rgba(0,0,0,0);box-shadow:0px 12px 50px 0px rgba(37,32,31,.25);border-radius:.5rem}@media(max-width: 32rem){.bpk-bottom-sheet{position:fixed;bottom:0;height:fit-content;max-height:90%;margin-bottom:0;border-radius:1.5rem 1.5rem 0 0;overflow-x:hidden}}.bpk-bottom-sheet::-webkit-scrollbar{display:none}.bpk-bottom-sheet--appear{animation-duration:200ms;animation-name:slide-up;animation-timing-function:ease-in-out}@media(min-width: 32.0625rem){.bpk-bottom-sheet--appear{transform:scale(0.9);opacity:0;animation:none}}@media(min-width: 32.0625rem){.bpk-bottom-sheet--appear-active{transform:scale(1);opacity:1}}.bpk-bottom-sheet--exit{animation-fill-mode:forwards;animation-duration:200ms;animation-name:slide-down;animation-timing-function:ease-in-out}@media(min-width: 32.0625rem){.bpk-bottom-sheet--exit{animation:none}}.bpk-bottom-sheet--content{padding:0;flex:1;overflow-y:auto}.bpk-bottom-sheet--padding-base-top{padding-top:1rem}.bpk-bottom-sheet--padding-base-bottom{padding-bottom:1rem}.bpk-bottom-sheet--padding-base-start{padding-inline-start:1rem}.bpk-bottom-sheet--padding-base-end{padding-inline-end:1rem}.bpk-bottom-sheet--padding-lg-top{padding-top:1.5rem}.bpk-bottom-sheet--padding-lg-bottom{padding-bottom:1.5rem}.bpk-bottom-sheet--padding-lg-start{padding-inline-start:1.5rem}.bpk-bottom-sheet--padding-lg-end{padding-inline-end:1.5rem}.bpk-bottom-sheet--padding-xxl-top{padding-top:2.5rem}.bpk-bottom-sheet--padding-xxl-bottom{padding-bottom:2.5rem}.bpk-bottom-sheet--padding-xxl-start{padding-inline-start:2.5rem}.bpk-bottom-sheet--padding-xxl-end{padding-inline-end:2.5rem}.bpk-bottom-sheet--padding-xxxl-top{padding-top:4rem}.bpk-bottom-sheet--padding-xxxl-bottom{padding-bottom:4rem}.bpk-bottom-sheet--padding-xxxl-start{padding-inline-start:4rem}.bpk-bottom-sheet--padding-xxxl-end{padding-inline-end:4rem}@media(min-width: 32.0625rem){.bpk-bottom-sheet--wide{max-width:64rem}}.bpk-bottom-sheet--header-wrapper{position:sticky;top:0;z-index:899;background-color
|
|
18
|
+
.bpk-bottom-sheet{z-index:1100;width:100%;max-width:32rem;margin:auto;transition:opacity 200ms ease-in-out,transform 200ms ease-in-out;outline:0;background-color:#fff;opacity:1;overflow:hidden;overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none;-webkit-tap-highlight-color:rgba(0,0,0,0);box-shadow:0px 12px 50px 0px rgba(37,32,31,.25);border-radius:.5rem}@media(max-width: 32rem){.bpk-bottom-sheet{position:fixed;bottom:0;height:fit-content;max-height:90%;margin-bottom:0;border-radius:1.5rem 1.5rem 0 0;overflow-x:hidden}}.bpk-bottom-sheet::-webkit-scrollbar{display:none}.bpk-bottom-sheet--appear{animation-duration:200ms;animation-name:slide-up;animation-timing-function:ease-in-out}@media(min-width: 32.0625rem){.bpk-bottom-sheet--appear{transform:scale(0.9);opacity:0;animation:none}}@media(min-width: 32.0625rem){.bpk-bottom-sheet--appear-active{transform:scale(1);opacity:1}}.bpk-bottom-sheet--exit{animation-fill-mode:forwards;animation-duration:200ms;animation-name:slide-down;animation-timing-function:ease-in-out}@media(min-width: 32.0625rem){.bpk-bottom-sheet--exit{animation:none}}.bpk-bottom-sheet--content{padding:0;flex:1;overflow-y:auto}.bpk-bottom-sheet--padding-base-top{padding-top:1rem}.bpk-bottom-sheet--padding-base-bottom{padding-bottom:1rem}.bpk-bottom-sheet--padding-base-start{padding-inline-start:1rem}.bpk-bottom-sheet--padding-base-end{padding-inline-end:1rem}.bpk-bottom-sheet--padding-lg-top{padding-top:1.5rem}.bpk-bottom-sheet--padding-lg-bottom{padding-bottom:1.5rem}.bpk-bottom-sheet--padding-lg-start{padding-inline-start:1.5rem}.bpk-bottom-sheet--padding-lg-end{padding-inline-end:1.5rem}.bpk-bottom-sheet--padding-xxl-top{padding-top:2.5rem}.bpk-bottom-sheet--padding-xxl-bottom{padding-bottom:2.5rem}.bpk-bottom-sheet--padding-xxl-start{padding-inline-start:2.5rem}.bpk-bottom-sheet--padding-xxl-end{padding-inline-end:2.5rem}.bpk-bottom-sheet--padding-xxxl-top{padding-top:4rem}.bpk-bottom-sheet--padding-xxxl-bottom{padding-bottom:4rem}.bpk-bottom-sheet--padding-xxxl-start{padding-inline-start:4rem}.bpk-bottom-sheet--padding-xxxl-end{padding-inline-end:4rem}@media(min-width: 32.0625rem){.bpk-bottom-sheet--wide{max-width:64rem}}.bpk-bottom-sheet--header-wrapper{position:sticky;top:0;z-index:899;background-color:var(--bpk-navigation-bar-background-color, rgb(255, 255, 255))}.bpk-bottom-sheet--header{min-height:fit-content;padding:1.5rem}@keyframes slide-up{0%{transform:translateY(100%)}100%{transform:translateY(0%)}}@keyframes slide-down{0%{transform:translateY(0%)}100%{transform:translateY(100%)}}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-button{display:inline-block;min-height:2.25rem;margin:0;padding:.375rem 1rem;border:0;text-align:center;text-decoration:none;cursor:pointer;vertical-align:middle;user-select:none;border-radius:.5rem;border-radius:var(--bpk-button-border-radius, 0.5rem);font-size:1rem;line-height:1.5rem;font-weight:700;color:#fff;color:var(--bpk-button-primary-text-color, rgb(255, 255, 255));background-color:#05203c;background-color:var(--bpk-button-primary-background-color, rgb(5, 32, 60))}.bpk-no-touch-support .bpk-button:hover:not(:active):not(:disabled){background-color:#154679;background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:#fff;color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-button:hover:not(:active):not(:disabled){background-color:#154679;background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:#fff;color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}.bpk-button:active{color:#fff;color:var(--bpk-button-primary-active-text-color, rgb(255, 255, 255));background-color:#154679;background-color:var(--bpk-button-primary-active-background-color, rgb(21, 70, 121))}.bpk-button:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-button.bpk-button--loading:disabled{background-color:#154679;background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:#fff;color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}@media(hover: hover){.bpk-button--link:hover:not(:active):not(:disabled) .bpk-button--link-underlined,.bpk-button--link-on-dark:hover:not(:active):not(:disabled) .bpk-button--link-underlined{background-size:0 1px}.bpk-button--link:hover:not(:active):not(:disabled) .bpk-button--link-underlined--implicit,.bpk-button--link-on-dark:hover:not(:active):not(:disabled) .bpk-button--link-underlined--implicit--alternate{background-size:100% 1px}}.bpk-button--large{min-height:3rem;padding:.75rem 1rem}.bpk-button--icon-only{padding-right:.625rem;padding-left:.625rem}.bpk-button--large-icon-only{padding-right:.75rem;padding-left:.75rem}.bpk-button--destructive{color:#161616;color:var(--bpk-button-secondary-text-color, rgb(22, 22, 22));background-color:#e0e4e9;background-color:var(--bpk-button-secondary-background-color, rgb(224, 228, 233));color:#e70866;color:var(--bpk-button-destructive-text-color, rgb(231, 8, 102));background-color:#e0e4e9;background-color:var(--bpk-button-destructive-background-color, rgb(224, 228, 233))}.bpk-no-touch-support .bpk-button--destructive:hover:not(:active):not(:disabled){background-color:#c1c7cf;background-color:var(--bpk-button-secondary-hover-background-color, rgb(193, 199, 207));color:#161616;color:var(--bpk-button-secondary-hover-text-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--destructive:hover:not(:active):not(:disabled){background-color:#c1c7cf;background-color:var(--bpk-button-secondary-hover-background-color, rgb(193, 199, 207));color:#161616;color:var(--bpk-button-secondary-hover-text-color, rgb(22, 22, 22))}.bpk-button--destructive:active{color:#161616;color:var(--bpk-button-secondary-active-text-color, rgb(22, 22, 22));background-color:#c1c7cf;background-color:var(--bpk-button-secondary-active-background-color, rgb(193, 199, 207))}.bpk-button--destructive:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-button--destructive.bpk-button--loading:disabled{background-color:#c1c7cf;background-color:var(--bpk-button-secondary-hover-background-color, rgb(193, 199, 207));color:#161616;color:var(--bpk-button-secondary-hover-text-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-button--destructive:hover:not(:active):not(:disabled){background-color:#e70866;background-color:var(--bpk-button-destructive-hover-background-color, rgb(231, 8, 102));color:#fff;color:var(--bpk-button-destructive-hover-text-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-button--destructive:hover:not(:active):not(:disabled){background-color:#e70866;background-color:var(--bpk-button-destructive-hover-background-color, rgb(231, 8, 102));color:#fff;color:var(--bpk-button-destructive-hover-text-color, rgb(255, 255, 255))}.bpk-button--destructive:active{color:#fff;color:var(--bpk-button-destructive-active-text-color, rgb(255, 255, 255));background-color:#e70866;background-color:var(--bpk-button-destructive-active-background-color, rgb(231, 8, 102))}.bpk-button--destructive:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-button--destructive.bpk-button--loading:disabled{background-color:#e70866;background-color:var(--bpk-button-destructive-hover-background-color, rgb(231, 8, 102));color:#fff;color:var(--bpk-button-destructive-hover-text-color, rgb(255, 255, 255))}.bpk-button--featured{color:#fff;color:var(--bpk-button-featured-text-color, rgb(255, 255, 255));background-color:#0062e3;background-color:var(--bpk-button-featured-background-color, rgb(0, 98, 227))}.bpk-no-touch-support .bpk-button--featured:hover:not(:active):not(:disabled){background-color:#024daf;background-color:var(--bpk-button-featured-hover-background-color, rgb(2, 77, 175));color:#fff;color:var(--bpk-button-featured-hover-text-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-button--featured:hover:not(:active):not(:disabled){background-color:#024daf;background-color:var(--bpk-button-featured-hover-background-color, rgb(2, 77, 175));color:#fff;color:var(--bpk-button-featured-hover-text-color, rgb(255, 255, 255))}.bpk-button--featured:active{color:#fff;color:var(--bpk-button-featured-active-text-color, rgb(255, 255, 255));background-color:#024daf;background-color:var(--bpk-button-featured-active-background-color, rgb(2, 77, 175))}.bpk-button--featured:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-button--featured.bpk-button--loading:disabled{background-color:#024daf;background-color:var(--bpk-button-featured-hover-background-color, rgb(2, 77, 175));color:#fff;color:var(--bpk-button-featured-hover-text-color, rgb(255, 255, 255))}.bpk-button--link{background:none;box-shadow:none;color:#161616;color:var(--bpk-link-color, rgb(22, 22, 22));padding:.375rem 0;color:#0062e3;position:relative;display:inline;padding:0;border:0;background-color:rgba(0,0,0,0);text-decoration:none;cursor:pointer;appearance:none;color:#161616;color:var(--bpk-link-color, rgb(22, 22, 22));--bpk-button-svg-display: inline-block;--bpk-button-svg-vertical-align: middle}.bpk-no-touch-support .bpk-button--link:hover:not(:active):not(:disabled){color:#161616;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--link:hover:not(:active):not(:disabled){color:#161616;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-button--link:active{text-decoration:none;color:#161616;color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-button--link::after{bottom:auto}.bpk-no-touch-support .bpk-button--link:hover:not(:active):not(:disabled){background:none;color:#024daf;text-decoration:none}:global(.bpk-no-touch-support) .bpk-button--link:hover:not(:active):not(:disabled){background:none;color:#024daf;text-decoration:none}.bpk-button--link:active{background:none;color:#024daf;text-decoration:none}.bpk-button--link:disabled,.bpk-button--link:disabled:active{background:none;color:rgba(0,0,0,.2);text-decoration:none}.bpk-button--link.bpk-button--loading:disabled,.bpk-button--link.bpk-button--loading:disabled:active{background:none;color:#161616;color:var(--bpk-button-link-loading-color, rgb(22, 22, 22))}.bpk-button--link-large{padding:.75rem 0}.bpk-no-touch-support .bpk-button--link:hover:not(:active):not(:disabled){text-decoration:none;color:#161616;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--link:hover:not(:active):not(:disabled){text-decoration:none;color:#161616;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-button--link:visited{color:#161616;color:var(--bpk-link-visited-color, rgb(22, 22, 22))}.bpk-button--link:active{color:#161616;color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-button--link--implicit{color:#161616;color:var(--bpk-link-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-button--link--implicit:hover:not(:active):not(:disabled){color:#161616;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--link--implicit:hover:not(:active):not(:disabled){color:#161616;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-button--link--implicit:active{text-decoration:none;color:#161616;color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-button--link--icon-only{display:inline-flex;justify-content:center;align-items:center;vertical-align:middle}.bpk-button--link-on-dark{background:none;box-shadow:none;color:#161616;color:var(--bpk-link-color, rgb(22, 22, 22));padding:.375rem 0;color:#0062e3;color:#fff;color:var(--bpk-button-link-on-dark-text-color, rgb(255, 255, 255));color:#fff;color:var(--bpk-link-alternate-color, rgb(255, 255, 255));--bpk-button-svg-display: inline-block;--bpk-button-svg-vertical-align: middle}.bpk-no-touch-support .bpk-button--link-on-dark:hover:not(:active):not(:disabled){color:#161616;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--link-on-dark:hover:not(:active):not(:disabled){color:#161616;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-button--link-on-dark:active{text-decoration:none;color:#161616;color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-button--link-on-dark::after{bottom:auto}.bpk-no-touch-support .bpk-button--link-on-dark:hover:not(:active):not(:disabled){background:none;color:#024daf;text-decoration:none}:global(.bpk-no-touch-support) .bpk-button--link-on-dark:hover:not(:active):not(:disabled){background:none;color:#024daf;text-decoration:none}.bpk-button--link-on-dark:active{background:none;color:#024daf;text-decoration:none}.bpk-button--link-on-dark:disabled,.bpk-button--link-on-dark:disabled:active{background:none;color:rgba(0,0,0,.2);text-decoration:none}.bpk-button--link-on-dark.bpk-button--loading:disabled,.bpk-button--link-on-dark.bpk-button--loading:disabled:active{background:none;color:#161616;color:var(--bpk-button-link-loading-color, rgb(22, 22, 22))}.bpk-button--link-on-dark-large{padding:.75rem 0}.bpk-no-touch-support .bpk-button--link-on-dark:hover:not(:active):not(:disabled){color:hsla(0,0%,100%,.5);color:var(--bpk-button-link-on-dark-hover-text-color, rgba(255, 255, 255, 0.5))}:global(.bpk-no-touch-support) .bpk-button--link-on-dark:hover:not(:active):not(:disabled){color:hsla(0,0%,100%,.5);color:var(--bpk-button-link-on-dark-hover-text-color, rgba(255, 255, 255, 0.5))}.bpk-button--link-on-dark:active{color:hsla(0,0%,100%,.5);color:var(--bpk-button-link-on-dark-active-text-color, rgba(255, 255, 255, 0.5))}.bpk-button--link-on-dark:visited{color:#fff;color:var(--bpk-button-link-on-dark-text-color, rgb(255, 255, 255))}.bpk-button--link-on-dark:disabled,.bpk-button--link-on-dark:disabled:active{color:hsla(0,0%,100%,.2);color:var(--bpk-button-link-on-dark-disabled-color, rgba(255, 255, 255, 0.2))}.bpk-button--link-on-dark.bpk-button--loading:disabled,.bpk-button--link-on-dark.bpk-button--loading:disabled:active{color:hsla(0,0%,100%,.5);color:var(--bpk-button-link-on-dark-hover-text-color, rgba(255, 255, 255, 0.5))}.bpk-no-touch-support .bpk-button--link-on-dark:hover:not(:active):not(:disabled){color:#fff;color:var(--bpk-link-alternate-hover-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-button--link-on-dark:hover:not(:active):not(:disabled){color:#fff;color:var(--bpk-link-alternate-hover-color, rgb(255, 255, 255))}.bpk-button--link-on-dark:visited{color:#fff;color:var(--bpk-link-alternate-visited-color, rgb(255, 255, 255))}.bpk-button--link-on-dark:active{color:#fff;color:var(--bpk-link-alternate-active-color, rgb(255, 255, 255))}.bpk-button--link-on-dark--implicit{color:#161616;color:var(--bpk-link-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-button--link-on-dark--implicit:hover:not(:active):not(:disabled){color:#161616;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--link-on-dark--implicit:hover:not(:active):not(:disabled){color:#161616;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-button--link-on-dark--implicit:active{text-decoration:none;color:#161616;color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-button--link-underlined{gap:.5rem;display:inline-flex;justify-content:center;align-items:center;vertical-align:middle;padding-bottom:.0625rem;transition:background-size 200ms ease;background:linear-gradient(rgb(22, 22, 22), rgb(22, 22, 22));background-repeat:no-repeat;background-position:0 100%;background-size:100% 1px}.bpk-no-touch-support .bpk-button--link-underlined:hover:not(:active):not(:disabled){background-size:0 1px}:global(.bpk-no-touch-support) .bpk-button--link-underlined:hover:not(:active):not(:disabled){background-size:0 1px}.bpk-button--link-underlined--implicit{background-size:0 1px}.bpk-no-touch-support .bpk-button--link-underlined--implicit:hover:not(:active):not(:disabled){background-size:100% 1px}:global(.bpk-no-touch-support) .bpk-button--link-underlined--implicit:hover:not(:active):not(:disabled){background-size:100% 1px}.bpk-button--link-underlined--alternate{background:linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255));background-repeat:no-repeat;background-position:0 100%;background-size:100% 1px}.bpk-no-touch-support .bpk-button--link-underlined--alternate:hover:not(:active):not(:disabled){background-size:0 1px}:global(.bpk-no-touch-support) .bpk-button--link-underlined--alternate:hover:not(:active):not(:disabled){background-size:0 1px}.bpk-button--link-underlined--implicit--alternate{background:linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255));background-repeat:no-repeat;background-position:0 100%;background-size:0 1px}.bpk-no-touch-support .bpk-button--link-underlined--implicit--alternate:hover:not(:active):not(:disabled){background-size:100% 1px}:global(.bpk-no-touch-support) .bpk-button--link-underlined--implicit--alternate:hover:not(:active):not(:disabled){background-size:100% 1px}.bpk-button--primary-on-dark{color:#161616;color:var(--bpk-button-primary-on-dark-text-color, rgb(22, 22, 22));background-color:#fff;background-color:var(--bpk-button-primary-on-dark-background-color, rgb(255, 255, 255))}.bpk-no-touch-support .bpk-button--primary-on-dark:hover:not(:active):not(:disabled){background-color:#c1c7cf;background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:#161616;color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--primary-on-dark:hover:not(:active):not(:disabled){background-color:#c1c7cf;background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:#161616;color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}.bpk-button--primary-on-dark:active{color:#161616;color:var(--bpk-button-primary-on-dark-active-text-color, rgb(22, 22, 22));background-color:#c1c7cf;background-color:var(--bpk-button-primary-on-dark-active-background-color, rgb(193, 199, 207))}.bpk-button--primary-on-dark:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-button--primary-on-dark.bpk-button--loading:disabled{background-color:#c1c7cf;background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:#161616;color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}.bpk-button--primary-on-light{color:#fff;color:var(--bpk-button-primary-on-light-text-color, rgb(255, 255, 255));background-color:#05203c;background-color:var(--bpk-button-primary-on-light-background-color, rgb(5, 32, 60))}.bpk-no-touch-support .bpk-button--primary-on-light:hover:not(:active):not(:disabled){background-color:#154679;background-color:var(--bpk-button-primary-on-light-hover-background-color, rgb(21, 70, 121));color:#fff;color:var(--bpk-button-primary-on-light-hover-text-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-button--primary-on-light:hover:not(:active):not(:disabled){background-color:#154679;background-color:var(--bpk-button-primary-on-light-hover-background-color, rgb(21, 70, 121));color:#fff;color:var(--bpk-button-primary-on-light-hover-text-color, rgb(255, 255, 255))}.bpk-button--primary-on-light:active{color:#fff;color:var(--bpk-button-primary-on-light-active-text-color, rgb(255, 255, 255));background-color:#154679;background-color:var(--bpk-button-primary-on-light-active-background-color, rgb(21, 70, 121))}.bpk-button--primary-on-light:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-button--primary-on-light.bpk-button--loading:disabled{background-color:#154679;background-color:var(--bpk-button-primary-on-light-hover-background-color, rgb(21, 70, 121));color:#fff;color:var(--bpk-button-primary-on-light-hover-text-color, rgb(255, 255, 255))}.bpk-button--secondary{color:#161616;color:var(--bpk-button-secondary-text-color, rgb(22, 22, 22));background-color:#e0e4e9;background-color:var(--bpk-button-secondary-background-color, rgb(224, 228, 233))}.bpk-no-touch-support .bpk-button--secondary:hover:not(:active):not(:disabled){background-color:#c1c7cf;background-color:var(--bpk-button-secondary-hover-background-color, rgb(193, 199, 207));color:#161616;color:var(--bpk-button-secondary-hover-text-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--secondary:hover:not(:active):not(:disabled){background-color:#c1c7cf;background-color:var(--bpk-button-secondary-hover-background-color, rgb(193, 199, 207));color:#161616;color:var(--bpk-button-secondary-hover-text-color, rgb(22, 22, 22))}.bpk-button--secondary:active{color:#161616;color:var(--bpk-button-secondary-active-text-color, rgb(22, 22, 22));background-color:#c1c7cf;background-color:var(--bpk-button-secondary-active-background-color, rgb(193, 199, 207))}.bpk-button--secondary:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-button--secondary.bpk-button--loading:disabled{background-color:#c1c7cf;background-color:var(--bpk-button-secondary-hover-background-color, rgb(193, 199, 207));color:#161616;color:var(--bpk-button-secondary-hover-text-color, rgb(22, 22, 22))}.bpk-button--secondary-on-dark{color:#fff;color:var(--bpk-button-secondary-on-dark-text-color, rgb(255, 255, 255));background-color:hsla(0,0%,100%,.1);background-color:var(--bpk-button-secondary-on-dark-background-color, rgba(255, 255, 255, 0.1))}.bpk-no-touch-support .bpk-button--secondary-on-dark:hover:not(:active):not(:disabled){background-color:#04182d;background-color:var(--bpk-button-secondary-on-dark-hover-background-color, rgb(4, 24, 45));color:#fff;color:var(--bpk-button-secondary-on-dark-hover-text-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-button--secondary-on-dark:hover:not(:active):not(:disabled){background-color:#04182d;background-color:var(--bpk-button-secondary-on-dark-hover-background-color, rgb(4, 24, 45));color:#fff;color:var(--bpk-button-secondary-on-dark-hover-text-color, rgb(255, 255, 255))}.bpk-button--secondary-on-dark:active{color:#fff;color:var(--bpk-button-secondary-on-dark-active-text-color, rgb(255, 255, 255));background-color:#04182d;background-color:var(--bpk-button-secondary-on-dark-active-background-color, rgb(4, 24, 45))}.bpk-button--secondary-on-dark:disabled{background-color:#0b121d;color:hsla(0,0%,100%,.2)}.bpk-button--secondary-on-dark.bpk-button--loading:disabled{background-color:#04182d;background-color:var(--bpk-button-secondary-on-dark-hover-background-color, rgb(4, 24, 45));color:#fff;color:var(--bpk-button-secondary-on-dark-hover-text-color, rgb(255, 255, 255))}.bpk-button--full-width{display:block;width:100%}.bpk-button--has-icon{display:inline-flex;align-items:center;gap:.5rem}.bpk-button--full-width.bpk-button--has-icon{display:flex;justify-content:center}.bpk-button__leading-icon,.bpk-button__trailing-icon{display:inline-flex;flex-shrink:0;text-decoration:none}.bpk-button__loading-container{position:relative;display:inline-flex;justify-content:center;align-items:center}.bpk-button__loading-icon{position:absolute;display:inline-flex;--bpk-button-svg-display: block;--bpk-button-svg-vertical-align: baseline}.bpk-button__content--hidden{opacity:0}.bpk-button span>svg{display:var(--bpk-button-svg-display, block);vertical-align:var(--bpk-button-svg-vertical-align, baseline)}.bpk-button svg{fill:currentcolor}
|
|
18
|
+
.bpk-button{display:inline-block;min-height:2.25rem;margin:0;padding:.375rem 1rem;border:0;text-align:center;text-decoration:none;cursor:pointer;vertical-align:middle;user-select:none;border-radius:var(--bpk-button-border-radius, 0.5rem);font-size:1rem;line-height:1.5rem;font-weight:700;color:var(--bpk-button-primary-text-color, rgb(255, 255, 255));background-color:var(--bpk-button-primary-background-color, rgb(5, 32, 60))}.bpk-no-touch-support .bpk-button:hover:not(:active):not(:disabled){background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-button:hover:not(:active):not(:disabled){background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}.bpk-button:active{color:var(--bpk-button-primary-active-text-color, rgb(255, 255, 255));background-color:var(--bpk-button-primary-active-background-color, rgb(21, 70, 121))}.bpk-button:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-button.bpk-button--loading:disabled{background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}@media(hover: hover){.bpk-button--link:hover:not(:active):not(:disabled) .bpk-button--link-underlined,.bpk-button--link-on-dark:hover:not(:active):not(:disabled) .bpk-button--link-underlined{background-size:0 1px}.bpk-button--link:hover:not(:active):not(:disabled) .bpk-button--link-underlined--implicit,.bpk-button--link-on-dark:hover:not(:active):not(:disabled) .bpk-button--link-underlined--implicit--alternate{background-size:100% 1px}}.bpk-button--large{min-height:3rem;padding:.75rem 1rem}.bpk-button--icon-only{padding-right:.625rem;padding-left:.625rem}.bpk-button--large-icon-only{padding-right:.75rem;padding-left:.75rem}.bpk-button--destructive{color:var(--bpk-button-secondary-text-color, rgb(22, 22, 22));background-color:var(--bpk-button-secondary-background-color, rgb(224, 228, 233));color:var(--bpk-button-destructive-text-color, rgb(231, 8, 102));background-color:var(--bpk-button-destructive-background-color, rgb(224, 228, 233))}.bpk-no-touch-support .bpk-button--destructive:hover:not(:active):not(:disabled){background-color:var(--bpk-button-secondary-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-secondary-hover-text-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--destructive:hover:not(:active):not(:disabled){background-color:var(--bpk-button-secondary-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-secondary-hover-text-color, rgb(22, 22, 22))}.bpk-button--destructive:active{color:var(--bpk-button-secondary-active-text-color, rgb(22, 22, 22));background-color:var(--bpk-button-secondary-active-background-color, rgb(193, 199, 207))}.bpk-button--destructive:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-button--destructive.bpk-button--loading:disabled{background-color:var(--bpk-button-secondary-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-secondary-hover-text-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-button--destructive:hover:not(:active):not(:disabled){background-color:var(--bpk-button-destructive-hover-background-color, rgb(231, 8, 102));color:var(--bpk-button-destructive-hover-text-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-button--destructive:hover:not(:active):not(:disabled){background-color:var(--bpk-button-destructive-hover-background-color, rgb(231, 8, 102));color:var(--bpk-button-destructive-hover-text-color, rgb(255, 255, 255))}.bpk-button--destructive:active{color:var(--bpk-button-destructive-active-text-color, rgb(255, 255, 255));background-color:var(--bpk-button-destructive-active-background-color, rgb(231, 8, 102))}.bpk-button--destructive:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-button--destructive.bpk-button--loading:disabled{background-color:var(--bpk-button-destructive-hover-background-color, rgb(231, 8, 102));color:var(--bpk-button-destructive-hover-text-color, rgb(255, 255, 255))}.bpk-button--featured{color:var(--bpk-button-featured-text-color, rgb(255, 255, 255));background-color:var(--bpk-button-featured-background-color, rgb(0, 98, 227))}.bpk-no-touch-support .bpk-button--featured:hover:not(:active):not(:disabled){background-color:var(--bpk-button-featured-hover-background-color, rgb(2, 77, 175));color:var(--bpk-button-featured-hover-text-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-button--featured:hover:not(:active):not(:disabled){background-color:var(--bpk-button-featured-hover-background-color, rgb(2, 77, 175));color:var(--bpk-button-featured-hover-text-color, rgb(255, 255, 255))}.bpk-button--featured:active{color:var(--bpk-button-featured-active-text-color, rgb(255, 255, 255));background-color:var(--bpk-button-featured-active-background-color, rgb(2, 77, 175))}.bpk-button--featured:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-button--featured.bpk-button--loading:disabled{background-color:var(--bpk-button-featured-hover-background-color, rgb(2, 77, 175));color:var(--bpk-button-featured-hover-text-color, rgb(255, 255, 255))}.bpk-button--link{background:none;box-shadow:none;color:var(--bpk-link-color, rgb(22, 22, 22));padding:.375rem 0;color:#0062e3;position:relative;display:inline;padding:0;border:0;background-color:rgba(0,0,0,0);text-decoration:none;cursor:pointer;appearance:none;color:var(--bpk-link-color, rgb(22, 22, 22));--bpk-button-svg-display: inline-block;--bpk-button-svg-vertical-align: middle}.bpk-no-touch-support .bpk-button--link:hover:not(:active):not(:disabled){color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--link:hover:not(:active):not(:disabled){color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-button--link:active{text-decoration:none;color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-button--link::after{bottom:auto}.bpk-no-touch-support .bpk-button--link:hover:not(:active):not(:disabled){background:none;color:#024daf;text-decoration:none}:global(.bpk-no-touch-support) .bpk-button--link:hover:not(:active):not(:disabled){background:none;color:#024daf;text-decoration:none}.bpk-button--link:active{background:none;color:#024daf;text-decoration:none}.bpk-button--link:disabled,.bpk-button--link:disabled:active{background:none;color:rgba(0,0,0,.2);text-decoration:none}.bpk-button--link.bpk-button--loading:disabled,.bpk-button--link.bpk-button--loading:disabled:active{background:none;color:var(--bpk-button-link-loading-color, rgb(22, 22, 22))}.bpk-button--link-large{padding:.75rem 0}.bpk-no-touch-support .bpk-button--link:hover:not(:active):not(:disabled){text-decoration:none;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--link:hover:not(:active):not(:disabled){text-decoration:none;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-button--link:visited{color:var(--bpk-link-visited-color, rgb(22, 22, 22))}.bpk-button--link:active{color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-button--link--implicit{color:var(--bpk-link-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-button--link--implicit:hover:not(:active):not(:disabled){color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--link--implicit:hover:not(:active):not(:disabled){color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-button--link--implicit:active{text-decoration:none;color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-button--link--icon-only{display:inline-flex;justify-content:center;align-items:center;vertical-align:middle}.bpk-button--link-on-dark{background:none;box-shadow:none;color:var(--bpk-link-color, rgb(22, 22, 22));padding:.375rem 0;color:#0062e3;color:var(--bpk-button-link-on-dark-text-color, rgb(255, 255, 255));color:var(--bpk-link-alternate-color, rgb(255, 255, 255));--bpk-button-svg-display: inline-block;--bpk-button-svg-vertical-align: middle}.bpk-no-touch-support .bpk-button--link-on-dark:hover:not(:active):not(:disabled){color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--link-on-dark:hover:not(:active):not(:disabled){color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-button--link-on-dark:active{text-decoration:none;color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-button--link-on-dark::after{bottom:auto}.bpk-no-touch-support .bpk-button--link-on-dark:hover:not(:active):not(:disabled){background:none;color:#024daf;text-decoration:none}:global(.bpk-no-touch-support) .bpk-button--link-on-dark:hover:not(:active):not(:disabled){background:none;color:#024daf;text-decoration:none}.bpk-button--link-on-dark:active{background:none;color:#024daf;text-decoration:none}.bpk-button--link-on-dark:disabled,.bpk-button--link-on-dark:disabled:active{background:none;color:rgba(0,0,0,.2);text-decoration:none}.bpk-button--link-on-dark.bpk-button--loading:disabled,.bpk-button--link-on-dark.bpk-button--loading:disabled:active{background:none;color:var(--bpk-button-link-loading-color, rgb(22, 22, 22))}.bpk-button--link-on-dark-large{padding:.75rem 0}.bpk-no-touch-support .bpk-button--link-on-dark:hover:not(:active):not(:disabled){color:var(--bpk-button-link-on-dark-hover-text-color, rgba(255, 255, 255, 0.5))}:global(.bpk-no-touch-support) .bpk-button--link-on-dark:hover:not(:active):not(:disabled){color:var(--bpk-button-link-on-dark-hover-text-color, rgba(255, 255, 255, 0.5))}.bpk-button--link-on-dark:active{color:var(--bpk-button-link-on-dark-active-text-color, rgba(255, 255, 255, 0.5))}.bpk-button--link-on-dark:visited{color:var(--bpk-button-link-on-dark-text-color, rgb(255, 255, 255))}.bpk-button--link-on-dark:disabled,.bpk-button--link-on-dark:disabled:active{color:var(--bpk-button-link-on-dark-disabled-color, rgba(255, 255, 255, 0.2))}.bpk-button--link-on-dark.bpk-button--loading:disabled,.bpk-button--link-on-dark.bpk-button--loading:disabled:active{color:var(--bpk-button-link-on-dark-hover-text-color, rgba(255, 255, 255, 0.5))}.bpk-no-touch-support .bpk-button--link-on-dark:hover:not(:active):not(:disabled){color:var(--bpk-link-alternate-hover-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-button--link-on-dark:hover:not(:active):not(:disabled){color:var(--bpk-link-alternate-hover-color, rgb(255, 255, 255))}.bpk-button--link-on-dark:visited{color:var(--bpk-link-alternate-visited-color, rgb(255, 255, 255))}.bpk-button--link-on-dark:active{color:var(--bpk-link-alternate-active-color, rgb(255, 255, 255))}.bpk-button--link-on-dark--implicit{color:var(--bpk-link-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-button--link-on-dark--implicit:hover:not(:active):not(:disabled){color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--link-on-dark--implicit:hover:not(:active):not(:disabled){color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-button--link-on-dark--implicit:active{text-decoration:none;color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-button--link-underlined{gap:.5rem;display:inline-flex;justify-content:center;align-items:center;vertical-align:middle;padding-bottom:.0625rem;transition:background-size 200ms ease;background:linear-gradient(rgb(22, 22, 22), rgb(22, 22, 22));background-repeat:no-repeat;background-position:0 100%;background-size:100% 1px}.bpk-no-touch-support .bpk-button--link-underlined:hover:not(:active):not(:disabled){background-size:0 1px}:global(.bpk-no-touch-support) .bpk-button--link-underlined:hover:not(:active):not(:disabled){background-size:0 1px}.bpk-button--link-underlined--implicit{background-size:0 1px}.bpk-no-touch-support .bpk-button--link-underlined--implicit:hover:not(:active):not(:disabled){background-size:100% 1px}:global(.bpk-no-touch-support) .bpk-button--link-underlined--implicit:hover:not(:active):not(:disabled){background-size:100% 1px}.bpk-button--link-underlined--alternate{background:linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255));background-repeat:no-repeat;background-position:0 100%;background-size:100% 1px}.bpk-no-touch-support .bpk-button--link-underlined--alternate:hover:not(:active):not(:disabled){background-size:0 1px}:global(.bpk-no-touch-support) .bpk-button--link-underlined--alternate:hover:not(:active):not(:disabled){background-size:0 1px}.bpk-button--link-underlined--implicit--alternate{background:linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255));background-repeat:no-repeat;background-position:0 100%;background-size:0 1px}.bpk-no-touch-support .bpk-button--link-underlined--implicit--alternate:hover:not(:active):not(:disabled){background-size:100% 1px}:global(.bpk-no-touch-support) .bpk-button--link-underlined--implicit--alternate:hover:not(:active):not(:disabled){background-size:100% 1px}.bpk-button--primary-on-dark{color:var(--bpk-button-primary-on-dark-text-color, rgb(22, 22, 22));background-color:var(--bpk-button-primary-on-dark-background-color, rgb(255, 255, 255))}.bpk-no-touch-support .bpk-button--primary-on-dark:hover:not(:active):not(:disabled){background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--primary-on-dark:hover:not(:active):not(:disabled){background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}.bpk-button--primary-on-dark:active{color:var(--bpk-button-primary-on-dark-active-text-color, rgb(22, 22, 22));background-color:var(--bpk-button-primary-on-dark-active-background-color, rgb(193, 199, 207))}.bpk-button--primary-on-dark:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-button--primary-on-dark.bpk-button--loading:disabled{background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}.bpk-button--primary-on-light{color:var(--bpk-button-primary-on-light-text-color, rgb(255, 255, 255));background-color:var(--bpk-button-primary-on-light-background-color, rgb(5, 32, 60))}.bpk-no-touch-support .bpk-button--primary-on-light:hover:not(:active):not(:disabled){background-color:var(--bpk-button-primary-on-light-hover-background-color, rgb(21, 70, 121));color:var(--bpk-button-primary-on-light-hover-text-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-button--primary-on-light:hover:not(:active):not(:disabled){background-color:var(--bpk-button-primary-on-light-hover-background-color, rgb(21, 70, 121));color:var(--bpk-button-primary-on-light-hover-text-color, rgb(255, 255, 255))}.bpk-button--primary-on-light:active{color:var(--bpk-button-primary-on-light-active-text-color, rgb(255, 255, 255));background-color:var(--bpk-button-primary-on-light-active-background-color, rgb(21, 70, 121))}.bpk-button--primary-on-light:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-button--primary-on-light.bpk-button--loading:disabled{background-color:var(--bpk-button-primary-on-light-hover-background-color, rgb(21, 70, 121));color:var(--bpk-button-primary-on-light-hover-text-color, rgb(255, 255, 255))}.bpk-button--secondary{color:var(--bpk-button-secondary-text-color, rgb(22, 22, 22));background-color:var(--bpk-button-secondary-background-color, rgb(224, 228, 233))}.bpk-no-touch-support .bpk-button--secondary:hover:not(:active):not(:disabled){background-color:var(--bpk-button-secondary-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-secondary-hover-text-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-button--secondary:hover:not(:active):not(:disabled){background-color:var(--bpk-button-secondary-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-secondary-hover-text-color, rgb(22, 22, 22))}.bpk-button--secondary:active{color:var(--bpk-button-secondary-active-text-color, rgb(22, 22, 22));background-color:var(--bpk-button-secondary-active-background-color, rgb(193, 199, 207))}.bpk-button--secondary:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-button--secondary.bpk-button--loading:disabled{background-color:var(--bpk-button-secondary-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-secondary-hover-text-color, rgb(22, 22, 22))}.bpk-button--secondary-on-dark{color:var(--bpk-button-secondary-on-dark-text-color, rgb(255, 255, 255));background-color:var(--bpk-button-secondary-on-dark-background-color, rgba(255, 255, 255, 0.1))}.bpk-no-touch-support .bpk-button--secondary-on-dark:hover:not(:active):not(:disabled){background-color:var(--bpk-button-secondary-on-dark-hover-background-color, rgb(4, 24, 45));color:var(--bpk-button-secondary-on-dark-hover-text-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-button--secondary-on-dark:hover:not(:active):not(:disabled){background-color:var(--bpk-button-secondary-on-dark-hover-background-color, rgb(4, 24, 45));color:var(--bpk-button-secondary-on-dark-hover-text-color, rgb(255, 255, 255))}.bpk-button--secondary-on-dark:active{color:var(--bpk-button-secondary-on-dark-active-text-color, rgb(255, 255, 255));background-color:var(--bpk-button-secondary-on-dark-active-background-color, rgb(4, 24, 45))}.bpk-button--secondary-on-dark:disabled{background-color:#0b121d;color:hsla(0,0%,100%,.2)}.bpk-button--secondary-on-dark.bpk-button--loading:disabled{background-color:var(--bpk-button-secondary-on-dark-hover-background-color, rgb(4, 24, 45));color:var(--bpk-button-secondary-on-dark-hover-text-color, rgb(255, 255, 255))}.bpk-button--full-width{display:block;width:100%}.bpk-button--has-icon{display:inline-flex;align-items:center;gap:.5rem}.bpk-button--full-width.bpk-button--has-icon{display:flex;justify-content:center}.bpk-button__leading-icon,.bpk-button__trailing-icon{display:inline-flex;flex-shrink:0;text-decoration:none}.bpk-button__loading-container{position:relative;display:inline-flex;justify-content:center;align-items:center}.bpk-button__loading-icon{position:absolute;display:inline-flex;--bpk-button-svg-display: block;--bpk-button-svg-vertical-align: baseline}.bpk-button__content--hidden{opacity:0}.bpk-button span>svg{display:var(--bpk-button-svg-display, block);vertical-align:var(--bpk-button-svg-vertical-align, baseline)}.bpk-button svg{fill:currentcolor}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-calendar-date{width:2.25rem;height:2.25rem;padding:0;border:none;border-radius:1.5rem;background-color:rgba(0,0,0,0);text-align:center;cursor:pointer;appearance:none;box-sizing:border-box;font-size:1rem;line-height:1.5rem;font-weight:700;color
|
|
18
|
+
.bpk-calendar-date{width:2.25rem;height:2.25rem;padding:0;border:none;border-radius:1.5rem;background-color:rgba(0,0,0,0);text-align:center;cursor:pointer;appearance:none;box-sizing:border-box;font-size:1rem;line-height:1.5rem;font-weight:700;color:var(--bpk-calendar-date-text-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-calendar-date:hover:not(:active):not(:disabled):not(.bpk-calendar-date--selected){background-color:#eff3f8;color:var(--bpk-calendar-date-text-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-calendar-date:hover:not(:active):not(:disabled):not(.bpk-calendar-date--selected){background-color:#eff3f8;color:var(--bpk-calendar-date-text-hover-color, rgb(22, 22, 22))}.bpk-calendar-date:not(.bpk-calendar-date--selected):active{background-color:#eff3f8;color:var(--bpk-calendar-date-text-active-color, rgb(22, 22, 22))}.bpk-calendar-date--outside{background-color:rgba(0,0,0,0);color:rgba(0,0,0,.2)}.bpk-calendar-date--selected{cursor:default;color:var(--bpk-calendar-date-text-selected-color, rgb(255, 255, 255))}.bpk-calendar-date--middle{background-color:#e3f0ff;color:#161616}.bpk-calendar-date--single{background-color:#0062e3}.bpk-calendar-date--start{background-color:#0062e3}.bpk-calendar-date--end{background-color:#0062e3}.bpk-calendar-date--focused:not(:disabled):not(.bpk-calendar-date--selected){box-shadow:0 0 0 2px #0062e3 inset;box-shadow:0 0 0 2px var(--bpk-calendar-date-focused-border-color, rgb(0, 98, 227)) inset;color:var(--bpk-calendar-date-text-focus-color, rgb(0, 98, 227))}.bpk-calendar-date:disabled,.bpk-calendar-date--blocked{background-color:rgba(0,0,0,0);color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-no-touch-support .bpk-calendar-date:disabled:hover:not(:active):not(:disabled),.bpk-no-touch-support .bpk-calendar-date--blocked:hover:not(:active):not(:disabled){color:rgba(0,0,0,.2)}:global(.bpk-no-touch-support) .bpk-calendar-date:disabled:hover:not(:active):not(:disabled),:global(.bpk-no-touch-support) .bpk-calendar-date--blocked:hover:not(:active):not(:disabled){color:rgba(0,0,0,.2)}.bpk-calendar-date:disabled:active,.bpk-calendar-date--blocked:active{color:rgba(0,0,0,.2)}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-calendar-nav{display:table}.bpk-calendar-nav__month{display:table-cell;text-align:center}.bpk-calendar-nav__nudger{display:table-cell;padding:0 .5rem;text-align:center;vertical-align:middle;box-sizing:border-box}.bpk-calendar-nav__button{width:100%;height:2.25rem;padding:.375rem 0;border:none;background:none;cursor:pointer;appearance:none;color
|
|
18
|
+
.bpk-calendar-nav{display:table}.bpk-calendar-nav__month{display:table-cell;text-align:center}.bpk-calendar-nav__nudger{display:table-cell;padding:0 .5rem;text-align:center;vertical-align:middle;box-sizing:border-box}.bpk-calendar-nav__button{width:100%;height:2.25rem;padding:.375rem 0;border:none;background:none;cursor:pointer;appearance:none;color:var(--bpk-calendar-nudger-icon-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-calendar-nav__button:hover:not(:active):not(:disabled){color:var(--bpk-calendar-nudger-icon-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-calendar-nav__button:hover:not(:active):not(:disabled){color:var(--bpk-calendar-nudger-icon-hover-color, rgb(22, 22, 22))}.bpk-calendar-nav__button:active{color:var(--bpk-calendar-nudger-icon-active-color, rgb(22, 22, 22))}html[dir=rtl] .bpk-calendar-nav__button .bpk-calendar-nav__icon{transform:scaleX(-1)}.bpk-calendar-nav__button:disabled{cursor:not-allowed}.bpk-calendar-nav__text--hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;white-space:nowrap;overflow:hidden;clip:rect(0 0 0 0)}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-chatbot-input--cars{transition:border-color 200ms ease,box-shadow 200ms ease;border:.09375rem solid #c1c7cf;background:#fff;box-shadow:none;box-sizing:border-box;touch-action:manipulation;border-radius
|
|
18
|
+
.bpk-chatbot-input--cars{transition:border-color 200ms ease,box-shadow 200ms ease;border:.09375rem solid #c1c7cf;background:#fff;box-shadow:none;box-sizing:border-box;touch-action:manipulation;border-radius:var(--bpk-chatbot-input-border-radius, 0.75rem)}.bpk-no-touch-support .bpk-chatbot-input--cars:hover:not(:active):not(:disabled){border-color:var(--bpk-chatbot-input-focus-border-color, rgb(0, 98, 227))}:global(.bpk-no-touch-support) .bpk-chatbot-input--cars:hover:not(:active):not(:disabled){border-color:var(--bpk-chatbot-input-focus-border-color, rgb(0, 98, 227))}.bpk-chatbot-input--cars:active{border-color:var(--bpk-chatbot-input-focus-border-color, rgb(0, 98, 227))}.bpk-chatbot-input--cars:focus-within{box-shadow:0 0 0 .03125rem #0062e3;box-shadow:0 0 0 .03125rem var(--bpk-chatbot-input-focus-border-color, rgb(0, 98, 227));border-color:var(--bpk-chatbot-input-focus-border-color, rgb(0, 98, 227))}.bpk-chatbot-input--composer{position:relative;transition:transform .3s cubic-bezier(0.4, 0, 0.2, 1),box-shadow .3s cubic-bezier(0.4, 0, 0.2, 1);border:none;background:#fff;box-sizing:border-box;will-change:transform,box-shadow;border-radius:var(--bpk-chatbot-input-border-radius, 0.75rem)}.bpk-chatbot-input--composer--with-shadow{box-shadow:0px 1px 3px 0px rgba(37,32,31,.3)}.bpk-chatbot-input--composer--with-shadow:focus-within{box-shadow:0px 4px 14px 0px rgba(37,32,31,.25)}.bpk-chatbot-input--composer--overLimit{transform:translateY(-0.25rem)}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-checkbox{position:relative;display:inline-block;padding-left:1.75rem;margin:0;font-size:1rem;line-height:1.5rem;font-weight:400}html[dir=rtl] .bpk-checkbox{padding-right:1.75rem;padding-left:0}.bpk-checkbox__label{vertical-align:baseline}.bpk-checkbox__label--small{margin:0;font-size:.75rem;line-height:1rem;font-weight:400}.bpk-checkbox--white{color:#fff}.bpk-checkbox--disabled{color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-checkbox--disabled--white{color:hsla(0,0%,100%,.5)}.bpk-checkbox--invalid input[type=checkbox]{border:.1875rem solid #e70866}.bpk-checkbox__input{position:absolute;top:.125rem;left:0;width:1.25rem;height:1.25rem;margin:0;padding:0;border:.1875rem solid #626971;border-radius:.25rem;cursor:pointer;vertical-align:text-bottom;appearance:none}html[dir=rtl] .bpk-checkbox__input{right:0;left:auto}@media screen\0 {.bpk-checkbox__input{background:none !important}}.bpk-checkbox__input:checked,.bpk-checkbox__input:indeterminate{background-color
|
|
18
|
+
.bpk-checkbox{position:relative;display:inline-block;padding-left:1.75rem;margin:0;font-size:1rem;line-height:1.5rem;font-weight:400}html[dir=rtl] .bpk-checkbox{padding-right:1.75rem;padding-left:0}.bpk-checkbox__label{vertical-align:baseline}.bpk-checkbox__label--small{margin:0;font-size:.75rem;line-height:1rem;font-weight:400}.bpk-checkbox--white{color:#fff}.bpk-checkbox--disabled{color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-checkbox--disabled--white{color:hsla(0,0%,100%,.5)}.bpk-checkbox--invalid input[type=checkbox]{border:.1875rem solid #e70866}.bpk-checkbox__input{position:absolute;top:.125rem;left:0;width:1.25rem;height:1.25rem;margin:0;padding:0;border:.1875rem solid #626971;border-radius:.25rem;cursor:pointer;vertical-align:text-bottom;appearance:none}html[dir=rtl] .bpk-checkbox__input{right:0;left:auto}@media screen\0 {.bpk-checkbox__input{background:none !important}}.bpk-checkbox__input:checked,.bpk-checkbox__input:indeterminate{background-color:var(--bpk-checkbox-checked-color, rgb(0, 98, 227));border-color:var(--bpk-checkbox-checked-color, rgb(0, 98, 227))}.bpk-checkbox__input:checked:disabled,.bpk-checkbox__input:indeterminate:disabled{border-color:rgba(0,0,0,.2);background:none}.bpk-checkbox__input:checked:not(:indeterminate){background-image:url("data:image/svg+xml,%3Csvg%20width%3D%2213%22%20height%3D%229%22%20viewBox%3D%220%200%2013%209%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.35352%203.64648L5.5%207.5L11.5%201.5%22%20stroke%3D%22white%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");background-repeat:no-repeat;background-position:.0625rem center;background-size:calc(100% - .15625rem) auto}.bpk-checkbox__input:checked:not(:indeterminate):disabled{background-image:url("data:image/svg+xml,%3Csvg%20width%3D%2213%22%20height%3D%229%22%20viewBox%3D%220%200%2013%209%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.35352%203.64648L5.5%207.5L11.5%201.5%22%20stroke%3D%22lightgrey%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E")}.bpk-checkbox__input:disabled{border-color:rgba(0,0,0,.2)}.bpk-checkbox__input-indeterminate::before{position:absolute;top:.3125rem;left:.125rem;content:"";width:.625rem;height:.1875rem;border-radius:2px;background-color:#fff}.bpk-checkbox__input:disabled{cursor:inherit}.bpk-checkbox__input-white{background-color:#fff}.bpk-checkbox__asterisk{color:#e70866}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-checkbox-v2{position:relative;display:inline-flex;align-items:flex-start;cursor:pointer;gap:.5rem}.bpk-checkbox-v2[data-disabled]{cursor:not-allowed}.bpk-checkbox-v2__control{position:relative;display:flex;width:1.25rem;height:1.25rem;margin-top:.125rem;justify-content:center;align-items:center;flex-shrink:0;border:.1875rem solid #626971;background-color:#fff;border-radius
|
|
18
|
+
.bpk-checkbox-v2{position:relative;display:inline-flex;align-items:flex-start;cursor:pointer;gap:.5rem}.bpk-checkbox-v2[data-disabled]{cursor:not-allowed}.bpk-checkbox-v2__control{position:relative;display:flex;width:1.25rem;height:1.25rem;margin-top:.125rem;justify-content:center;align-items:center;flex-shrink:0;border:.1875rem solid #626971;background-color:#fff;border-radius:var(--bpk-checkbox-border-radius, 0.25rem)}.bpk-checkbox-v2__control[data-state=checked]{border-width:.1875rem;border-color:var(--bpk-checkbox-selected-color, rgb(0, 98, 227));background-color:var(--bpk-checkbox-selected-color, rgb(0, 98, 227));background-image:url("data:image/svg+xml,%3Csvg%20width%3D%2213%22%20height%3D%229%22%20viewBox%3D%220%200%2013%209%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.35352%203.64648L5.5%207.5L11.5%201.5%22%20stroke%3D%22white%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");background-repeat:no-repeat;background-position:.0625rem center;background-size:calc(100% - .15625rem) auto}.bpk-checkbox-v2__control[data-state=checked]:disabled{background-image:url("data:image/svg+xml,%3Csvg%20width%3D%2213%22%20height%3D%229%22%20viewBox%3D%220%200%2013%209%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.35352%203.64648L5.5%207.5L11.5%201.5%22%20stroke%3D%22lightgrey%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E")}.bpk-checkbox-v2__control[data-state=indeterminate]{border-width:.1875rem;border-color:var(--bpk-checkbox-selected-color, rgb(0, 98, 227));background-color:var(--bpk-checkbox-selected-color, rgb(0, 98, 227))}.bpk-checkbox-v2__control[data-state=indeterminate]::before{content:"";width:.625rem;height:.1875rem;border-radius:2px;background-color:#fff}.bpk-checkbox-v2__control[data-invalid]{border-color:#e70866}.bpk-checkbox-v2__control[data-disabled]{border-color:rgba(0,0,0,.2);background-color:#fff}.bpk-checkbox-v2__control[data-disabled][data-state=checked],.bpk-checkbox-v2__control[data-disabled][data-state=indeterminate]{border-color:rgba(0,0,0,.2);background-color:#fff}.bpk-checkbox-v2__control[data-disabled][data-state=checked]{background-image:url("data:image/svg+xml,%3Csvg%20width%3D%2213%22%20height%3D%229%22%20viewBox%3D%220%200%2013%209%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.35352%203.64648L5.5%207.5L11.5%201.5%22%20stroke%3D%22lightgrey%22%20stroke-width%3D%223%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E")}.bpk-checkbox-v2:has(.bpk-checkbox-v2__hidden-input:focus-visible) .bpk-checkbox-v2__control{outline:.125rem solid #0062e3;outline-offset:.125rem}.bpk-checkbox-v2__label{color:#161616;user-select:none;font-size:1rem;line-height:1.5rem;font-weight:400}.bpk-checkbox-v2__label a{color:inherit}[data-disabled] .bpk-checkbox-v2__label{color:rgba(0,0,0,.2)}.bpk-checkbox-v2__description{display:block;margin-top:.25rem;color:#626971;font-size:.875rem;line-height:1.25rem;font-weight:400}[data-disabled] .bpk-checkbox-v2__description{color:rgba(0,0,0,.2)}
|
|
@@ -17,7 +17,6 @@
|
|
|
17
17
|
*/
|
|
18
18
|
|
|
19
19
|
import { CheckboxHiddenInput } from '@ark-ui/react';
|
|
20
|
-
import { withButtonAlignment } from "../../bpk-component-icon";
|
|
21
20
|
import TickCircleIcon from "../../bpk-component-icon/sm/tick-circle";
|
|
22
21
|
import { BpkSpinner, SPINNER_TYPES } from "../../bpk-component-spinner";
|
|
23
22
|
import BpkText, { TEXT_COLORS, TEXT_STYLES } from "../../bpk-component-text";
|
|
@@ -27,7 +26,6 @@ import { useCheckboxCardContext } from "./CheckboxCardContext";
|
|
|
27
26
|
import STYLES from "./BpkCheckboxCard.module.css";
|
|
28
27
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
29
28
|
const getClassName = cssModules(STYLES);
|
|
30
|
-
const AlignedTickCircleIcon = withButtonAlignment(TickCircleIcon);
|
|
31
29
|
|
|
32
30
|
// ─── HiddenInput ─────────────────────────────────────────────────────────────
|
|
33
31
|
|
|
@@ -169,7 +167,7 @@ function Indicator(_props = {}) {
|
|
|
169
167
|
return /*#__PURE__*/_jsx("div", {
|
|
170
168
|
className: getClassName('bpk-checkbox-card-indicator'),
|
|
171
169
|
"aria-hidden": true,
|
|
172
|
-
children: /*#__PURE__*/_jsx(
|
|
170
|
+
children: /*#__PURE__*/_jsx(TickCircleIcon, {})
|
|
173
171
|
});
|
|
174
172
|
}
|
|
175
173
|
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-checkbox-card-root{position:relative;display:block;min-width:2.75rem;height:100%;min-height:2.75rem;transition:background-color 200ms ease-in-out,border-color 200ms ease-in-out,color 200ms ease-in-out;border:1px solid var(--bpk-checkbox-card-default-border-color, rgb(193, 199, 207));background-color:var(--bpk-checkbox-card-default-background-color, rgb(255, 255, 255));color:var(--bpk-checkbox-card-default-text-color, rgb(22, 22, 22));cursor:pointer;box-sizing:border-box}.bpk-checkbox-card-root:has(:focus-visible){outline:.125rem solid #0062e3;outline-offset:.125rem}.bpk-no-touch-support .bpk-checkbox-card-root:not([data-state=checked]):not([data-disabled]):hover:not(:active):not(:disabled),.bpk-no-touch-support .bpk-checkbox-card-root:not([data-state=checked])[data-loading]:hover:not(:active):not(:disabled){border-color:var(--bpk-checkbox-card-hover-border-color, rgb(193, 199, 207));background-color:var(--bpk-checkbox-card-hover-background-color, rgb(245, 247, 250))}:global(.bpk-no-touch-support) .bpk-checkbox-card-root:not([data-state=checked]):not([data-disabled]):hover:not(:active):not(:disabled),:global(.bpk-no-touch-support) .bpk-checkbox-card-root:not([data-state=checked])[data-loading]:hover:not(:active):not(:disabled){border-color:var(--bpk-checkbox-card-hover-border-color, rgb(193, 199, 207));background-color:var(--bpk-checkbox-card-hover-background-color, rgb(245, 247, 250))}.bpk-checkbox-card-root[data-state=checked]{border-color:var(--bpk-checkbox-card-checked-border-color, transparent);background-color:var(--bpk-checkbox-card-checked-background-color, rgb(5, 32, 60));color:var(--bpk-checkbox-card-checked-text-color, rgb(255, 255, 255))}.bpk-checkbox-card-root[data-disabled]:not([data-loading]){border-color:var(--bpk-checkbox-card-disabled-border-color, rgb(193, 199, 207));background-color:var(--bpk-checkbox-card-disabled-background-color, rgb(239, 243, 248));color:var(--bpk-checkbox-card-disabled-text-color, rgba(0, 0, 0, 0.2));cursor:not-allowed}.bpk-checkbox-card-root[data-loading]{cursor:not-allowed}.bpk-checkbox-card-root--radius-square{border-radius:0}.bpk-checkbox-card-root--radius-rounded{border-radius:.75rem}.bpk-checkbox-card-root--on-canvas-default{--bpk-checkbox-card-default-background-color: rgb(255, 255, 255);--bpk-checkbox-card-default-border-color: rgb(193, 199, 207)}.bpk-checkbox-card-root--cars{--bpk-checkbox-card-default-
|
|
18
|
+
.bpk-checkbox-card-root{position:relative;display:block;min-width:2.75rem;height:100%;min-height:2.75rem;transition:background-color 200ms ease-in-out,border-color 200ms ease-in-out,color 200ms ease-in-out;border:1px solid var(--bpk-checkbox-card-default-border-color, rgb(193, 199, 207));background-color:var(--bpk-checkbox-card-default-background-color, rgb(255, 255, 255));color:var(--bpk-checkbox-card-default-text-color, rgb(22, 22, 22));cursor:pointer;box-sizing:border-box}.bpk-checkbox-card-root:has(:focus-visible){outline:.125rem solid #0062e3;outline-offset:.125rem}.bpk-no-touch-support .bpk-checkbox-card-root:not([data-state=checked]):not([data-disabled]):hover:not(:active):not(:disabled),.bpk-no-touch-support .bpk-checkbox-card-root:not([data-state=checked])[data-loading]:hover:not(:active):not(:disabled){border-color:var(--bpk-checkbox-card-hover-border-color, rgb(193, 199, 207));background-color:var(--bpk-checkbox-card-hover-background-color, rgb(245, 247, 250))}:global(.bpk-no-touch-support) .bpk-checkbox-card-root:not([data-state=checked]):not([data-disabled]):hover:not(:active):not(:disabled),:global(.bpk-no-touch-support) .bpk-checkbox-card-root:not([data-state=checked])[data-loading]:hover:not(:active):not(:disabled){border-color:var(--bpk-checkbox-card-hover-border-color, rgb(193, 199, 207));background-color:var(--bpk-checkbox-card-hover-background-color, rgb(245, 247, 250))}.bpk-checkbox-card-root[data-state=checked]{border-color:var(--bpk-checkbox-card-checked-border-color, transparent);background-color:var(--bpk-checkbox-card-checked-background-color, rgb(5, 32, 60));color:var(--bpk-checkbox-card-checked-text-color, rgb(255, 255, 255))}.bpk-checkbox-card-root[data-disabled]:not([data-loading]){border-color:var(--bpk-checkbox-card-disabled-border-color, rgb(193, 199, 207));background-color:var(--bpk-checkbox-card-disabled-background-color, rgb(239, 243, 248));color:var(--bpk-checkbox-card-disabled-text-color, rgba(0, 0, 0, 0.2));cursor:not-allowed}.bpk-checkbox-card-root[data-loading]{cursor:not-allowed}.bpk-checkbox-card-root--radius-square{border-radius:0}.bpk-checkbox-card-root--radius-rounded{border-radius:.75rem}.bpk-checkbox-card-root--on-canvas-default{--bpk-checkbox-card-default-background-color: rgb(255, 255, 255);--bpk-checkbox-card-default-border-color: rgb(193, 199, 207)}.bpk-checkbox-card-root--cars{transition:background-color 200ms ease-in-out,box-shadow 200ms ease-in-out,color 200ms ease-in-out;border:none;box-shadow:inset 0 0 0 1px var(--bpk-checkbox-card-default-border-color, rgb(193, 199, 207));--bpk-checkbox-card-default-background-color: rgb(255, 255, 255);--bpk-checkbox-card-default-border-color: rgb(193, 199, 207);--bpk-checkbox-card-hover-background-color: rgb(255, 255, 255);--bpk-checkbox-card-hover-border-color: rgb(5, 32, 60);--bpk-checkbox-card-checked-background-color: rgb(255, 255, 255);--bpk-checkbox-card-checked-text-color: rgb(22, 22, 22);--bpk-checkbox-card-checked-border-color: rgb(5, 32, 60);--bpk-checkbox-card-indicator-background-color: rgb(5, 32, 60)}.bpk-checkbox-card-root--cars.bpk-checkbox-card-root--cars--radius-rounded{border-radius:1.5rem}.bpk-no-touch-support .bpk-checkbox-card-root--cars:not([data-state=checked]):not([data-disabled]):hover:not(:active):not(:disabled),.bpk-no-touch-support .bpk-checkbox-card-root--cars:not([data-state=checked])[data-loading]:hover:not(:active):not(:disabled){box-shadow:inset 0 0 0 1px var(--bpk-checkbox-card-hover-border-color, rgb(5, 32, 60))}:global(.bpk-no-touch-support) .bpk-checkbox-card-root--cars:not([data-state=checked]):not([data-disabled]):hover:not(:active):not(:disabled),:global(.bpk-no-touch-support) .bpk-checkbox-card-root--cars:not([data-state=checked])[data-loading]:hover:not(:active):not(:disabled){box-shadow:inset 0 0 0 1px var(--bpk-checkbox-card-hover-border-color, rgb(5, 32, 60))}.bpk-checkbox-card-root--cars[data-state=checked]{box-shadow:inset 0 0 0 2px var(--bpk-checkbox-card-checked-border-color, rgb(5, 32, 60))}@media(hover: none)and (pointer: coarse){.bpk-checkbox-card-root--cars[data-state=checked]{border:.0125rem solid var(--bpk-checkbox-card-checked-border-color, rgb(5, 32, 60))}}.bpk-checkbox-card-root--cars:active:not([data-disabled]):not([data-loading]){transition:none;box-shadow:inset 0 0 0 2px var(--bpk-checkbox-card-checked-border-color, rgb(5, 32, 60))}@media(hover: none)and (pointer: coarse){.bpk-checkbox-card-root--cars:active:not([data-disabled]):not([data-loading]){border:.0125rem solid var(--bpk-checkbox-card-checked-border-color, rgb(5, 32, 60))}}.bpk-checkbox-card-root--cars[data-disabled]:not([data-loading]){box-shadow:none}.bpk-checkbox-card-root--cars:has(:focus-visible){outline:none;outline-offset:0}@media(hover: hover)and (pointer: fine){.bpk-checkbox-card-root--cars:has(:focus-visible){box-shadow:inset 0 0 0 2px #0062e3}}.bpk-checkbox-card-root--on-canvas-contrast{--bpk-checkbox-card-default-background-color: rgb(255, 255, 255);--bpk-checkbox-card-hover-background-color: rgb(255, 255, 255);--bpk-checkbox-card-default-border-color: transparent;--bpk-checkbox-card-hover-border-color: rgb(193, 199, 207);--bpk-checkbox-card-disabled-background-color: rgb(239, 243, 248)}.bpk-checkbox-card-root--on-surface-contrast{--bpk-checkbox-card-default-background-color: rgba(255, 255, 255, 0.1);--bpk-checkbox-card-default-text-color: rgb(255, 255, 255);--bpk-checkbox-card-secondary-text-color: rgb(255, 255, 255);--bpk-checkbox-card-hover-background-color: rgb(5, 32, 60);--bpk-checkbox-card-checked-background-color: rgb(0, 98, 227);--bpk-checkbox-card-default-border-color: transparent;--bpk-checkbox-card-hover-border-color: transparent;--bpk-checkbox-card-disabled-border-color: transparent}.bpk-checkbox-card-content{width:100%;padding:.5rem}.bpk-checkbox-card-label{display:-webkit-box;width:100%;color:inherit;text-align:center;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:var(--bpk-label-line-clamp, 2);line-clamp:var(--bpk-label-line-clamp, 2)}.bpk-checkbox-card-label>*{text-align:inherit}.bpk-checkbox-card-description{display:-webkit-box;width:100%;color:var(--bpk-checkbox-card-secondary-text-color, rgb(98, 105, 113));text-align:center;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:var(--bpk-description-line-clamp, 3);line-clamp:var(--bpk-description-line-clamp, 3);margin:0}.bpk-checkbox-card-root[data-state=checked] .bpk-checkbox-card-description{color:inherit}.bpk-checkbox-card-root--cars[data-state=checked] .bpk-checkbox-card-description{color:var(--bpk-checkbox-card-secondary-text-color, rgb(98, 105, 113))}.bpk-checkbox-card-description>*{text-align:inherit}.bpk-checkbox-card-price{display:flex;align-items:center;gap:.25rem}.bpk-checkbox-card-indicator{position:absolute;top:.5rem;display:none;z-index:1;width:1.25rem;height:1.25rem;inset-inline-end:.5rem;pointer-events:none}.bpk-checkbox-card-indicator svg{width:100%;height:100%;fill:var(--bpk-checkbox-card-indicator-background-color, rgb(0, 98, 227))}.bpk-checkbox-card-root[data-state=checked] .bpk-checkbox-card-indicator{display:block}.bpk-checkbox-card-root--cars .bpk-checkbox-card-indicator{width:1rem;height:1rem}
|
|
@@ -18,7 +18,6 @@
|
|
|
18
18
|
|
|
19
19
|
import { useMemo } from 'react';
|
|
20
20
|
import { CheckboxRoot } from '@ark-ui/react';
|
|
21
|
-
import { withButtonAlignment } from "../../bpk-component-icon";
|
|
22
21
|
import TickCircleIcon from "../../bpk-component-icon/sm/tick-circle";
|
|
23
22
|
import { cssModules } from "../../bpk-react-utils";
|
|
24
23
|
import { CheckboxCardContext } from "./CheckboxCardContext";
|
|
@@ -26,7 +25,6 @@ import { CHECKBOX_CARD_VARIANTS, CHECKBOX_CARD_RADIUS } from "./common-types";
|
|
|
26
25
|
import STYLES from "./BpkCheckboxCard.module.css";
|
|
27
26
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
28
27
|
const getClassName = cssModules(STYLES);
|
|
29
|
-
const AlignedTickCircleIcon = withButtonAlignment(TickCircleIcon);
|
|
30
28
|
/**
|
|
31
29
|
* BpkCheckboxCard.Root - Root container for checkbox card compound component.
|
|
32
30
|
*
|
|
@@ -93,7 +91,7 @@ export function Root({
|
|
|
93
91
|
children: [variant === CHECKBOX_CARD_VARIANTS.cars && /*#__PURE__*/_jsx("div", {
|
|
94
92
|
className: getClassName('bpk-checkbox-card-indicator'),
|
|
95
93
|
"aria-hidden": true,
|
|
96
|
-
children: /*#__PURE__*/_jsx(
|
|
94
|
+
children: /*#__PURE__*/_jsx(TickCircleIcon, {})
|
|
97
95
|
}), children]
|
|
98
96
|
})
|
|
99
97
|
})
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-chip{display:inline-flex;height:2rem;padding:0 1rem;align-items:center;border:none;cursor:pointer;border-radius
|
|
18
|
+
.bpk-chip{display:inline-flex;height:2rem;padding:0 1rem;align-items:center;border:none;cursor:pointer;border-radius:var(--bpk-chip-border-radius, 0.5rem)}.bpk-chip__leading-accessory-view{display:inline-flex;fill:currentcolor;margin-left:0;margin-right:.5rem}html[dir=rtl] .bpk-chip__leading-accessory-view{margin-left:.5rem;margin-right:0}.bpk-chip__trailing-accessory-view{display:inline-flex;fill:currentcolor;margin-left:.5rem;margin-right:-0.5rem}html[dir=rtl] .bpk-chip__trailing-accessory-view{margin-right:.5rem}html[dir=rtl] .bpk-chip__trailing-accessory-view{margin-left:-0.5rem}.bpk-chip--on-dark{background-color:var(--bpk-chip-on-dark-background-color, transparent);color:var(--bpk-chip-on-dark-text-color, rgb(255, 255, 255));box-shadow:0 0 0 1px hsla(0,0%,100%,.5) inset;box-shadow:0 0 0 1px var(--bpk-chip-on-dark-border-color, rgba(255, 255, 255, 0.5)) inset}.bpk-no-touch-support .bpk-chip--on-dark:hover:not(:active):not(:disabled){box-shadow:0 0 0 1px #fff inset;box-shadow:0 0 0 1px var(--bpk-chip-on-dark-hover-border-color, rgb(255, 255, 255)) inset}:global(.bpk-no-touch-support) .bpk-chip--on-dark:hover:not(:active):not(:disabled){box-shadow:0 0 0 1px #fff inset;box-shadow:0 0 0 1px var(--bpk-chip-on-dark-hover-border-color, rgb(255, 255, 255)) inset}.bpk-chip--on-dark:active:not(:disabled){box-shadow:0 0 0 1px #fff inset;box-shadow:0 0 0 1px var(--bpk-chip-on-dark-active-border-color, rgb(255, 255, 255)) inset}.bpk-chip--on-dark-selected{color:var(--bpk-chip-on-dark-selected-text-color, rgb(22, 22, 22));background-color:var(--bpk-chip-on-dark-selected-background-color, rgb(255, 255, 255));box-shadow:0 0 0 1px rgba(0,0,0,0) inset}.bpk-no-touch-support .bpk-chip--on-dark-selected:hover:not(:active):not(:disabled){background-color:var(--bpk-chip-on-dark-selected-hover-background-color, rgb(255, 255, 255));box-shadow:0 0 0 1px rgba(0,0,0,0) inset}:global(.bpk-no-touch-support) .bpk-chip--on-dark-selected:hover:not(:active):not(:disabled){background-color:var(--bpk-chip-on-dark-selected-hover-background-color, rgb(255, 255, 255));box-shadow:0 0 0 1px rgba(0,0,0,0) inset}.bpk-chip--on-dark-selected:active:not(:disabled){background-color:var(--bpk-chip-on-dark-selected-active-background-color, rgb(255, 255, 255));box-shadow:0 0 0 1px rgba(0,0,0,0) inset}.bpk-no-touch-support .bpk-chip--on-dark-dismissible:hover:not(:active):not(:disabled) svg{fill:currentcolor}:global(.bpk-no-touch-support) .bpk-chip--on-dark-dismissible:hover:not(:active):not(:disabled) svg{fill:currentcolor}.bpk-chip--on-dark-dismissible:active:not(:disabled) svg{fill:currentcolor}.bpk-chip--on-dark-dismissible__trailing-accessory-view{fill:#626971}.bpk-chip--on-dark-disabled{box-shadow:0 0 0 1px rgba(0,0,0,0) inset}.bpk-chip--default{background-color:var(--bpk-chip-default-background-color, transparent);color:var(--bpk-chip-default-text-color, rgb(22, 22, 22));box-shadow:0 0 0 1px #c1c7cf inset;box-shadow:0 0 0 1px var(--bpk-chip-default-border-color, rgb(193, 199, 207)) inset}.bpk-no-touch-support .bpk-chip--default:hover:not(:active):not(:disabled){background-color:var(--bpk-chip-default-hover-background-color, transparent);box-shadow:0 0 0 1px #05203c inset;box-shadow:0 0 0 1px var(--bpk-chip-default-hover-border-color, rgb(5, 32, 60)) inset}:global(.bpk-no-touch-support) .bpk-chip--default:hover:not(:active):not(:disabled){background-color:var(--bpk-chip-default-hover-background-color, transparent);box-shadow:0 0 0 1px #05203c inset;box-shadow:0 0 0 1px var(--bpk-chip-default-hover-border-color, rgb(5, 32, 60)) inset}.bpk-chip--default:active:not(:disabled){box-shadow:0 0 0 1px #05203c inset;box-shadow:0 0 0 1px var(--bpk-chip-default-active-border-color, rgb(5, 32, 60)) inset}.bpk-chip--default-selected{color:var(--bpk-chip-default-selected-text-color, rgb(255, 255, 255));background-color:var(--bpk-chip-default-selected-background-color, rgb(5, 32, 60));box-shadow:0 0 0 1px rgba(0,0,0,0) inset}.bpk-no-touch-support .bpk-chip--default-selected:hover:not(:active):not(:disabled){background-color:var(--bpk-chip-default-selected-hover-background-color, rgb(5, 32, 60));box-shadow:0 0 0 1px rgba(0,0,0,0) inset}:global(.bpk-no-touch-support) .bpk-chip--default-selected:hover:not(:active):not(:disabled){background-color:var(--bpk-chip-default-selected-hover-background-color, rgb(5, 32, 60));box-shadow:0 0 0 1px rgba(0,0,0,0) inset}.bpk-chip--default-selected:active:not(:disabled){background-color:var(--bpk-chip-default-selected-active-background-color, rgb(5, 32, 60));box-shadow:0 0 0 1px rgba(0,0,0,0) inset}.bpk-no-touch-support .bpk-chip--default-dismissible:hover:not(:active):not(:disabled) svg{fill:currentcolor}:global(.bpk-no-touch-support) .bpk-chip--default-dismissible:hover:not(:active):not(:disabled) svg{fill:currentcolor}.bpk-chip--default-dismissible:active:not(:disabled) svg{fill:currentcolor}.bpk-chip--default-dismissible__trailing-accessory-view{fill:hsla(0,0%,100%,.5)}.bpk-chip--default-disabled{box-shadow:0 0 0 1px rgba(0,0,0,0) inset}.bpk-chip--on-image{background-color:var(--bpk-chip-on-image-background-color, rgb(255, 255, 255));color:var(--bpk-chip-on-image-text-color, rgb(22, 22, 22));box-shadow:0px 1px 3px 0px rgba(37,32,31,.3)}.bpk-no-touch-support .bpk-chip--on-image:hover:not(:active):not(:disabled){background-color:var(--bpk-chip-on-image-hover-background-color, rgb(239, 243, 248))}:global(.bpk-no-touch-support) .bpk-chip--on-image:hover:not(:active):not(:disabled){background-color:var(--bpk-chip-on-image-hover-background-color, rgb(239, 243, 248))}.bpk-chip--on-image:active:not(:disabled){background-color:var(--bpk-chip-on-image-active-background-color, rgb(239, 243, 248))}.bpk-chip--on-image-selected{color:var(--bpk-chip-on-image-selected-text-color, rgb(255, 255, 255));background-color:var(--bpk-chip-on-image-selected-background-color, rgb(5, 32, 60))}.bpk-no-touch-support .bpk-chip--on-image-selected:hover:not(:active):not(:disabled){background-color:var(--bpk-chip-on-image-selected-hover-background-color, rgb(5, 32, 60))}:global(.bpk-no-touch-support) .bpk-chip--on-image-selected:hover:not(:active):not(:disabled){background-color:var(--bpk-chip-on-image-selected-hover-background-color, rgb(5, 32, 60))}.bpk-chip--on-image-selected:active:not(:disabled){background-color:var(--bpk-chip-on-image-selected-active-background-color, rgb(5, 32, 60))}.bpk-no-touch-support .bpk-chip--on-image-dismissible:hover:not(:active):not(:disabled) svg{fill:currentcolor}:global(.bpk-no-touch-support) .bpk-chip--on-image-dismissible:hover:not(:active):not(:disabled) svg{fill:currentcolor}.bpk-chip--on-image-dismissible:active:not(:disabled) svg{fill:currentcolor}.bpk-chip--on-image-dismissible__trailing-accessory-view{fill:hsla(0,0%,100%,.5)}.bpk-chip--on-image-disabled{box-shadow:0px 1px 3px 0px rgba(37,32,31,.3)}.bpk-chip--disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-chip--icon-only{padding-inline-end:.5rem;padding-inline-start:.5rem}.bpk-chip--icon-only__leading-accessory-view{margin-left:0;margin-right:0}html[dir=rtl] .bpk-chip--icon-only__leading-accessory-view{margin-left:0;margin-right:0}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-form-validation{position:relative;transform:translateY(-1rem);transition:opacity 200ms ease-in-out,transform 200ms ease-in-out;opacity:0;color
|
|
18
|
+
.bpk-form-validation{position:relative;transform:translateY(-1rem);transition:opacity 200ms ease-in-out,transform 200ms ease-in-out;opacity:0;color:var(--bpk-form-validation-text-color, rgb(231, 8, 102))}.bpk-form-validation__container{margin-top:.5rem;font-size:.75rem}.bpk-form-validation__icon{fill:var(--bpk-form-validation-icon-fill, rgb(231, 8, 102));margin-left:0;margin-right:.25rem}html[dir=rtl] .bpk-form-validation__icon{margin-left:.25rem;margin-right:0}.bpk-form-validation--appear{transform:translateY(0);opacity:1}.bpk-form-validation--is-checkbox{display:inline-block}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-horizontal-nav__item{display:inline-block;display:flex}.bpk-horizontal-nav__item--space-around{margin-right:auto;margin-left:auto}.bpk-horizontal-nav__link{display:inline-block;display:flex;padding:.875rem 1.5rem;border:0;border-radius:0;background:none;text-decoration:none;cursor:pointer;fill:currentcolor}.bpk-horizontal-nav__link:focus-visible{outline-offset:-0.125rem}.bpk-horizontal-nav__link--default{color
|
|
18
|
+
.bpk-horizontal-nav__item{display:inline-block;display:flex}.bpk-horizontal-nav__item--space-around{margin-right:auto;margin-left:auto}.bpk-horizontal-nav__link{display:inline-block;display:flex;padding:.875rem 1.5rem;border:0;border-radius:0;background:none;text-decoration:none;cursor:pointer;fill:currentcolor}.bpk-horizontal-nav__link:focus-visible{outline-offset:-0.125rem}.bpk-horizontal-nav__link--default{color:var(--bpk-horizontal-nav-link-color, rgb(98, 105, 113))}.bpk-no-touch-support .bpk-horizontal-nav__link--default:hover:not(:active):not(:disabled){box-shadow:0 -3px 0 0 #e0e4e9 inset;color:var(--bpk-horizontal-nav-link-hover-color, rgb(98, 105, 113))}:global(.bpk-no-touch-support) .bpk-horizontal-nav__link--default:hover:not(:active):not(:disabled){box-shadow:0 -3px 0 0 #e0e4e9 inset;color:var(--bpk-horizontal-nav-link-hover-color, rgb(98, 105, 113))}.bpk-horizontal-nav__link--default:active{box-shadow:0 -3px 0 0 #c1c7cf inset;color:var(--bpk-horizontal-nav-link-active-color, rgb(98, 105, 113))}.bpk-horizontal-nav__link--default-disabled{color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-horizontal-nav__link--default-disabled:active{color:rgba(0,0,0,.2);box-shadow:unset}.bpk-horizontal-nav__link--default-selected{box-shadow:0 -3px 0 0 #0062e3 inset;box-shadow:0 -3px 0 0 var(--bpk-horizontal-nav-bar-selected-color, rgb(0, 98, 227)) inset;color:var(--bpk-horizontal-nav-link-selected-color, rgb(0, 98, 227))}.bpk-no-touch-support .bpk-horizontal-nav__link--default-selected:hover:not(:active):not(:disabled){box-shadow:0 -3px 0 0 #0062e3 inset;box-shadow:0 -3px 0 0 var(--bpk-horizontal-nav-bar-selected-color, rgb(0, 98, 227)) inset}:global(.bpk-no-touch-support) .bpk-horizontal-nav__link--default-selected:hover:not(:active):not(:disabled){box-shadow:0 -3px 0 0 #0062e3 inset;box-shadow:0 -3px 0 0 var(--bpk-horizontal-nav-bar-selected-color, rgb(0, 98, 227)) inset}.bpk-horizontal-nav__link--default-selected:active{box-shadow:0 -3px 0 0 #0062e3 inset;box-shadow:0 -3px 0 0 var(--bpk-horizontal-nav-bar-selected-color, rgb(0, 98, 227)) inset}.bpk-horizontal-nav__link--light{color:#fff}.bpk-no-touch-support .bpk-horizontal-nav__link--light:hover:not(:active):not(:disabled){box-shadow:0 -3px 0 0 #fff inset}:global(.bpk-no-touch-support) .bpk-horizontal-nav__link--light:hover:not(:active):not(:disabled){box-shadow:0 -3px 0 0 #fff inset}.bpk-horizontal-nav__link--light:active{box-shadow:0 -3px 0 0 #fff inset}.bpk-horizontal-nav__link--light-disabled{color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-horizontal-nav__link--light-disabled:active{color:rgba(0,0,0,.2);box-shadow:unset}.bpk-horizontal-nav__link--light-selected{color:#fff;box-shadow:0 -3px 0 0 #fff inset}.bpk-no-touch-support .bpk-horizontal-nav__link--light-selected:hover:not(:active):not(:disabled){box-shadow:0 -3px 0 0 #fff inset}:global(.bpk-no-touch-support) .bpk-horizontal-nav__link--light-selected:hover:not(:active):not(:disabled){box-shadow:0 -3px 0 0 #fff inset}.bpk-horizontal-nav__link--light-selected:active{box-shadow:0 -3px 0 0 #fff inset}
|
|
@@ -26,10 +26,10 @@
|
|
|
26
26
|
* a single .figma.tsx file that maps every icon to its Figma component.
|
|
27
27
|
*
|
|
28
28
|
* Usage:
|
|
29
|
-
* FIGMA_ACCESS_TOKEN=<token> node packages/bpk-component-icon/scripts/generate-figma-connect.js
|
|
29
|
+
* FIGMA_ACCESS_TOKEN=<token> node packages/backpack-web/src/bpk-component-icon/scripts/generate-figma-connect.js
|
|
30
30
|
*
|
|
31
31
|
* The generated file is written to:
|
|
32
|
-
* packages/bpk-component-icon/BpkIcon.figma.tsx
|
|
32
|
+
* packages/backpack-web/src/bpk-component-icon/BpkIcon.figma.tsx
|
|
33
33
|
*/
|
|
34
34
|
const fs = require('fs');
|
|
35
35
|
const path = require('path');
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-input{display:inline-block;width:100%;height:2.25rem;padding:.5rem .5rem;border:solid .0625rem #c1c7cf;border-radius:.5rem;background:#fff;color:#161616;appearance:none}.bpk-input::placeholder{color:#626971}.bpk-input:disabled{border-color:#eff3f8;background:#fff;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-input[type=number]{-moz-appearance:textfield}.bpk-input[type=number]::-webkit-inner-spin-button,.bpk-input[type=number]::-webkit-outer-spin-button{appearance:none}html[dir=rtl] .bpk-input[type=number],html[dir=rtl] .bpk-input[type=tel],html[dir=rtl] .bpk-input[type=email]{text-align:right;direction:ltr}.bpk-input::-ms-clear{display:none}.bpk-input[data-openable]{cursor:pointer}.bpk-input__container{position:relative;display:inline-block;width:100%}.bpk-input__clear-button{display:none;position:absolute;right:.5rem;height:2.25rem;padding:0;border:0;background-color:rgba(0,0,0,0);color:#626971;cursor:pointer;appearance:none}html[dir=rtl] .bpk-input__clear-button{right:inherit;left:.5rem}.bpk-no-touch-support .bpk-input__clear-button:hover:not(:active):not(:disabled){color:#161616}:global(.bpk-no-touch-support) .bpk-input__clear-button:hover:not(:active):not(:disabled){color:#161616}.bpk-input__clear-button:active{color:#161616}.bpk-input__clear-button--large{right:1rem;height:3rem}html[dir=rtl] .bpk-input__clear-button--large{left:1rem}.bpk-input__clear-button--persistent{display:inherit}.bpk-input--valid{padding-right:2rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMGM4MzhhICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTEyIDIyLjVDNi4yMDEgMjIuNSAxLjUgMTcuNzk5IDEuNSAxMlM2LjIwMSAxLjUgMTIgMS41IDIyLjUgNi4yMDEgMjIuNSAxMiAxNy43OTkgMjIuNSAxMiAyMi41em01LjU2LTEyLjQ0YTEuNSAxLjUgMCAwIDAtMi4xMi0yLjEybC00Ljk0IDQuOTM5LTEuOTQtMS45NGExLjUgMS41IDAgMCAwLTIuMTIgMi4xMjJsMyAzYTEuNSAxLjUgMCAwIDAgMi4xMiAwbDYtNnoiLz48L3N2Zz4=") no-repeat right .5rem center;background-size:1rem 1rem}html[dir=rtl] .bpk-input--valid{padding-right:.5rem;padding-left:2rem;background-position:left .5rem center}.bpk-input--invalid{padding-right:2rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjZTcwODY2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTEyIDEuNUExMC41IDEwLjUgMCAxIDAgMjIuNSAxMiAxMC41IDEwLjUgMCAwIDAgMTIgMS41ek0xMiAxOGExLjUgMS41IDAgMSAxIDEuNS0xLjVBMS41IDEuNSAwIDAgMSAxMiAxOHptMS41LTZhMS41IDEuNSAwIDAgMS0zIDBWNy41YTEuNSAxLjUgMCAwIDEgMyAweiIvPjwvc3ZnPg==") no-repeat right .5rem center;background-size:1rem 1rem;border-color
|
|
18
|
+
.bpk-input{display:inline-block;width:100%;height:2.25rem;padding:.5rem .5rem;border:solid .0625rem #c1c7cf;border-radius:.5rem;background:#fff;color:#161616;appearance:none}.bpk-input::placeholder{color:#626971}.bpk-input:disabled{border-color:#eff3f8;background:#fff;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-input[type=number]{-moz-appearance:textfield}.bpk-input[type=number]::-webkit-inner-spin-button,.bpk-input[type=number]::-webkit-outer-spin-button{appearance:none}html[dir=rtl] .bpk-input[type=number],html[dir=rtl] .bpk-input[type=tel],html[dir=rtl] .bpk-input[type=email]{text-align:right;direction:ltr}.bpk-input::-ms-clear{display:none}.bpk-input[data-openable]{cursor:pointer}.bpk-input__container{position:relative;display:inline-block;width:100%}.bpk-input__clear-button{display:none;position:absolute;right:.5rem;height:2.25rem;padding:0;border:0;background-color:rgba(0,0,0,0);color:#626971;cursor:pointer;appearance:none}html[dir=rtl] .bpk-input__clear-button{right:inherit;left:.5rem}.bpk-no-touch-support .bpk-input__clear-button:hover:not(:active):not(:disabled){color:#161616}:global(.bpk-no-touch-support) .bpk-input__clear-button:hover:not(:active):not(:disabled){color:#161616}.bpk-input__clear-button:active{color:#161616}.bpk-input__clear-button--large{right:1rem;height:3rem}html[dir=rtl] .bpk-input__clear-button--large{left:1rem}.bpk-input__clear-button--persistent{display:inherit}.bpk-input--valid{padding-right:2rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMGM4MzhhICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTEyIDIyLjVDNi4yMDEgMjIuNSAxLjUgMTcuNzk5IDEuNSAxMlM2LjIwMSAxLjUgMTIgMS41IDIyLjUgNi4yMDEgMjIuNSAxMiAxNy43OTkgMjIuNSAxMiAyMi41em01LjU2LTEyLjQ0YTEuNSAxLjUgMCAwIDAtMi4xMi0yLjEybC00Ljk0IDQuOTM5LTEuOTQtMS45NGExLjUgMS41IDAgMCAwLTIuMTIgMi4xMjJsMyAzYTEuNSAxLjUgMCAwIDAgMi4xMiAwbDYtNnoiLz48L3N2Zz4=") no-repeat right .5rem center;background-size:1rem 1rem}html[dir=rtl] .bpk-input--valid{padding-right:.5rem;padding-left:2rem;background-position:left .5rem center}.bpk-input--invalid{padding-right:2rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjZTcwODY2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTEyIDEuNUExMC41IDEwLjUgMCAxIDAgMjIuNSAxMiAxMC41IDEwLjUgMCAwIDAgMTIgMS41ek0xMiAxOGExLjUgMS41IDAgMSAxIDEuNS0xLjVBMS41IDEuNSAwIDAgMSAxMiAxOHptMS41LTZhMS41IDEuNSAwIDAgMS0zIDBWNy41YTEuNSAxLjUgMCAwIDEgMyAweiIvPjwvc3ZnPg==") no-repeat right .5rem center;background-size:1rem 1rem;border-color:var(--bpk-input-invalid-border-color, rgb(231, 8, 102))}html[dir=rtl] .bpk-input--invalid{padding-right:.5rem;padding-left:2rem;background-position:left .5rem center}.bpk-input--clearable{padding-right:2rem}html[dir=rtl] .bpk-input--clearable{padding-right:.5rem;padding-left:2rem}.bpk-input--clearable:focus{background:#fff}.bpk-input--clearable:focus+.bpk-input__clear-button{display:inherit}.bpk-input--large{height:3rem;padding-right:1rem;padding-left:1rem;border-radius:.75rem}.bpk-input--large.bpk-input--valid,.bpk-input--large.bpk-input--invalid,.bpk-input--large.bpk-input--clearable{padding-right:2.5rem;background-position:right 1rem center}html[dir=rtl] .bpk-input--large.bpk-input--valid,html[dir=rtl] .bpk-input--large.bpk-input--invalid,html[dir=rtl] .bpk-input--large.bpk-input--clearable{padding-right:1rem;padding-left:2.5rem;background-position:left 1rem center}.bpk-input--persistent-clearable{background:#fff}.bpk-input--docked:first-child{border-right-width:0;border-radius:.5rem 0 0 .5rem}html[dir=rtl] .bpk-input--docked:first-child{border-right-width:.0625rem;border-left-width:0;border-radius:0 .5rem .5rem 0}.bpk-input--docked:first-child:focus{position:relative}.bpk-input--docked:last-child{border-radius:0 .5rem .5rem 0}html[dir=rtl] .bpk-input--docked:last-child{border-radius:.5rem 0 0 .5rem}.bpk-input--docked:last-child:focus{position:relative}.bpk-input--docked:not(:first-child):not(:last-child){border-right-width:0;border-radius:0}html[dir=rtl] .bpk-input--docked:not(:first-child):not(:last-child){border-right-width:.0625rem;border-left-width:0}.bpk-input--docked:not(:first-child):not(:last-child):focus{position:relative}.bpk-input--docked-first{border-right-width:0;border-radius:.5rem 0 0 .5rem}html[dir=rtl] .bpk-input--docked-first{border-right-width:.0625rem;border-left-width:0;border-radius:0 .5rem .5rem 0}.bpk-input--docked-first:focus{position:relative}.bpk-input--docked-middle{border-right-width:0;border-radius:0}html[dir=rtl] .bpk-input--docked-middle{border-right-width:.0625rem;border-left-width:0}.bpk-input--docked-middle:focus{position:relative}.bpk-input--docked-last{border-radius:0 .5rem .5rem 0}html[dir=rtl] .bpk-input--docked-last{border-radius:.5rem 0 0 .5rem}.bpk-input--docked-last:focus{position:relative}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-label{display:block;color:#161616;font-size:.75rem;font-weight:700;line-height:1rem}.bpk-label--white{color:#fff}.bpk-label--invalid{color
|
|
18
|
+
.bpk-label{display:block;color:#161616;font-size:.75rem;font-weight:700;line-height:1rem}.bpk-label--white{color:#fff}.bpk-label--invalid{color:var(--bpk-form-validation-text-color, rgb(231, 8, 102))}.bpk-label--disabled{color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-label--disabled--white{color:hsla(0,0%,100%,.5)}.bpk-label__asterisk{color:var(--bpk-form-validation-text-color, rgb(231, 8, 102))}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-link{position:relative;display:inline;padding:0;border:0;background-color:rgba(0,0,0,0);text-decoration:none;cursor:pointer;appearance:none;color
|
|
18
|
+
.bpk-link{position:relative;display:inline;padding:0;border:0;background-color:rgba(0,0,0,0);text-decoration:none;cursor:pointer;appearance:none;color:var(--bpk-link-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-link:hover:not(:active):not(:disabled){text-decoration:none;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-link:hover:not(:active):not(:disabled){text-decoration:none;color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-link:visited{color:var(--bpk-link-visited-color, rgb(22, 22, 22))}.bpk-link:active{color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-link--active{color:#161616}.bpk-link--active:visited{color:#161616}.bpk-link--active:active{color:#161616}.bpk-link--implicit{color:var(--bpk-link-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-link--implicit:hover:not(:active):not(:disabled){color:var(--bpk-link-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-link--implicit:hover:not(:active):not(:disabled){color:var(--bpk-link-hover-color, rgb(22, 22, 22))}.bpk-link--implicit:active{text-decoration:none;color:var(--bpk-link-active-color, rgb(22, 22, 22))}.bpk-link--alternate{color:var(--bpk-link-alternate-color, rgb(255, 255, 255))}.bpk-no-touch-support .bpk-link--alternate:hover:not(:active):not(:disabled){color:var(--bpk-link-alternate-hover-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-link--alternate:hover:not(:active):not(:disabled){color:var(--bpk-link-alternate-hover-color, rgb(255, 255, 255))}.bpk-link--alternate:visited{color:var(--bpk-link-alternate-visited-color, rgb(255, 255, 255))}.bpk-link--alternate:active{color:var(--bpk-link-alternate-active-color, rgb(255, 255, 255))}.bpk-link-underlined{padding-bottom:.0625rem;transition:background-size 200ms ease;background:linear-gradient(rgb(22, 22, 22), rgb(22, 22, 22));background-repeat:no-repeat;background-position:0 100%;background-size:100% 1px}.bpk-no-touch-support .bpk-link-underlined:hover:not(:active):not(:disabled){background-size:0 1px}:global(.bpk-no-touch-support) .bpk-link-underlined:hover:not(:active):not(:disabled){background-size:0 1px}.bpk-link-underlined--implicit{background-size:0 1px}.bpk-no-touch-support .bpk-link-underlined--implicit:hover:not(:active):not(:disabled){background-size:100% 1px}:global(.bpk-no-touch-support) .bpk-link-underlined--implicit:hover:not(:active):not(:disabled){background-size:100% 1px}.bpk-link-underlined--alternate{background:linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255));background-repeat:no-repeat;background-position:0 100%;background-size:100% 1px}.bpk-no-touch-support .bpk-link-underlined--alternate:hover:not(:active):not(:disabled){background-size:0 1px}:global(.bpk-no-touch-support) .bpk-link-underlined--alternate:hover:not(:active):not(:disabled){background-size:0 1px}.bpk-link-underlined-implicit--alternate{background:linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255));background-repeat:no-repeat;background-position:0 100%;background-size:0 1px}.bpk-no-touch-support .bpk-link-underlined-implicit--alternate:hover:not(:active):not(:disabled){background-size:100% 1px}:global(.bpk-no-touch-support) .bpk-link-underlined-implicit--alternate:hover:not(:active):not(:disabled){background-size:100% 1px}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-icon-marker__wrapper{position:absolute;top:-32px;left:-13px;z-index:1;padding:16px 13px;border:none;background:none}.bpk-icon-marker__wrapper--selected{top:-40px;left:-16px;z-index:2;padding:20px 16px}.bpk-icon-marker__icon{position:absolute;top:4.8px;left:5px;color:#fff}html[dir=rtl] .bpk-icon-marker__icon{transform:scaleX(-1)}.bpk-icon-marker__icon>svg{position:absolute;width:16px !important;height:16px !important;fill:currentcolor}.bpk-icon-marker__icon--interactive{cursor:pointer}.bpk-icon-marker__icon--selected{top:8px;left:8px;color
|
|
18
|
+
.bpk-icon-marker__wrapper{position:absolute;top:-32px;left:-13px;z-index:1;padding:16px 13px;border:none;background:none}.bpk-icon-marker__wrapper--selected{top:-40px;left:-16px;z-index:2;padding:20px 16px}.bpk-icon-marker__icon{position:absolute;top:4.8px;left:5px;color:#fff}html[dir=rtl] .bpk-icon-marker__icon{transform:scaleX(-1)}.bpk-icon-marker__icon>svg{position:absolute;width:16px !important;height:16px !important;fill:currentcolor}.bpk-icon-marker__icon--interactive{cursor:pointer}.bpk-icon-marker__icon--selected{top:8px;left:8px;color:var(--bpk-icon-marker-default-selected-color, rgb(255, 255, 255))}html[dir=rtl] .bpk-icon-marker__icon--selected{transform:scaleX(-1)}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-icon-marker-background{position:absolute;top:0;left:0;fill
|
|
18
|
+
.bpk-icon-marker-background{position:absolute;top:0;left:0;fill:var(--bpk-icon-marker-default-background-color, rgb(142, 71, 186))}.bpk-icon-marker-background--interactive{cursor:pointer}.bpk-icon-marker-background--disabled{fill:var(--bpk-icon-marker-default-disabled-background-color, rgb(212, 255, 242))}.bpk-icon-marker-background--selected{fill:#05203c;stroke:var(--bpk-icon-marker-default-selected-color, rgb(5, 32, 60))}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-navigation-bar{position:relative;display:grid;min-height:3.5rem;padding:1rem;grid-template-rows:auto;grid-template-columns:minmax(1.5rem, auto) minmax(1rem, 1fr) minmax(1.5rem, auto);justify-content:space-between;align-items:center;gap:1rem;background-color
|
|
18
|
+
.bpk-navigation-bar{position:relative;display:grid;min-height:3.5rem;padding:1rem;grid-template-rows:auto;grid-template-columns:minmax(1.5rem, auto) minmax(1rem, 1fr) minmax(1.5rem, auto);justify-content:space-between;align-items:center;gap:1rem;background-color:var(--bpk-navigation-bar-background-color, rgb(255, 255, 255))}.bpk-navigation-bar--on-dark{background-color:#05203c}.bpk-navigation-bar__title{grid-column:2;text-align:center;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;color:var(--bpk-navigation-bar-title-color, rgb(22, 22, 22))}.bpk-navigation-bar__title :first-child{display:inline}.bpk-navigation-bar__title--on-dark{color:#fff}.bpk-navigation-bar__title--wrap{text-overflow:unset;white-space:normal;overflow:visible}.bpk-navigation-bar__title-container{justify-self:center}.bpk-navigation-bar__leading-item,.bpk-navigation-bar__trailing-item{font-size:.875rem;line-height:1.25rem;font-weight:700}.bpk-navigation-bar__leading-item{grid-column:1;justify-self:start}.bpk-navigation-bar__trailing-item{grid-column:3;justify-self:end}.bpk-navigation-bar__sticky{position:sticky;top:0;z-index:899;box-shadow:0px 1px 3px 0px rgba(37,32,31,.3)}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-navigation-bar-icon-button{color
|
|
18
|
+
.bpk-navigation-bar-icon-button{color:var(--bpk-navigation-bar-icon-button-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-navigation-bar-icon-button:hover:not(:active):not(:disabled){color:var(--bpk-navigation-bar-icon-button-hover-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-navigation-bar-icon-button:hover:not(:active):not(:disabled){color:var(--bpk-navigation-bar-icon-button-hover-color, rgb(22, 22, 22))}.bpk-navigation-bar-icon-button:active{color:var(--bpk-navigation-bar-icon-button-active-color, rgb(22, 22, 22))}.bpk-navigation-bar-icon-button--on-dark{color:#fff}.bpk-no-touch-support .bpk-navigation-bar-icon-button--on-dark:hover:not(:active):not(:disabled){color:#fff}:global(.bpk-no-touch-support) .bpk-navigation-bar-icon-button--on-dark:hover:not(:active):not(:disabled){color:#fff}.bpk-navigation-bar-icon-button--on-dark:active{color:#fff}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-pagination-page{display:inline-block;min-height:2.25rem;margin:0;padding:.375rem 1rem;border:0;text-align:center;text-decoration:none;cursor:pointer;vertical-align:middle;user-select:none;border-radius
|
|
18
|
+
.bpk-pagination-page{display:inline-block;min-height:2.25rem;margin:0;padding:.375rem 1rem;border:0;text-align:center;text-decoration:none;cursor:pointer;vertical-align:middle;user-select:none;border-radius:var(--bpk-button-border-radius, 0.5rem);font-size:1rem;line-height:1.5rem;font-weight:700;color:var(--bpk-button-primary-text-color, rgb(255, 255, 255));background-color:var(--bpk-button-primary-background-color, rgb(5, 32, 60))}.bpk-no-touch-support .bpk-pagination-page:hover:not(:active):not(:disabled){background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}:global(.bpk-no-touch-support) .bpk-pagination-page:hover:not(:active):not(:disabled){background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}.bpk-pagination-page:active{color:var(--bpk-button-primary-active-text-color, rgb(255, 255, 255));background-color:var(--bpk-button-primary-active-background-color, rgb(21, 70, 121))}.bpk-pagination-page:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-pagination-page.bpk-button--loading:disabled{background-color:var(--bpk-button-primary-hover-background-color, rgb(21, 70, 121));color:var(--bpk-button-primary-hover-text-color, rgb(255, 255, 255))}.bpk-no-touch-support .bpk-pagination-page:hover:not(:active):not(:disabled){background-color:rgba(0,0,0,0);color:#161616;box-shadow:0 0 0 1px #05203c inset}:global(.bpk-no-touch-support) .bpk-pagination-page:hover:not(:active):not(:disabled){background-color:rgba(0,0,0,0);color:#161616;box-shadow:0 0 0 1px #05203c inset}.bpk-pagination-page--not-selected{color:var(--bpk-button-primary-on-dark-text-color, rgb(22, 22, 22));background-color:var(--bpk-button-primary-on-dark-background-color, rgb(255, 255, 255));box-shadow:0 0 0 1px var(--bpk-pagination-selected-background-color, rgb(193, 199, 207)) inset}.bpk-no-touch-support .bpk-pagination-page--not-selected:hover:not(:active):not(:disabled){background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}:global(.bpk-no-touch-support) .bpk-pagination-page--not-selected:hover:not(:active):not(:disabled){background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}.bpk-pagination-page--not-selected:active{color:var(--bpk-button-primary-on-dark-active-text-color, rgb(22, 22, 22));background-color:var(--bpk-button-primary-on-dark-active-background-color, rgb(193, 199, 207))}.bpk-pagination-page--not-selected:disabled{background-color:#e0e4e9;color:rgba(0,0,0,.2)}.bpk-pagination-page--not-selected.bpk-button--loading:disabled{background-color:var(--bpk-button-primary-on-dark-hover-background-color, rgb(193, 199, 207));color:var(--bpk-button-primary-on-dark-hover-text-color, rgb(22, 22, 22))}.bpk-no-touch-support .bpk-pagination-page--not-selected:hover:not(:active):not(:disabled){background-color:rgba(0,0,0,0);color:#161616}:global(.bpk-no-touch-support) .bpk-pagination-page--not-selected:hover:not(:active):not(:disabled){background-color:rgba(0,0,0,0);color:#161616}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-progress{position:relative;height:1rem;border-radius:.75rem;background-color:#e0e4e9;overflow:hidden}.bpk-progress--small{height:.5rem;border-radius:.25rem}.bpk-progress__value{position:absolute;top:0;right:0;bottom:0;left:0;content:" ";width:0;transition:width 400ms ease-in-out;border-radius:.5rem;background-color
|
|
18
|
+
.bpk-progress{position:relative;height:1rem;border-radius:.75rem;background-color:#e0e4e9;overflow:hidden}.bpk-progress--small{height:.5rem;border-radius:.25rem}.bpk-progress__value{position:absolute;top:0;right:0;bottom:0;left:0;content:" ";width:0;transition:width 400ms ease-in-out;border-radius:.5rem;background-color:var(--bpk-progress-bar-fill-color, rgb(0, 98, 227))}.bpk-progress__value--stepped{border-radius:0}.bpk-progress__step{position:absolute;top:0;bottom:0;width:.125rem;background:#fff}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-radio{position:relative;display:inline-block;padding-left:1.75rem}html[dir=rtl] .bpk-radio{padding-right:1.75rem;padding-left:0}.bpk-radio--white{color:#fff}.bpk-radio--white input[type=radio]{background:#fff}.bpk-radio--disabled{color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-radio--disabled--white{color:hsla(0,0%,100%,.5)}.bpk-radio--invalid input[type=radio]{border:3px solid #e70866;border-radius:1.5rem}.bpk-radio__input{position:absolute;top:0;left:0;width:1.25rem;height:1.25rem;margin:0;padding:0;cursor:pointer;vertical-align:text-bottom;appearance:none;border:3px solid #626971;border-radius:1.5rem}html[dir=rtl] .bpk-radio__input{right:0;left:auto}@media screen\0 {.bpk-radio__input{background:none !important}}.bpk-radio__input:checked{border-color
|
|
18
|
+
.bpk-radio{position:relative;display:inline-block;padding-left:1.75rem}html[dir=rtl] .bpk-radio{padding-right:1.75rem;padding-left:0}.bpk-radio--white{color:#fff}.bpk-radio--white input[type=radio]{background:#fff}.bpk-radio--disabled{color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-radio--disabled--white{color:hsla(0,0%,100%,.5)}.bpk-radio--invalid input[type=radio]{border:3px solid #e70866;border-radius:1.5rem}.bpk-radio__input{position:absolute;top:0;left:0;width:1.25rem;height:1.25rem;margin:0;padding:0;cursor:pointer;vertical-align:text-bottom;appearance:none;border:3px solid #626971;border-radius:1.5rem}html[dir=rtl] .bpk-radio__input{right:0;left:auto}@media screen\0 {.bpk-radio__input{background:none !important}}.bpk-radio__input:checked{border-color:var(--bpk-radio-checked-color, rgb(0, 98, 227))}.bpk-radio__input:checked:disabled{border-color:rgba(0,0,0,.2)}.bpk-radio__input:disabled{border-color:rgba(0,0,0,.2)}.bpk-radio__input:disabled{cursor:inherit}.bpk-radio__input:checked+.bpk-radio__circle{display:block}.bpk-radio__input:checked:disabled+.bpk-radio__circle{display:block;background:rgba(0,0,0,.2)}.bpk-radio__circle{position:absolute;top:.375rem;left:.375rem;display:none;width:.5rem;height:.5rem;border-radius:50%;background:var(--bpk-radio-checked-color, rgb(0, 98, 227))}html[dir=rtl] .bpk-radio__circle{right:.375rem;left:auto}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-select{display:inline-block;width:100%;height:2.25rem;padding:.375rem .5rem;padding-right:2rem;border:solid .0625rem #c1c7cf;border-radius:.5rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMTYxNjE2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right .5rem center;background-size:1.125rem;color:#161616;line-height:1.375rem;appearance:none}html[dir=rtl] .bpk-select{padding-right:.5rem;padding-left:2rem;background-position:left .5rem center}@media screen\0 {.bpk-select{padding:.5rem !important;background-image:none !important}}.bpk-select:disabled{border-color:#e0e4e9;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMDAwMDAwICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right .5rem center;background-size:1.125rem;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-select--large{height:3rem;padding:.5rem 1rem;padding-right:2.5rem;border-radius:.75rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMTYxNjE2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right 1rem center}html[dir=rtl] .bpk-select--large{padding-right:1rem;padding-left:2.5rem;background-position:left 1rem center}.bpk-select--docked:first-child{border-right-width:0;border-radius:.5rem 0 0 .5rem}html[dir=rtl] .bpk-select--docked:first-child{border-right-width:.0625rem;border-left-width:0;border-radius:0 .5rem .5rem 0}.bpk-select--docked:last-child{border-radius:0 .5rem .5rem 0}html[dir=rtl] .bpk-select--docked:last-child{border-radius:.5rem 0 0 .5rem}.bpk-select--docked:not(:first-child):not(:last-child){border-right-width:0;border-radius:0}html[dir=rtl] .bpk-select--docked:not(:first-child):not(:last-child){border-right-width:.0625rem;border-left-width:0}.bpk-select--docked-first{border-right-width:0;border-radius:.5rem 0 0 .5rem}html[dir=rtl] .bpk-select--docked-first{border-right-width:.0625rem;border-left-width:0;border-radius:0 .5rem .5rem 0}.bpk-select--docked-middle{border-right-width:0;border-radius:0}html[dir=rtl] .bpk-select--docked-middle{border-right-width:.0625rem;border-left-width:0}.bpk-select--docked-last{border-radius:0 .5rem .5rem 0}html[dir=rtl] .bpk-select--docked-last{border-radius:.5rem 0 0 .5rem}.bpk-select--invalid{padding-right:2rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMTYxNjE2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right .5rem center;background-size:1.125rem;border-color
|
|
18
|
+
.bpk-select{display:inline-block;width:100%;height:2.25rem;padding:.375rem .5rem;padding-right:2rem;border:solid .0625rem #c1c7cf;border-radius:.5rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMTYxNjE2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right .5rem center;background-size:1.125rem;color:#161616;line-height:1.375rem;appearance:none}html[dir=rtl] .bpk-select{padding-right:.5rem;padding-left:2rem;background-position:left .5rem center}@media screen\0 {.bpk-select{padding:.5rem !important;background-image:none !important}}.bpk-select:disabled{border-color:#e0e4e9;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMDAwMDAwICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right .5rem center;background-size:1.125rem;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-select--large{height:3rem;padding:.5rem 1rem;padding-right:2.5rem;border-radius:.75rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMTYxNjE2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right 1rem center}html[dir=rtl] .bpk-select--large{padding-right:1rem;padding-left:2.5rem;background-position:left 1rem center}.bpk-select--docked:first-child{border-right-width:0;border-radius:.5rem 0 0 .5rem}html[dir=rtl] .bpk-select--docked:first-child{border-right-width:.0625rem;border-left-width:0;border-radius:0 .5rem .5rem 0}.bpk-select--docked:last-child{border-radius:0 .5rem .5rem 0}html[dir=rtl] .bpk-select--docked:last-child{border-radius:.5rem 0 0 .5rem}.bpk-select--docked:not(:first-child):not(:last-child){border-right-width:0;border-radius:0}html[dir=rtl] .bpk-select--docked:not(:first-child):not(:last-child){border-right-width:.0625rem;border-left-width:0}.bpk-select--docked-first{border-right-width:0;border-radius:.5rem 0 0 .5rem}html[dir=rtl] .bpk-select--docked-first{border-right-width:.0625rem;border-left-width:0;border-radius:0 .5rem .5rem 0}.bpk-select--docked-middle{border-right-width:0;border-radius:0}html[dir=rtl] .bpk-select--docked-middle{border-right-width:.0625rem;border-left-width:0}.bpk-select--docked-last{border-radius:0 .5rem .5rem 0}html[dir=rtl] .bpk-select--docked-last{border-radius:.5rem 0 0 .5rem}.bpk-select--invalid{padding-right:2rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjMTYxNjE2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTE2LjUzNyA4LjI1SDcuNDYzYTEuMzU4IDEuMzU4IDAgMCAwLTEuMTEgMi4yNTFsNC4zNTQgNC43N2ExLjUzIDEuNTMgMCAwIDAgMi4xODQuMDRsNC43MTgtNC43N2ExLjM1NyAxLjM1NyAwIDAgMC0xLjA3Mi0yLjI5MXoiLz48L3N2Zz4=") no-repeat right .5rem center;background-size:1.125rem;border-color:var(--bpk-select-invalid-border-color, rgb(231, 8, 102))}html[dir=rtl] .bpk-select--invalid{padding-right:.5rem;padding-left:2rem;background-position:left .5rem center}.bpk-select--with-image{padding-left:2.5rem}html[dir=rtl] .bpk-select--with-image{padding-right:2.5rem;padding-left:2.5rem}@media screen\0 {html[dir=rtl] .bpk-select--with-image{padding-right:2.5rem !important;padding-left:1rem !important}}@media screen\0 {.bpk-select--with-image{padding-left:2.5rem !important}}.bpk-select--with-image-large{padding-left:3.5rem}html[dir=rtl] .bpk-select--with-image-large{padding-right:3.5rem;padding-left:2.5rem}@media screen\0 {html[dir=rtl] .bpk-select--with-image-large{padding-right:2.75rem !important;padding-left:1rem !important}}@media screen\0 {.bpk-select--with-image-large{padding-left:2.75rem !important}}.bpk-select-wrapper{position:relative}.bpk-select-wrapper__image{position:absolute;top:.625rem;left:.5rem;width:1.5rem;height:1rem;pointer-events:none}html[dir=rtl] .bpk-select-wrapper__image{right:.5rem;left:auto}.bpk-select-wrapper__image--large{top:.75rem;left:1rem;width:2rem;height:1.5rem}html[dir=rtl] .bpk-select-wrapper__image--large{right:1rem;left:auto}.bpk-select-wrapper__image--disabled{opacity:.5}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-skip-link{padding:.75rem 1rem;transition:opacity 200ms ease-in-out;border-radius:.5rem;color:#fff;text-decoration:none;opacity:0;overflow:hidden;pointer-events:none;transition-delay:200ms;font-size:1rem;line-height:1.25rem;font-weight:700;background-color
|
|
18
|
+
.bpk-skip-link{padding:.75rem 1rem;transition:opacity 200ms ease-in-out;border-radius:.5rem;color:#fff;text-decoration:none;opacity:0;overflow:hidden;pointer-events:none;transition-delay:200ms;font-size:1rem;line-height:1.25rem;font-weight:700;background-color:var(--bpk-skip-link-background-color, rgb(231, 8, 102))}.bpk-skip-link:focus-within,.bpk-skip-link:focus{transition:none;opacity:1;transition-delay:0s}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
@keyframes bpk-keyframe-spin{100%{transform:rotate(1turn)}}.bpk-spinner{display:block;width:1rem;height:1rem;animation:bpk-keyframe-spin 600ms linear infinite}.bpk-spinner--primary{fill
|
|
18
|
+
@keyframes bpk-keyframe-spin{100%{transform:rotate(1turn)}}.bpk-spinner{display:block;width:1rem;height:1rem;animation:bpk-keyframe-spin 600ms linear infinite}.bpk-spinner--primary{fill:var(--bpk-spinner-primary-color, rgb(0, 98, 227))}.bpk-spinner--light{fill:#fff}.bpk-spinner--dark{fill:#161616}.bpk-spinner--large{width:1.5rem;height:1.5rem}.bpk-spinner--extra-large{width:2rem;height:2rem}.bpk-spinner--align-to-button{vertical-align:baseline}.bpk-spinner--align-to-large-button{margin-top:0rem;vertical-align:top}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-star{display:inline-flex;width:1rem;height:1rem;vertical-align:text-bottom;fill:rgba(0,0,0,.2)}.bpk-star--large{width:1.5rem;height:1.5rem;vertical-align:bottom}.bpk-star--extra-large{width:3rem;height:3rem;vertical-align:bottom}.bpk-star--half{position:absolute;left:0}.bpk-star--filled{fill
|
|
18
|
+
.bpk-star{display:inline-flex;width:1rem;height:1rem;vertical-align:text-bottom;fill:rgba(0,0,0,.2)}.bpk-star--large{width:1.5rem;height:1.5rem;vertical-align:bottom}.bpk-star--extra-large{width:3rem;height:3rem;vertical-align:bottom}.bpk-star--half{position:absolute;left:0}.bpk-star--filled{fill:var(--bpk-star-rating-filled-color, rgb(245, 93, 66))}.bpk-star__container{display:inline-flex;width:1rem;height:1rem}.bpk-star__container--half-star{position:relative;vertical-align:text-bottom}.bpk-star__container--large{width:1.5rem;height:1.5rem;vertical-align:bottom}.bpk-star__container--extra-large{width:3rem;height:3rem;vertical-align:bottom}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-switch{position:relative;display:flex;width:fit-content;align-items:center;border-radius:1rem}.bpk-switch__checkbox{position:absolute;opacity:0}.bpk-switch__checkbox:checked~.bpk-switch__switch{background
|
|
18
|
+
.bpk-switch{position:relative;display:flex;width:fit-content;align-items:center;border-radius:1rem}.bpk-switch__checkbox{position:absolute;opacity:0}.bpk-switch__checkbox:checked~.bpk-switch__switch{background:var(--bpk-switch-checked-color, rgb(0, 98, 227))}.bpk-switch__checkbox:checked~.bpk-switch__switch::before{left:1.375rem}.bpk-switch__checkbox:focus-visible~.bpk-switch__switch{outline:.125rem solid #0062e3;outline-offset:.125rem}.bpk-switch__switch{position:relative;float:right;display:block;min-width:3.25rem;height:2rem;transition:background 200ms linear;border-radius:1rem;background:rgba(0,0,0,.2);cursor:pointer}.bpk-switch__switch::before{position:absolute;top:.125rem;left:.125rem;content:"";display:block;width:1.75rem;height:1.75rem;transition:left 200ms ease-out;border-radius:50%;background:#fff;box-shadow:0px 1px 3px 0px rgba(37,32,31,.3)}.bpk-switch__switch--small{min-width:2.5rem;height:1.25rem}.bpk-switch__switch--small::before{width:1rem;height:1rem}.bpk-switch__switch--on-contrast{background:hsla(0,0%,100%,.2)}
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-textarea{display:inline-block;width:100%;max-width:100%;min-height:5.5rem;padding:.5rem .5rem;border:solid .0625rem #c1c7cf;border-radius:.5rem;background:#fff;color:#161616;appearance:none}.bpk-textarea::placeholder{color:#626971}.bpk-textarea:disabled{border-color:#eff3f8;background:#fff;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-textarea::-ms-clear{display:none}.bpk-textarea--invalid{padding-right:2rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjZTcwODY2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTEyIDEuNUExMC41IDEwLjUgMCAxIDAgMjIuNSAxMiAxMC41IDEwLjUgMCAwIDAgMTIgMS41ek0xMiAxOGExLjUgMS41IDAgMSAxIDEuNS0xLjVBMS41IDEuNSAwIDAgMSAxMiAxOHptMS41LTZhMS41IDEuNSAwIDAgMS0zIDBWNy41YTEuNSAxLjUgMCAwIDEgMyAweiIvPjwvc3ZnPg==") no-repeat right .5rem center;border-color
|
|
18
|
+
.bpk-textarea{display:inline-block;width:100%;max-width:100%;min-height:5.5rem;padding:.5rem .5rem;border:solid .0625rem #c1c7cf;border-radius:.5rem;background:#fff;color:#161616;appearance:none}.bpk-textarea::placeholder{color:#626971}.bpk-textarea:disabled{border-color:#eff3f8;background:#fff;color:rgba(0,0,0,.2);cursor:not-allowed}.bpk-textarea::-ms-clear{display:none}.bpk-textarea--invalid{padding-right:2rem;background:#fff url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48c3R5bGUgdHlwZT0idGV4dC9jc3MiPmNpcmNsZSwgZWxsaXBzZSwgbGluZSwgcGF0aCwgcG9seWdvbiwgcG9seWxpbmUsIHJlY3QsIHRleHQgeyBmaWxsOiAjZTcwODY2ICFpbXBvcnRhbnQgfTwvc3R5bGU+PHBhdGggZD0iTTEyIDEuNUExMC41IDEwLjUgMCAxIDAgMjIuNSAxMiAxMC41IDEwLjUgMCAwIDAgMTIgMS41ek0xMiAxOGExLjUgMS41IDAgMSAxIDEuNS0xLjVBMS41IDEuNSAwIDAgMSAxMiAxOHptMS41LTZhMS41IDEuNSAwIDAgMS0zIDBWNy41YTEuNSAxLjUgMCAwIDEgMyAweiIvPjwvc3ZnPg==") no-repeat right .5rem center;border-color:var(--bpk-textarea-invalid-border-color, rgb(231, 8, 102))}html[dir=rtl] .bpk-textarea--invalid{padding-right:.5rem;padding-left:2rem;background-position:left .5rem center}html[dir=rtl] .bpk-textarea--invalid.bpk-textarea--large{padding-right:1rem;padding-left:2.5rem;background-position:right 1rem center}.bpk-textarea--large{min-height:6rem;padding-right:1rem;padding-left:1rem;border-radius:.75rem}.bpk-textarea--large.bpk-textarea--invalid{padding-right:2.5rem;background-position:right 1rem center}html[dir=rtl] .bpk-textarea--large.bpk-textarea--invalid{padding-right:1rem;padding-left:2.5rem;background-position:left 1rem center}
|
package/bpk-mixins/_utils.scss
CHANGED
|
@@ -186,9 +186,15 @@
|
|
|
186
186
|
}
|
|
187
187
|
}
|
|
188
188
|
|
|
189
|
-
/// Create a Backpack themeable property
|
|
190
|
-
/// fallback
|
|
191
|
-
///
|
|
189
|
+
/// Create a Backpack themeable property. Emits a single `var()` declaration
|
|
190
|
+
/// with an inline SCSS fallback used when the CSS variable is not defined at
|
|
191
|
+
/// runtime.
|
|
192
|
+
///
|
|
193
|
+
/// Previously this mixin emitted two declarations — a bare SCSS fallback
|
|
194
|
+
/// followed by the `var()` form — to support browsers without CSS custom
|
|
195
|
+
/// properties. Those browsers (IE 11 and earlier) are no longer supported, so
|
|
196
|
+
/// the duplicate declaration is dropped to roughly halve the bytes emitted at
|
|
197
|
+
/// every callsite.
|
|
192
198
|
///
|
|
193
199
|
/// @content
|
|
194
200
|
///
|
|
@@ -198,7 +204,6 @@
|
|
|
198
204
|
/// }
|
|
199
205
|
|
|
200
206
|
@mixin bpk-themeable-property($property, $variableName, $fallback) {
|
|
201
|
-
#{$property}: $fallback;
|
|
202
207
|
#{$property}: var($variableName, $fallback);
|
|
203
208
|
}
|
|
204
209
|
|
package/bpk-stylesheets/base.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
/*!
|
|
2
2
|
*
|
|
3
3
|
* Backpack - Skyscanner's Design System
|
|
4
4
|
*
|
|
@@ -16,4 +16,4 @@
|
|
|
16
16
|
* See the License for the specific language governing permissions and
|
|
17
17
|
* limitations under the License.
|
|
18
18
|
*
|
|
19
|
-
*//*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}progress{vertical-align:baseline}template,[hidden]{display:none}a{background-color:rgba(0,0,0,0);-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}button,input,optgroup,select,textarea{font:inherit;margin:0}optgroup{font-weight:bold}button,input{overflow:visible}button,select{text-transform:none}button,html [type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}html{font-size:100%;box-sizing:border-box}*{box-sizing:inherit}*::before,*::after{box-sizing:inherit}body{color:#161616;font-family:var(--bpk-base-font-stack, "Skyscanner Relative", -apple-system, BlinkMacSystemFont, "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif);font-size:1rem;line-height:1.3rem}body.scaffold-font-size{font-size:13px}body.enable-font-smoothing{-webkit-font-smoothing:antialiased}:focus-visible,button:focus-visible,[type=button]:focus-visible,[type=reset]:focus-visible,[type=submit]:focus-visible{outline:.125rem solid #0062e3;outline-offset:.125rem}.hidden,.hide{display:none !important}.visuallyhidden,.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;white-space:nowrap;overflow:hidden;clip:rect(0 0 0 0)}.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus,.visually-hidden.focusable:active,.visually-hidden.focusable:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.invisible{visibility:hidden}.clearfix::before,.clearfix::after{content:"";display:table}.clearfix::after{clear:both}
|
|
19
|
+
*//*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}progress{vertical-align:initial}[hidden],template{display:none}a{background-color:#0000;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit;font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background-color:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:initial;height:0;overflow:visible}button,input,optgroup,select,textarea{font:inherit;margin:0}optgroup{font-weight:700}button,input{overflow:visible}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}html{box-sizing:border-box;font-size:100%}*,:after,:before{box-sizing:inherit}body{color:#161616;font-family:var(--bpk-base-font-stack,"Skyscanner Relative",-apple-system,BlinkMacSystemFont,"Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif);font-size:1rem;line-height:1.3rem}body.scaffold-font-size{font-size:13px}body.enable-font-smoothing{-webkit-font-smoothing:antialiased}:focus-visible,[type=button]:focus-visible,[type=reset]:focus-visible,[type=submit]:focus-visible,button:focus-visible{outline:.125rem solid #0062e3;outline-offset:.125rem}.hidden,.hide{display:none!important}.visually-hidden,.visuallyhidden{border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;clip:rect(0 0 0 0)}.visually-hidden.focusable:active,.visually-hidden.focusable:focus,.visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{height:auto;margin:0;overflow:visible;position:static;width:auto;clip:auto}.invisible{visibility:hidden}.clearfix:after,.clearfix:before{content:"";display:table}.clearfix:after{clear:both}:root{--bpk-radius-none:0;--bpk-radius-full:6.25rem;--bpk-radius-lg:1.5rem;--bpk-radius-md:0.75rem;--bpk-radius-nav-tabs:1.125rem;--bpk-radius-sm:0.5rem;--bpk-radius-xs:0.25rem;--bpk-spacing-base:1rem;--bpk-spacing-lg:1.5rem;--bpk-spacing-md:0.5rem;--bpk-spacing-none:0;--bpk-spacing-sm:0.25rem;--bpk-spacing-xl:2rem;--bpk-spacing-xs:0.125rem;--bpk-spacing-xxl:2.5rem;--bpk-spacing-xxs:0.0625rem;--bpk-spacing-xxxl:4rem;--bpk-spacing-xxxxl:6rem;--bpk-canvas-contrast:#eff3f8;--bpk-canvas-default:#fff;--bpk-private-badge-colour-bg-default:#eff3f8;--bpk-private-badge-colour-bg-inverse:#fff;--bpk-private-badge-colour-bg-outline:#fff0;--bpk-private-badge-colour-bg-subtle:#eff3f8;--bpk-private-badge-colour-stroke-outline:#fff;--bpk-private-badge-dimension-padding-horizontal-default:0.5rem;--bpk-private-badge-dimension-padding-horizontal-subtle:0.5rem;--bpk-private-badge-typography-tmp-badge-label:0.875rem;--bpk-private-badge-typography-tmp-badge-line-height:0;--bpk-private-button-colour-bg-destructive:#e0e4e9;--bpk-private-button-colour-bg-destructive-pressed:#e70866;--bpk-private-button-colour-bg-disabled:#e0e4e9;--bpk-private-button-colour-bg-feature-pressed:#024daf;--bpk-private-button-colour-bg-featured:#0062e3;--bpk-private-button-colour-bg-footer:#fff0;--bpk-private-button-colour-bg-footer-pressed:#fff0;--bpk-private-button-colour-bg-primary:#05203c;--bpk-private-button-colour-bg-primary-on-dark:#fff;--bpk-private-button-colour-bg-primary-on-dark-pressed:#c1c7cf;--bpk-private-button-colour-bg-primary-on-light:#fff;--bpk-private-button-colour-bg-primary-on-light-pressed:#154679;--bpk-private-button-colour-bg-secondary:#e0e4e9;--bpk-private-button-colour-bg-secondary-pressed:#c1c7cf;--bpk-private-button-colour-bg-secondary-on-contrast:#e0e4e9;--bpk-private-button-colour-bg-secondary-on-contrast-pressed:#c1c7cf;--bpk-private-button-colour-bg-secondary-on-dark:#ffffff1a;--bpk-private-button-colour-bg-secondary-on-dark-disabled:#0b121d;--bpk-private-button-colour-bg-secondary-on-dark-pressed:#04182d;--bpk-private-button-colour-text-disruptive:#e70866;--bpk-private-button-colour-text-feature:#fff;--bpk-private-button-colour-text-footer:#fff0;--bpk-private-button-colour-text-link-on-dark:#fff;--bpk-private-button-colour-text-secondary:#161616;--bpk-private-button-dimension-radius:0.5rem;--bpk-private-button-dimension-min-height-default:2.25rem;--bpk-private-button-dimension-min-height-large:3rem;--bpk-private-button-dimension-min-weight-large:3rem;--bpk-private-button-dimension-padding-horizontal-default:1rem;--bpk-private-button-dimension-padding-horizontal-large:1rem;--bpk-private-button-typography-tmp-default-label:1rem;--bpk-private-card-button-contained-fill:#fffc;--bpk-private-carousel-trigger-bg-default:#ffffff80;--bpk-private-carousel-trigger-bg-default-hover:#fffc;--bpk-private-chip-group-filter-colour-bg-icon-hover-on-image:#eff3f8;--bpk-private-chip-group-filter-colour-bg-icon-off-on-image:#fff;--bpk-private-chip-group-filter-colour-bg-icon-on-default:#05203c;--bpk-private-chip-group-filter-colour-bg-icon-on-on-dark:#fff;--bpk-private-chip-group-filter-colour-bg-icon-on-on-image:#05203c;--bpk-private-chip-group-filter-colour-stroke-icon-hover-default:#05203c;--bpk-private-chip-group-filter-colour-stroke-icon-hover-on-dark:#fff;--bpk-private-chip-group-filter-colour-stroke-icon-off-default:#c1c7cf;--bpk-private-chip-group-filter-colour-stroke-icon-off-on-dark:#ffffff80;--bpk-private-chip-group-filter-dimensions-min-height:2.25rem;--bpk-private-chip-colour-bg-default-dismissible-hover:#05203c;--bpk-private-chip-colour-bg-default-on:#05203c;--bpk-private-chip-colour-bg-disabled:#e0e4e9;--bpk-private-chip-colour-bg-on-contrast-hover:#fff;--bpk-private-chip-colour-bg-on-contrast-on:#05203c;--bpk-private-chip-colour-bg-on-dark-dismissible-hover:#fff;--bpk-private-chip-colour-bg-on-dark-hover:#fff;--bpk-private-chip-colour-bg-on-dark-off:#fff0;--bpk-private-chip-colour-bg-on-dark-on:#fff;--bpk-private-chip-colour-bg-on-image-dismissible-hover:#05203c;--bpk-private-chip-colour-bg-on-image-on:#eff3f8;--bpk-private-chip-colour-border-default-dismissible-hover:#fff0;--bpk-private-chip-colour-border-default-hover:#05203c;--bpk-private-chip-colour-border-default-off:#c1c7cf;--bpk-private-chip-colour-border-on-contrast-off:#fff;--bpk-private-chip-colour-border-on-contrast-on:#05203c;--bpk-private-chip-colour-border-on-dark-disimissible-hover:#fff;--bpk-private-chip-colour-border-on-dark-hover:#fff;--bpk-private-chip-colour-border-on-dark-off:#ffffff80;--bpk-private-chip-colour-stroke-off-on-canvas-contrast-new:#fff0;--bpk-private-chip-colour-text-default-dismissible-hover:#fff;--bpk-private-chip-colour-text-dismissible-on-icon:#ffffff80;--bpk-private-chip-colour-text-on:#fff;--bpk-private-chip-colour-text-on-image:#fff;--bpk-private-chip-colour-text-on-image-dismissible-icon:#626971;--bpk-private-chip-colour-text-on-dark:#161616;--bpk-private-chip-colour-text-on-dark-dismisisble-hover:#161616;--bpk-private-chip-colour-text-on-dark-dismisisble-icon:#626971;--bpk-private-chip-dimension-min-height-width:2rem;--bpk-private-chip-dimension-radius:0.5rem;--bpk-private-date-selector-cheapest-month-highlight:#154679;--bpk-private-date-selector-flexible-date-card:#eff3f8;--bpk-private-dimension-padding-veritcal:0;--bpk-private-info-banner-default:#eff3f8;--bpk-private-info-banner-on-contrast:#fff;--bpk-private-map-cluster-pin:#05203c;--bpk-private-map-cluster-pin-previous-selection:#94c3ff;--bpk-private-map-marker-viewed:#fffc;--bpk-private-map-poi-pin:#8e47ba;--bpk-private-map-previous-selection:#cfe4ff;--bpk-private-navigation-tabs-hover:#154679;--bpk-private-navigation-tabs-outline:#fff3;--bpk-private-navigation-tabs-selected:#024daf;--bpk-private-rating-bar-default:#e0e4e9;--bpk-private-rating-bar-on-contrast:#fff;--bpk-private-segmented-control-canvas-default:#eff3f8;--bpk-private-segmented-control-surface-contrast:#ffffff1a;--bpk-private-segmented-control-surface-contrast-on:#024daf;--bpk-private-shadow-large-blur:0.875rem;--bpk-private-shadow-large-color:#16161640;--bpk-private-shadow-large-position-x:0;--bpk-private-shadow-large-position-y:0.25rem;--bpk-private-shadow-large-spread:0;--bpk-private-shadow-small-blur:0.1875rem;--bpk-private-shadow-small-color:#16161640;--bpk-private-shadow-small-position-x:0;--bpk-private-shadow-small-position-y:0.0625rem;--bpk-private-shadow-small-spread:0;--bpk-private-shadow-xl-blur:3.125rem;--bpk-private-shadow-xl-color:#16161640;--bpk-private-shadow-xl-position-x:0;--bpk-private-shadow-xl-position-y:0.75rem;--bpk-private-shadow-xl-spread:0;--bpk-private-skeleton-on-dark:#ffffff1a;--bpk-private-speech-bubble-colour-bg-contrast:#eff3f8;--bpk-private-speech-bubble-colour-bg-default:#fff;--bpk-private-trip-advisor:#00aa6c;--bpk-core-accent:#0062e3;--bpk-core-eco:#0fa1a9;--bpk-core-primary:#05203c;--bpk-other-line:#c1c7cf;--bpk-other-line-on-dark:#ffffff80;--bpk-other-overlay:#0003;--bpk-other-scrim:#000000b3;--bpk-other-shadow:#16161640;--bpk-status-danger-fill:#ffe9f9;--bpk-status-danger-spot:#e70866;--bpk-status-success-fill:#d4fff2;--bpk-status-success-spot:#0c838a;--bpk-status-warning-fill:#fff7cf;--bpk-status-warning-spot:#f55d42;--bpk-surface-contrast:#05203c;--bpk-surface-default:#fff;--bpk-surface-elevated:#fff;--bpk-surface-hero:#0062e3;--bpk-surface-highlight:#e0e4e9;--bpk-surface-low-contrast:#f7f9fb;--bpk-surface-subtle:#e3f0ff;--bpk-surface-tint:#ffffff1a;--bpk-surface-promo:#0062e3;--bpk-text-disabled:#0003;--bpk-text-disabled-on-dark:#ffffff80;--bpk-text-error:#e70866;--bpk-text-inverse:#fff;--bpk-text-on-dark:#fff;--bpk-text-on-light:#161616;--bpk-text-primary:#161616;--bpk-text-secondary:#626971;--bpk-text-success:#0c838a;--bpk-text-deprecated-link:#0062e3;--bpk-text-hero:#0062e3;--bpk-title:true;--bpk-typography-family-sans-serif:"Skyscanner Relative";--bpk-typography-family-serif:Larken;--bpk-typography-kerning-default:0;--bpk-typography-kerning-loose:0;--bpk-typography-kerning-tight:0;--bpk-typography-style-body:400;--bpk-typography-style-headline:700;--bpk-typography-style-hero:900;--bpk-typography-style-label:700;--bpk-typography-style-subhead:300}:root[data-theme=dark]{--bpk-canvas-contrast:#010913;--bpk-canvas-default:#010913;--bpk-private-badge-colour-bg-default:#243346;--bpk-private-badge-colour-bg-inverse:#243346;--bpk-private-badge-colour-bg-outline:#fff0;--bpk-private-badge-colour-bg-subtle:#243346;--bpk-private-badge-colour-stroke-outline:#fff;--bpk-private-badge-dimension-padding-horizontal-default:0.5rem;--bpk-private-badge-dimension-padding-horizontal-subtle:0.5rem;--bpk-private-badge-typography-tmp-badge-label:0.875rem;--bpk-private-badge-typography-tmp-badge-line-height:0;--bpk-private-button-colour-bg-destructive:#e0e4e9;--bpk-private-button-colour-bg-destructive-pressed:#ff649c;--bpk-private-button-colour-bg-disabled:#0b121d;--bpk-private-button-colour-bg-feature-pressed:#d1f7ff;--bpk-private-button-colour-bg-featured:#d1f7ff;--bpk-private-button-colour-bg-footer:#fff0;--bpk-private-button-colour-bg-footer-pressed:#fff0;--bpk-private-button-colour-bg-primary:#024daf;--bpk-private-button-colour-bg-primary-on-dark:#fff;--bpk-private-button-colour-bg-primary-on-dark-pressed:#c1c7cf;--bpk-private-button-colour-bg-primary-on-light:#fff;--bpk-private-button-colour-bg-primary-on-light-pressed:#002b4b;--bpk-private-button-colour-bg-secondary:#243346;--bpk-private-button-colour-bg-secondary-pressed:#010913;--bpk-private-button-colour-bg-secondary-on-contrast:#243346;--bpk-private-button-colour-bg-secondary-on-contrast-pressed:#010913;--bpk-private-button-colour-bg-secondary-on-dark:#ffffff1a;--bpk-private-button-colour-bg-secondary-on-dark-disabled:#0b121d;--bpk-private-button-colour-bg-secondary-on-dark-pressed:#fff3;--bpk-private-button-colour-text-disruptive:#ff649c;--bpk-private-button-colour-text-feature:#010913;--bpk-private-button-colour-text-footer:#fff0;--bpk-private-button-colour-text-link-on-dark:#fff;--bpk-private-button-colour-text-secondary:#fff;--bpk-private-button-dimension-radius:0.5rem;--bpk-private-button-dimension-min-height-default:2.25rem;--bpk-private-button-dimension-min-height-large:3rem;--bpk-private-button-dimension-min-weight-large:3rem;--bpk-private-button-dimension-padding-horizontal-default:1rem;--bpk-private-button-dimension-padding-horizontal-large:1rem;--bpk-private-button-typography-tmp-default-label:1rem;--bpk-private-card-button-contained-fill:#ffffff1a;--bpk-private-carousel-trigger-bg-default:#ffffff80;--bpk-private-carousel-trigger-bg-default-hover:#fffc;--bpk-private-chip-group-filter-colour-bg-icon-hover-on-image:#010913;--bpk-private-chip-group-filter-colour-bg-icon-off-on-image:#131d2b;--bpk-private-chip-group-filter-colour-bg-icon-on-default:#054184;--bpk-private-chip-group-filter-colour-bg-icon-on-on-dark:#131d2b;--bpk-private-chip-group-filter-colour-bg-icon-on-on-image:#054184;--bpk-private-chip-group-filter-colour-stroke-icon-hover-default:#054184;--bpk-private-chip-group-filter-colour-stroke-icon-hover-on-dark:#131d2b;--bpk-private-chip-group-filter-colour-stroke-icon-off-default:#fff3;--bpk-private-chip-group-filter-colour-stroke-icon-off-on-dark:#fff3;--bpk-private-chip-group-filter-dimensions-min-height:2.25rem;--bpk-private-chip-colour-bg-default-dismissible-hover:#054184;--bpk-private-chip-colour-bg-default-on:#054184;--bpk-private-chip-colour-bg-disabled:#0b121d;--bpk-private-chip-colour-bg-on-contrast-hover:#131d2b;--bpk-private-chip-colour-bg-on-contrast-on:#054184;--bpk-private-chip-colour-bg-on-dark-dismissible-hover:#131d2b;--bpk-private-chip-colour-bg-on-dark-hover:#fff0;--bpk-private-chip-colour-bg-on-dark-off:#fff0;--bpk-private-chip-colour-bg-on-dark-on:#131d2b;--bpk-private-chip-colour-bg-on-image-dismissible-hover:#054184;--bpk-private-chip-colour-bg-on-image-on:#010913;--bpk-private-chip-colour-border-default-dismissible-hover:#fff0;--bpk-private-chip-colour-border-default-hover:#054184;--bpk-private-chip-colour-border-default-off:#fff3;--bpk-private-chip-colour-border-on-contrast-off:#131d2b;--bpk-private-chip-colour-border-on-contrast-on:#131d2b;--bpk-private-chip-colour-border-on-dark-disimissible-hover:#131d2b;--bpk-private-chip-colour-border-on-dark-hover:#fff;--bpk-private-chip-colour-border-on-dark-off:#fff3;--bpk-private-chip-colour-stroke-off-on-canvas-contrast-new:#fff0;--bpk-private-chip-colour-text-default-dismissible-hover:#fff;--bpk-private-chip-colour-text-dismissible-on-icon:#ffffff80;--bpk-private-chip-colour-text-on:#fff;--bpk-private-chip-colour-text-on-image:#fff;--bpk-private-chip-colour-text-on-image-dismissible-icon:#bdc4cb;--bpk-private-chip-colour-text-on-dark:#fff;--bpk-private-chip-colour-text-on-dark-dismisisble-hover:#fff;--bpk-private-chip-colour-text-on-dark-dismisisble-icon:#bdc4cb;--bpk-private-chip-dimension-min-height-width:2rem;--bpk-private-chip-dimension-radius:0.5rem;--bpk-private-date-selector-cheapest-month-highlight:#fff;--bpk-private-date-selector-flexible-date-card:#243346;--bpk-private-dimension-padding-veritcal:0;--bpk-private-info-banner-default:#131d2b;--bpk-private-info-banner-on-contrast:#131d2b;--bpk-private-map-cluster-pin:#fff;--bpk-private-map-cluster-pin-previous-selection:#94c3ff;--bpk-private-map-marker-viewed:#000c;--bpk-private-map-poi-pin:#8e47ba;--bpk-private-map-previous-selection:#cfe4ff;--bpk-private-navigation-tabs-hover:#002b4b;--bpk-private-navigation-tabs-outline:#fff3;--bpk-private-navigation-tabs-selected:#054184;--bpk-private-rating-bar-default:#243346;--bpk-private-rating-bar-on-contrast:#243346;--bpk-private-segmented-control-canvas-default:#131d2b;--bpk-private-segmented-control-surface-contrast:#131d2b;--bpk-private-segmented-control-surface-contrast-on:#054184;--bpk-private-shadow-large-blur:0.875rem;--bpk-private-shadow-large-color:#16161640;--bpk-private-shadow-large-position-x:0;--bpk-private-shadow-large-position-y:0.25rem;--bpk-private-shadow-large-spread:0;--bpk-private-shadow-small-blur:0.1875rem;--bpk-private-shadow-small-color:#16161640;--bpk-private-shadow-small-position-x:0;--bpk-private-shadow-small-position-y:0.0625rem;--bpk-private-shadow-small-spread:0;--bpk-private-shadow-xl-blur:3.125rem;--bpk-private-shadow-xl-color:#16161640;--bpk-private-shadow-xl-position-x:0;--bpk-private-shadow-xl-position-y:0.75rem;--bpk-private-shadow-xl-spread:0;--bpk-private-skeleton-on-dark:#243346;--bpk-private-speech-bubble-colour-bg-contrast:#131d2b;--bpk-private-speech-bubble-colour-bg-default:#131d2b;--bpk-private-trip-advisor:#9ce6c0;--bpk-core-accent:#84e9ff;--bpk-core-eco:#0fa1a9;--bpk-core-primary:#054184;--bpk-other-line:#fff3;--bpk-other-line-on-dark:#fff3;--bpk-other-overlay:#fffc;--bpk-other-scrim:#000000b3;--bpk-other-shadow:#16161640;--bpk-status-danger-fill:#ffcadd;--bpk-status-danger-spot:#ff649c;--bpk-status-success-fill:#b1ffe7;--bpk-status-success-spot:#62f1c6;--bpk-status-warning-fill:#fbf1bb;--bpk-status-warning-spot:#feeb87;--bpk-surface-contrast:#010913;--bpk-surface-default:#131d2b;--bpk-surface-elevated:#243346;--bpk-surface-hero:#010913;--bpk-surface-highlight:#243346;--bpk-surface-low-contrast:#243346;--bpk-surface-subtle:#243346;--bpk-surface-tint:#ffffff1a;--bpk-surface-promo:#243346;--bpk-text-disabled:#fff3;--bpk-text-disabled-on-dark:#ffffff80;--bpk-text-error:#ff649c;--bpk-text-inverse:#010913;--bpk-text-on-dark:#fff;--bpk-text-on-light:#010913;--bpk-text-primary:#fff;--bpk-text-secondary:#bdc4cb;--bpk-text-success:#62f1c6;--bpk-text-deprecated-link:#84e9ff;--bpk-text-hero:#010913;--bpk-title:true;--bpk-typography-family-sans-serif:"Skyscanner Relative";--bpk-typography-family-serif:Larken;--bpk-typography-kerning-default:0;--bpk-typography-kerning-loose:0;--bpk-typography-kerning-tight:0;--bpk-typography-style-body:400;--bpk-typography-style-headline:700;--bpk-typography-style-hero:900;--bpk-typography-style-label:700;--bpk-typography-style-subhead:300}
|
package/bpk-stylesheets/index.js
CHANGED
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Backpack - Skyscanner's Design System
|
|
3
|
+
*
|
|
4
|
+
* Copyright 2016 Skyscanner Ltd
|
|
5
|
+
*
|
|
6
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
7
|
+
* you may not use this file except in compliance with the License.
|
|
8
|
+
* You may obtain a copy of the License at
|
|
9
|
+
*
|
|
10
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
11
|
+
*
|
|
12
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
13
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
14
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
15
|
+
* See the License for the specific language governing permissions and
|
|
16
|
+
* limitations under the License.
|
|
17
|
+
*
|
|
18
|
+
* Do not edit directly, this file was auto-generated.
|
|
19
|
+
*/
|
|
20
|
+
|
|
21
|
+
:root {
|
|
22
|
+
--bpk-radius-none: 0;
|
|
23
|
+
--bpk-radius-full: 6.25rem;
|
|
24
|
+
--bpk-radius-lg: 1.5rem;
|
|
25
|
+
--bpk-radius-md: 0.75rem;
|
|
26
|
+
--bpk-radius-nav-tabs: 1.125rem;
|
|
27
|
+
--bpk-radius-sm: 0.5rem;
|
|
28
|
+
--bpk-radius-xs: 0.25rem;
|
|
29
|
+
--bpk-spacing-base: 1rem;
|
|
30
|
+
--bpk-spacing-lg: 1.5rem;
|
|
31
|
+
--bpk-spacing-md: 0.5rem;
|
|
32
|
+
--bpk-spacing-none: 0;
|
|
33
|
+
--bpk-spacing-sm: 0.25rem;
|
|
34
|
+
--bpk-spacing-xl: 2rem;
|
|
35
|
+
--bpk-spacing-xs: 0.125rem;
|
|
36
|
+
--bpk-spacing-xxl: 2.5rem;
|
|
37
|
+
--bpk-spacing-xxs: 0.0625rem;
|
|
38
|
+
--bpk-spacing-xxxl: 4rem;
|
|
39
|
+
--bpk-spacing-xxxxl: 6rem;
|
|
40
|
+
}
|
|
@@ -0,0 +1,189 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Backpack - Skyscanner's Design System
|
|
3
|
+
*
|
|
4
|
+
* Copyright 2016 Skyscanner Ltd
|
|
5
|
+
*
|
|
6
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
7
|
+
* you may not use this file except in compliance with the License.
|
|
8
|
+
* You may obtain a copy of the License at
|
|
9
|
+
*
|
|
10
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
11
|
+
*
|
|
12
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
13
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
14
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
15
|
+
* See the License for the specific language governing permissions and
|
|
16
|
+
* limitations under the License.
|
|
17
|
+
*
|
|
18
|
+
* Do not edit directly, this file was auto-generated.
|
|
19
|
+
*/
|
|
20
|
+
|
|
21
|
+
:root[data-theme="dark"] {
|
|
22
|
+
--bpk-canvas-contrast: #010913;
|
|
23
|
+
--bpk-canvas-default: #010913;
|
|
24
|
+
--bpk-private-badge-colour-bg-default: #243346;
|
|
25
|
+
--bpk-private-badge-colour-bg-inverse: #243346;
|
|
26
|
+
--bpk-private-badge-colour-bg-outline: rgba(255, 255, 255, 0);
|
|
27
|
+
--bpk-private-badge-colour-bg-subtle: #243346;
|
|
28
|
+
--bpk-private-badge-colour-stroke-outline: #ffffff;
|
|
29
|
+
--bpk-private-badge-dimension-padding-horizontal-default: 0.5rem;
|
|
30
|
+
--bpk-private-badge-dimension-padding-horizontal-subtle: 0.5rem;
|
|
31
|
+
--bpk-private-badge-typography-tmp-badge-label: 0.875rem;
|
|
32
|
+
--bpk-private-badge-typography-tmp-badge-line-height: 0;
|
|
33
|
+
--bpk-private-button-colour-bg-destructive: #e0e4e9;
|
|
34
|
+
--bpk-private-button-colour-bg-destructive-pressed: #ff649c;
|
|
35
|
+
--bpk-private-button-colour-bg-disabled: #0b121d;
|
|
36
|
+
--bpk-private-button-colour-bg-feature-pressed: #d1f7ff;
|
|
37
|
+
--bpk-private-button-colour-bg-featured: #d1f7ff;
|
|
38
|
+
--bpk-private-button-colour-bg-footer: rgba(255, 255, 255, 0);
|
|
39
|
+
--bpk-private-button-colour-bg-footer-pressed: rgba(255, 255, 255, 0);
|
|
40
|
+
--bpk-private-button-colour-bg-primary: #024daf;
|
|
41
|
+
--bpk-private-button-colour-bg-primary-on-dark: #ffffff;
|
|
42
|
+
--bpk-private-button-colour-bg-primary-on-dark-pressed: #c1c7cf;
|
|
43
|
+
--bpk-private-button-colour-bg-primary-on-light: #ffffff;
|
|
44
|
+
--bpk-private-button-colour-bg-primary-on-light-pressed: #002b4b;
|
|
45
|
+
--bpk-private-button-colour-bg-secondary: #243346;
|
|
46
|
+
--bpk-private-button-colour-bg-secondary-pressed: #010913;
|
|
47
|
+
--bpk-private-button-colour-bg-secondary-on-contrast: #243346;
|
|
48
|
+
--bpk-private-button-colour-bg-secondary-on-contrast-pressed: #010913;
|
|
49
|
+
--bpk-private-button-colour-bg-secondary-on-dark: rgba(255, 255, 255, 0.1);
|
|
50
|
+
--bpk-private-button-colour-bg-secondary-on-dark-disabled: #0b121d;
|
|
51
|
+
--bpk-private-button-colour-bg-secondary-on-dark-pressed: rgba(255, 255, 255, 0.2);
|
|
52
|
+
--bpk-private-button-colour-text-disruptive: #ff649c;
|
|
53
|
+
--bpk-private-button-colour-text-feature: #010913;
|
|
54
|
+
--bpk-private-button-colour-text-footer: rgba(255, 255, 255, 0);
|
|
55
|
+
--bpk-private-button-colour-text-link-on-dark: #ffffff;
|
|
56
|
+
--bpk-private-button-colour-text-secondary: #ffffff;
|
|
57
|
+
--bpk-private-button-dimension-radius: 0.5rem;
|
|
58
|
+
--bpk-private-button-dimension-min-height-default: 2.25rem;
|
|
59
|
+
--bpk-private-button-dimension-min-height-large: 3rem;
|
|
60
|
+
--bpk-private-button-dimension-min-weight-large: 3rem;
|
|
61
|
+
--bpk-private-button-dimension-padding-horizontal-default: 1rem;
|
|
62
|
+
--bpk-private-button-dimension-padding-horizontal-large: 1rem;
|
|
63
|
+
--bpk-private-button-typography-tmp-default-label: 1rem;
|
|
64
|
+
--bpk-private-card-button-contained-fill: rgba(255, 255, 255, 0.1);
|
|
65
|
+
--bpk-private-carousel-trigger-bg-default: rgba(255, 255, 255, 0.5);
|
|
66
|
+
--bpk-private-carousel-trigger-bg-default-hover: rgba(255, 255, 255, 0.8);
|
|
67
|
+
--bpk-private-chip-group-filter-colour-bg-icon-hover-on-image: #010913;
|
|
68
|
+
--bpk-private-chip-group-filter-colour-bg-icon-off-on-image: #131d2b;
|
|
69
|
+
--bpk-private-chip-group-filter-colour-bg-icon-on-default: #054184;
|
|
70
|
+
--bpk-private-chip-group-filter-colour-bg-icon-on-on-dark: #131d2b;
|
|
71
|
+
--bpk-private-chip-group-filter-colour-bg-icon-on-on-image: #054184;
|
|
72
|
+
--bpk-private-chip-group-filter-colour-stroke-icon-hover-default: #054184;
|
|
73
|
+
--bpk-private-chip-group-filter-colour-stroke-icon-hover-on-dark: #131d2b;
|
|
74
|
+
--bpk-private-chip-group-filter-colour-stroke-icon-off-default: rgba(255, 255, 255, 0.2);
|
|
75
|
+
--bpk-private-chip-group-filter-colour-stroke-icon-off-on-dark: rgba(255, 255, 255, 0.2);
|
|
76
|
+
--bpk-private-chip-group-filter-dimensions-min-height: 2.25rem;
|
|
77
|
+
--bpk-private-chip-colour-bg-default-dismissible-hover: #054184;
|
|
78
|
+
--bpk-private-chip-colour-bg-default-on: #054184;
|
|
79
|
+
--bpk-private-chip-colour-bg-disabled: #0b121d;
|
|
80
|
+
--bpk-private-chip-colour-bg-on-contrast-hover: #131d2b;
|
|
81
|
+
--bpk-private-chip-colour-bg-on-contrast-on: #054184;
|
|
82
|
+
--bpk-private-chip-colour-bg-on-dark-dismissible-hover: #131d2b;
|
|
83
|
+
--bpk-private-chip-colour-bg-on-dark-hover: rgba(255, 255, 255, 0);
|
|
84
|
+
--bpk-private-chip-colour-bg-on-dark-off: rgba(255, 255, 255, 0);
|
|
85
|
+
--bpk-private-chip-colour-bg-on-dark-on: #131d2b;
|
|
86
|
+
--bpk-private-chip-colour-bg-on-image-dismissible-hover: #054184;
|
|
87
|
+
--bpk-private-chip-colour-bg-on-image-on: #010913;
|
|
88
|
+
--bpk-private-chip-colour-border-default-dismissible-hover: rgba(255, 255, 255, 0);
|
|
89
|
+
--bpk-private-chip-colour-border-default-hover: #054184;
|
|
90
|
+
--bpk-private-chip-colour-border-default-off: rgba(255, 255, 255, 0.2);
|
|
91
|
+
--bpk-private-chip-colour-border-on-contrast-off: #131d2b;
|
|
92
|
+
--bpk-private-chip-colour-border-on-contrast-on: #131d2b;
|
|
93
|
+
--bpk-private-chip-colour-border-on-dark-disimissible-hover: #131d2b;
|
|
94
|
+
--bpk-private-chip-colour-border-on-dark-hover: #ffffff;
|
|
95
|
+
--bpk-private-chip-colour-border-on-dark-off: rgba(255, 255, 255, 0.2);
|
|
96
|
+
--bpk-private-chip-colour-stroke-off-on-canvas-contrast-new: rgba(255, 255, 255, 0);
|
|
97
|
+
--bpk-private-chip-colour-text-default-dismissible-hover: #ffffff;
|
|
98
|
+
--bpk-private-chip-colour-text-dismissible-on-icon: rgba(255, 255, 255, 0.5);
|
|
99
|
+
--bpk-private-chip-colour-text-on: #ffffff;
|
|
100
|
+
--bpk-private-chip-colour-text-on-image: #ffffff;
|
|
101
|
+
--bpk-private-chip-colour-text-on-image-dismissible-icon: #bdc4cb;
|
|
102
|
+
--bpk-private-chip-colour-text-on-dark: #ffffff;
|
|
103
|
+
--bpk-private-chip-colour-text-on-dark-dismisisble-hover: #ffffff;
|
|
104
|
+
--bpk-private-chip-colour-text-on-dark-dismisisble-icon: #bdc4cb;
|
|
105
|
+
--bpk-private-chip-dimension-min-height-width: 2rem;
|
|
106
|
+
--bpk-private-chip-dimension-radius: 0.5rem;
|
|
107
|
+
--bpk-private-date-selector-cheapest-month-highlight: #ffffff;
|
|
108
|
+
--bpk-private-date-selector-flexible-date-card: #243346;
|
|
109
|
+
--bpk-private-dimension-padding-veritcal: 0;
|
|
110
|
+
--bpk-private-info-banner-default: #131d2b;
|
|
111
|
+
--bpk-private-info-banner-on-contrast: #131d2b;
|
|
112
|
+
--bpk-private-map-cluster-pin: #ffffff;
|
|
113
|
+
--bpk-private-map-cluster-pin-previous-selection: #94c3ff;
|
|
114
|
+
--bpk-private-map-marker-viewed: rgba(0, 0, 0, 0.8);
|
|
115
|
+
--bpk-private-map-poi-pin: #8e47ba;
|
|
116
|
+
--bpk-private-map-previous-selection: #cfe4ff;
|
|
117
|
+
--bpk-private-navigation-tabs-hover: #002b4b;
|
|
118
|
+
--bpk-private-navigation-tabs-outline: rgba(255, 255, 255, 0.2);
|
|
119
|
+
--bpk-private-navigation-tabs-selected: #054184;
|
|
120
|
+
--bpk-private-rating-bar-default: #243346;
|
|
121
|
+
--bpk-private-rating-bar-on-contrast: #243346;
|
|
122
|
+
--bpk-private-segmented-control-canvas-default: #131d2b;
|
|
123
|
+
--bpk-private-segmented-control-surface-contrast: #131d2b;
|
|
124
|
+
--bpk-private-segmented-control-surface-contrast-on: #054184;
|
|
125
|
+
--bpk-private-shadow-large-blur: 0.875rem;
|
|
126
|
+
--bpk-private-shadow-large-color: rgba(22, 22, 22, 0.25);
|
|
127
|
+
--bpk-private-shadow-large-position-x: 0;
|
|
128
|
+
--bpk-private-shadow-large-position-y: 0.25rem;
|
|
129
|
+
--bpk-private-shadow-large-spread: 0;
|
|
130
|
+
--bpk-private-shadow-small-blur: 0.1875rem;
|
|
131
|
+
--bpk-private-shadow-small-color: rgba(22, 22, 22, 0.25);
|
|
132
|
+
--bpk-private-shadow-small-position-x: 0;
|
|
133
|
+
--bpk-private-shadow-small-position-y: 0.0625rem;
|
|
134
|
+
--bpk-private-shadow-small-spread: 0;
|
|
135
|
+
--bpk-private-shadow-xl-blur: 3.125rem;
|
|
136
|
+
--bpk-private-shadow-xl-color: rgba(22, 22, 22, 0.25);
|
|
137
|
+
--bpk-private-shadow-xl-position-x: 0;
|
|
138
|
+
--bpk-private-shadow-xl-position-y: 0.75rem;
|
|
139
|
+
--bpk-private-shadow-xl-spread: 0;
|
|
140
|
+
--bpk-private-skeleton-on-dark: #243346;
|
|
141
|
+
--bpk-private-speech-bubble-colour-bg-contrast: #131d2b;
|
|
142
|
+
--bpk-private-speech-bubble-colour-bg-default: #131d2b;
|
|
143
|
+
--bpk-private-trip-advisor: #9ce6c0;
|
|
144
|
+
--bpk-core-accent: #84e9ff;
|
|
145
|
+
--bpk-core-eco: #0fa1a9;
|
|
146
|
+
--bpk-core-primary: #054184;
|
|
147
|
+
--bpk-other-line: rgba(255, 255, 255, 0.2);
|
|
148
|
+
--bpk-other-line-on-dark: rgba(255, 255, 255, 0.2);
|
|
149
|
+
--bpk-other-overlay: rgba(255, 255, 255, 0.8);
|
|
150
|
+
--bpk-other-scrim: rgba(0, 0, 0, 0.7);
|
|
151
|
+
--bpk-other-shadow: rgba(22, 22, 22, 0.25);
|
|
152
|
+
--bpk-status-danger-fill: #ffcadd;
|
|
153
|
+
--bpk-status-danger-spot: #ff649c;
|
|
154
|
+
--bpk-status-success-fill: #b1ffe7;
|
|
155
|
+
--bpk-status-success-spot: #62f1c6;
|
|
156
|
+
--bpk-status-warning-fill: #fbf1bb;
|
|
157
|
+
--bpk-status-warning-spot: #feeb87;
|
|
158
|
+
--bpk-surface-contrast: #010913;
|
|
159
|
+
--bpk-surface-default: #131d2b;
|
|
160
|
+
--bpk-surface-elevated: #243346;
|
|
161
|
+
--bpk-surface-hero: #010913;
|
|
162
|
+
--bpk-surface-highlight: #243346;
|
|
163
|
+
--bpk-surface-low-contrast: #243346;
|
|
164
|
+
--bpk-surface-subtle: #243346;
|
|
165
|
+
--bpk-surface-tint: rgba(255, 255, 255, 0.1);
|
|
166
|
+
--bpk-surface-promo: #243346;
|
|
167
|
+
--bpk-text-disabled: rgba(255, 255, 255, 0.2);
|
|
168
|
+
--bpk-text-disabled-on-dark: rgba(255, 255, 255, 0.5);
|
|
169
|
+
--bpk-text-error: #ff649c;
|
|
170
|
+
--bpk-text-inverse: #010913;
|
|
171
|
+
--bpk-text-on-dark: #ffffff;
|
|
172
|
+
--bpk-text-on-light: #010913;
|
|
173
|
+
--bpk-text-primary: #ffffff;
|
|
174
|
+
--bpk-text-secondary: #bdc4cb;
|
|
175
|
+
--bpk-text-success: #62f1c6;
|
|
176
|
+
--bpk-text-deprecated-link: #84e9ff;
|
|
177
|
+
--bpk-text-hero: #010913;
|
|
178
|
+
--bpk-title: true;
|
|
179
|
+
--bpk-typography-family-sans-serif: 'Skyscanner Relative';
|
|
180
|
+
--bpk-typography-family-serif: Larken;
|
|
181
|
+
--bpk-typography-kerning-default: 0;
|
|
182
|
+
--bpk-typography-kerning-loose: 0;
|
|
183
|
+
--bpk-typography-kerning-tight: 0;
|
|
184
|
+
--bpk-typography-style-body: 400;
|
|
185
|
+
--bpk-typography-style-headline: 700;
|
|
186
|
+
--bpk-typography-style-hero: 900;
|
|
187
|
+
--bpk-typography-style-label: 700;
|
|
188
|
+
--bpk-typography-style-subhead: 300;
|
|
189
|
+
}
|
|
@@ -0,0 +1,189 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Backpack - Skyscanner's Design System
|
|
3
|
+
*
|
|
4
|
+
* Copyright 2016 Skyscanner Ltd
|
|
5
|
+
*
|
|
6
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
7
|
+
* you may not use this file except in compliance with the License.
|
|
8
|
+
* You may obtain a copy of the License at
|
|
9
|
+
*
|
|
10
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
11
|
+
*
|
|
12
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
13
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
14
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
15
|
+
* See the License for the specific language governing permissions and
|
|
16
|
+
* limitations under the License.
|
|
17
|
+
*
|
|
18
|
+
* Do not edit directly, this file was auto-generated.
|
|
19
|
+
*/
|
|
20
|
+
|
|
21
|
+
:root {
|
|
22
|
+
--bpk-canvas-contrast: #eff3f8;
|
|
23
|
+
--bpk-canvas-default: #ffffff;
|
|
24
|
+
--bpk-private-badge-colour-bg-default: #eff3f8;
|
|
25
|
+
--bpk-private-badge-colour-bg-inverse: #ffffff;
|
|
26
|
+
--bpk-private-badge-colour-bg-outline: rgba(255, 255, 255, 0);
|
|
27
|
+
--bpk-private-badge-colour-bg-subtle: #eff3f8;
|
|
28
|
+
--bpk-private-badge-colour-stroke-outline: #ffffff;
|
|
29
|
+
--bpk-private-badge-dimension-padding-horizontal-default: 0.5rem;
|
|
30
|
+
--bpk-private-badge-dimension-padding-horizontal-subtle: 0.5rem;
|
|
31
|
+
--bpk-private-badge-typography-tmp-badge-label: 0.875rem;
|
|
32
|
+
--bpk-private-badge-typography-tmp-badge-line-height: 0;
|
|
33
|
+
--bpk-private-button-colour-bg-destructive: #e0e4e9;
|
|
34
|
+
--bpk-private-button-colour-bg-destructive-pressed: #e70866;
|
|
35
|
+
--bpk-private-button-colour-bg-disabled: #e0e4e9;
|
|
36
|
+
--bpk-private-button-colour-bg-feature-pressed: #024daf;
|
|
37
|
+
--bpk-private-button-colour-bg-featured: #0062e3;
|
|
38
|
+
--bpk-private-button-colour-bg-footer: rgba(255, 255, 255, 0);
|
|
39
|
+
--bpk-private-button-colour-bg-footer-pressed: rgba(255, 255, 255, 0);
|
|
40
|
+
--bpk-private-button-colour-bg-primary: #05203c;
|
|
41
|
+
--bpk-private-button-colour-bg-primary-on-dark: #ffffff;
|
|
42
|
+
--bpk-private-button-colour-bg-primary-on-dark-pressed: #c1c7cf;
|
|
43
|
+
--bpk-private-button-colour-bg-primary-on-light: #ffffff;
|
|
44
|
+
--bpk-private-button-colour-bg-primary-on-light-pressed: #154679;
|
|
45
|
+
--bpk-private-button-colour-bg-secondary: #e0e4e9;
|
|
46
|
+
--bpk-private-button-colour-bg-secondary-pressed: #c1c7cf;
|
|
47
|
+
--bpk-private-button-colour-bg-secondary-on-contrast: #e0e4e9;
|
|
48
|
+
--bpk-private-button-colour-bg-secondary-on-contrast-pressed: #c1c7cf;
|
|
49
|
+
--bpk-private-button-colour-bg-secondary-on-dark: rgba(255, 255, 255, 0.1);
|
|
50
|
+
--bpk-private-button-colour-bg-secondary-on-dark-disabled: #0b121d;
|
|
51
|
+
--bpk-private-button-colour-bg-secondary-on-dark-pressed: #04182d;
|
|
52
|
+
--bpk-private-button-colour-text-disruptive: #e70866;
|
|
53
|
+
--bpk-private-button-colour-text-feature: #ffffff;
|
|
54
|
+
--bpk-private-button-colour-text-footer: rgba(255, 255, 255, 0);
|
|
55
|
+
--bpk-private-button-colour-text-link-on-dark: #ffffff;
|
|
56
|
+
--bpk-private-button-colour-text-secondary: #161616;
|
|
57
|
+
--bpk-private-button-dimension-radius: 0.5rem;
|
|
58
|
+
--bpk-private-button-dimension-min-height-default: 2.25rem;
|
|
59
|
+
--bpk-private-button-dimension-min-height-large: 3rem;
|
|
60
|
+
--bpk-private-button-dimension-min-weight-large: 3rem;
|
|
61
|
+
--bpk-private-button-dimension-padding-horizontal-default: 1rem;
|
|
62
|
+
--bpk-private-button-dimension-padding-horizontal-large: 1rem;
|
|
63
|
+
--bpk-private-button-typography-tmp-default-label: 1rem;
|
|
64
|
+
--bpk-private-card-button-contained-fill: rgba(255, 255, 255, 0.8);
|
|
65
|
+
--bpk-private-carousel-trigger-bg-default: rgba(255, 255, 255, 0.5);
|
|
66
|
+
--bpk-private-carousel-trigger-bg-default-hover: rgba(255, 255, 255, 0.8);
|
|
67
|
+
--bpk-private-chip-group-filter-colour-bg-icon-hover-on-image: #eff3f8;
|
|
68
|
+
--bpk-private-chip-group-filter-colour-bg-icon-off-on-image: #ffffff;
|
|
69
|
+
--bpk-private-chip-group-filter-colour-bg-icon-on-default: #05203c;
|
|
70
|
+
--bpk-private-chip-group-filter-colour-bg-icon-on-on-dark: #ffffff;
|
|
71
|
+
--bpk-private-chip-group-filter-colour-bg-icon-on-on-image: #05203c;
|
|
72
|
+
--bpk-private-chip-group-filter-colour-stroke-icon-hover-default: #05203c;
|
|
73
|
+
--bpk-private-chip-group-filter-colour-stroke-icon-hover-on-dark: #ffffff;
|
|
74
|
+
--bpk-private-chip-group-filter-colour-stroke-icon-off-default: #c1c7cf;
|
|
75
|
+
--bpk-private-chip-group-filter-colour-stroke-icon-off-on-dark: rgba(255, 255, 255, 0.5);
|
|
76
|
+
--bpk-private-chip-group-filter-dimensions-min-height: 2.25rem;
|
|
77
|
+
--bpk-private-chip-colour-bg-default-dismissible-hover: #05203c;
|
|
78
|
+
--bpk-private-chip-colour-bg-default-on: #05203c;
|
|
79
|
+
--bpk-private-chip-colour-bg-disabled: #e0e4e9;
|
|
80
|
+
--bpk-private-chip-colour-bg-on-contrast-hover: #ffffff;
|
|
81
|
+
--bpk-private-chip-colour-bg-on-contrast-on: #05203c;
|
|
82
|
+
--bpk-private-chip-colour-bg-on-dark-dismissible-hover: #ffffff;
|
|
83
|
+
--bpk-private-chip-colour-bg-on-dark-hover: #ffffff;
|
|
84
|
+
--bpk-private-chip-colour-bg-on-dark-off: rgba(255, 255, 255, 0);
|
|
85
|
+
--bpk-private-chip-colour-bg-on-dark-on: #ffffff;
|
|
86
|
+
--bpk-private-chip-colour-bg-on-image-dismissible-hover: #05203c;
|
|
87
|
+
--bpk-private-chip-colour-bg-on-image-on: #eff3f8;
|
|
88
|
+
--bpk-private-chip-colour-border-default-dismissible-hover: rgba(255, 255, 255, 0);
|
|
89
|
+
--bpk-private-chip-colour-border-default-hover: #05203c;
|
|
90
|
+
--bpk-private-chip-colour-border-default-off: #c1c7cf;
|
|
91
|
+
--bpk-private-chip-colour-border-on-contrast-off: #ffffff;
|
|
92
|
+
--bpk-private-chip-colour-border-on-contrast-on: #05203c;
|
|
93
|
+
--bpk-private-chip-colour-border-on-dark-disimissible-hover: #ffffff;
|
|
94
|
+
--bpk-private-chip-colour-border-on-dark-hover: #ffffff;
|
|
95
|
+
--bpk-private-chip-colour-border-on-dark-off: rgba(255, 255, 255, 0.5);
|
|
96
|
+
--bpk-private-chip-colour-stroke-off-on-canvas-contrast-new: rgba(255, 255, 255, 0);
|
|
97
|
+
--bpk-private-chip-colour-text-default-dismissible-hover: #ffffff;
|
|
98
|
+
--bpk-private-chip-colour-text-dismissible-on-icon: rgba(255, 255, 255, 0.5);
|
|
99
|
+
--bpk-private-chip-colour-text-on: #ffffff;
|
|
100
|
+
--bpk-private-chip-colour-text-on-image: #ffffff;
|
|
101
|
+
--bpk-private-chip-colour-text-on-image-dismissible-icon: #626971;
|
|
102
|
+
--bpk-private-chip-colour-text-on-dark: #161616;
|
|
103
|
+
--bpk-private-chip-colour-text-on-dark-dismisisble-hover: #161616;
|
|
104
|
+
--bpk-private-chip-colour-text-on-dark-dismisisble-icon: #626971;
|
|
105
|
+
--bpk-private-chip-dimension-min-height-width: 2rem;
|
|
106
|
+
--bpk-private-chip-dimension-radius: 0.5rem;
|
|
107
|
+
--bpk-private-date-selector-cheapest-month-highlight: #154679;
|
|
108
|
+
--bpk-private-date-selector-flexible-date-card: #eff3f8;
|
|
109
|
+
--bpk-private-dimension-padding-veritcal: 0;
|
|
110
|
+
--bpk-private-info-banner-default: #eff3f8;
|
|
111
|
+
--bpk-private-info-banner-on-contrast: #ffffff;
|
|
112
|
+
--bpk-private-map-cluster-pin: #05203c;
|
|
113
|
+
--bpk-private-map-cluster-pin-previous-selection: #94c3ff;
|
|
114
|
+
--bpk-private-map-marker-viewed: rgba(255, 255, 255, 0.8);
|
|
115
|
+
--bpk-private-map-poi-pin: #8e47ba;
|
|
116
|
+
--bpk-private-map-previous-selection: #cfe4ff;
|
|
117
|
+
--bpk-private-navigation-tabs-hover: #154679;
|
|
118
|
+
--bpk-private-navigation-tabs-outline: rgba(255, 255, 255, 0.2);
|
|
119
|
+
--bpk-private-navigation-tabs-selected: #024daf;
|
|
120
|
+
--bpk-private-rating-bar-default: #e0e4e9;
|
|
121
|
+
--bpk-private-rating-bar-on-contrast: #ffffff;
|
|
122
|
+
--bpk-private-segmented-control-canvas-default: #eff3f8;
|
|
123
|
+
--bpk-private-segmented-control-surface-contrast: rgba(255, 255, 255, 0.1);
|
|
124
|
+
--bpk-private-segmented-control-surface-contrast-on: #024daf;
|
|
125
|
+
--bpk-private-shadow-large-blur: 0.875rem;
|
|
126
|
+
--bpk-private-shadow-large-color: rgba(22, 22, 22, 0.25);
|
|
127
|
+
--bpk-private-shadow-large-position-x: 0;
|
|
128
|
+
--bpk-private-shadow-large-position-y: 0.25rem;
|
|
129
|
+
--bpk-private-shadow-large-spread: 0;
|
|
130
|
+
--bpk-private-shadow-small-blur: 0.1875rem;
|
|
131
|
+
--bpk-private-shadow-small-color: rgba(22, 22, 22, 0.25);
|
|
132
|
+
--bpk-private-shadow-small-position-x: 0;
|
|
133
|
+
--bpk-private-shadow-small-position-y: 0.0625rem;
|
|
134
|
+
--bpk-private-shadow-small-spread: 0;
|
|
135
|
+
--bpk-private-shadow-xl-blur: 3.125rem;
|
|
136
|
+
--bpk-private-shadow-xl-color: rgba(22, 22, 22, 0.25);
|
|
137
|
+
--bpk-private-shadow-xl-position-x: 0;
|
|
138
|
+
--bpk-private-shadow-xl-position-y: 0.75rem;
|
|
139
|
+
--bpk-private-shadow-xl-spread: 0;
|
|
140
|
+
--bpk-private-skeleton-on-dark: rgba(255, 255, 255, 0.1);
|
|
141
|
+
--bpk-private-speech-bubble-colour-bg-contrast: #eff3f8;
|
|
142
|
+
--bpk-private-speech-bubble-colour-bg-default: #ffffff;
|
|
143
|
+
--bpk-private-trip-advisor: #00aa6c;
|
|
144
|
+
--bpk-core-accent: #0062e3;
|
|
145
|
+
--bpk-core-eco: #0fa1a9;
|
|
146
|
+
--bpk-core-primary: #05203c;
|
|
147
|
+
--bpk-other-line: #c1c7cf;
|
|
148
|
+
--bpk-other-line-on-dark: rgba(255, 255, 255, 0.5);
|
|
149
|
+
--bpk-other-overlay: rgba(0, 0, 0, 0.2);
|
|
150
|
+
--bpk-other-scrim: rgba(0, 0, 0, 0.7);
|
|
151
|
+
--bpk-other-shadow: rgba(22, 22, 22, 0.25);
|
|
152
|
+
--bpk-status-danger-fill: #ffe9f9;
|
|
153
|
+
--bpk-status-danger-spot: #e70866;
|
|
154
|
+
--bpk-status-success-fill: #d4fff2;
|
|
155
|
+
--bpk-status-success-spot: #0c838a;
|
|
156
|
+
--bpk-status-warning-fill: #fff7cf;
|
|
157
|
+
--bpk-status-warning-spot: #f55d42;
|
|
158
|
+
--bpk-surface-contrast: #05203c;
|
|
159
|
+
--bpk-surface-default: #ffffff;
|
|
160
|
+
--bpk-surface-elevated: #ffffff;
|
|
161
|
+
--bpk-surface-hero: #0062e3;
|
|
162
|
+
--bpk-surface-highlight: #e0e4e9;
|
|
163
|
+
--bpk-surface-low-contrast: #f7f9fb;
|
|
164
|
+
--bpk-surface-subtle: #e3f0ff;
|
|
165
|
+
--bpk-surface-tint: rgba(255, 255, 255, 0.1);
|
|
166
|
+
--bpk-surface-promo: #0062e3;
|
|
167
|
+
--bpk-text-disabled: rgba(0, 0, 0, 0.2);
|
|
168
|
+
--bpk-text-disabled-on-dark: rgba(255, 255, 255, 0.5);
|
|
169
|
+
--bpk-text-error: #e70866;
|
|
170
|
+
--bpk-text-inverse: #ffffff;
|
|
171
|
+
--bpk-text-on-dark: #ffffff;
|
|
172
|
+
--bpk-text-on-light: #161616;
|
|
173
|
+
--bpk-text-primary: #161616;
|
|
174
|
+
--bpk-text-secondary: #626971;
|
|
175
|
+
--bpk-text-success: #0c838a;
|
|
176
|
+
--bpk-text-deprecated-link: #0062e3;
|
|
177
|
+
--bpk-text-hero: #0062e3;
|
|
178
|
+
--bpk-title: true;
|
|
179
|
+
--bpk-typography-family-sans-serif: 'Skyscanner Relative';
|
|
180
|
+
--bpk-typography-family-serif: Larken;
|
|
181
|
+
--bpk-typography-kerning-default: 0;
|
|
182
|
+
--bpk-typography-kerning-loose: 0;
|
|
183
|
+
--bpk-typography-kerning-tight: 0;
|
|
184
|
+
--bpk-typography-style-body: 400;
|
|
185
|
+
--bpk-typography-style-headline: 700;
|
|
186
|
+
--bpk-typography-style-hero: 900;
|
|
187
|
+
--bpk-typography-style-label: 700;
|
|
188
|
+
--bpk-typography-style-subhead: 300;
|
|
189
|
+
}
|