1 line
22 KiB
Plaintext
1 line
22 KiB
Plaintext
{"version":3,"sources":["Search.component.scss","../../../styles/_variables.scss","CartIcon.component.scss","Footer.component.scss","SortAndFilterPanel.component.scss","SortModal.component.scss","FilterModal.component.scss","ItemPrice.component.scss","ProductTile.component.scss","ProductContainer.component.scss","ProductContainerWithTools.component.scss"],"names":[],"mappings":"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","file":"4.4f322c3d.chunk.css","sourcesContent":["@import './../../../styles//variables';\r\n\r\n.c-Plp__c-Header__c-Search {\r\n margin-left: auto;\r\n position: relative;\r\n\r\n .c-Plp__c-Header__c-Search__input {\r\n background: transparent;\r\n border: none;\r\n border-bottom: 1px solid $neutral-00;\r\n color: $neutral-00;\r\n float: right;\r\n min-height: 0;\r\n width: 0;\r\n visibility: hidden;\r\n opacity: 0;\r\n font-size: $small-font-size;\r\n font-weight: $bold-font-weight;\r\n padding: 7px 10px 8px 0;\r\n -webkit-transition: all 0.33s ease-in-out;\r\n transition: all 0.3s ease-in-out;\r\n box-shadow: none;\r\n outline: none;\r\n\r\n &.c-Plp__c-Header__c-Search__input--visible {\r\n width: 100%;\r\n opacity: 1;\r\n visibility: visible;\r\n }\r\n \r\n &::placeholder {\r\n color: $neutral-00;\r\n opacity: 1;\r\n }\r\n \r\n &:-ms-input-placeholder {\r\n color: $neutral-00;\r\n font-size: $small-font-size;\r\n }\r\n \r\n &::-ms-input-placeholder {\r\n color: $neutral-00;\r\n }\r\n }\r\n\r\n .c-Plp__c-Header__c-Search__searchIcon {\r\n position: absolute;\r\n top: 6px;\r\n right: 0px;\r\n }\r\n}\r\n","// Project-Wide Variables\r\n// ===\r\n//\r\n// Edit these as needed. Some guidelines:\r\n//\r\n// - Names should be lowercase and dash-separated;\r\n// - Qualifiers should be added to the beginning of related variables: use\r\n// `$small-font-size`, not `$font-size-small`;\r\n// - Numeric scales should use increments of 10; these numbers are arbitrary and\r\n// should not map to actual values. If really necessary, additional values can\r\n// be added in between, e.g. $neutral-15 between 10 and 20.\r\n//\r\n//\r\n// Table of Contents\r\n// ---\r\n//\r\n// [AAA] Basic Layout\r\n// [BBB] Responsive Layout\r\n// [CCC] Typography\r\n// [DDD] Color Palette\r\n// [EEE] Appearance\r\n// [FFF] Z-Index\r\n// [GGG] Shorthands\r\n\r\n\r\n// [AAA] Basic Layout\r\n// ---\r\n\r\n// Basic unit for spacing and alignment; 6 to 12px recommended. Apply in whole\r\n// or half multiples.\r\n$sub-unit: 4px;\r\n$unit: 8px;\r\n\r\n// Standard tap-target size\r\n$tap-size: 44px;\r\n\r\n// Container max-width.\r\n$max-width: 1280px;\r\n\r\n// Content Height Calculations\r\n$header-height: 64px;\r\n$footer-height: 173px;\r\n$content-height: calc(100vh - #{$header-height} - #{$footer-height});\r\n\r\n// [BBB] Responsive Layout\r\n// ---\r\n//\r\n// Media query breakpoints and grid setup. Please see Mobify's Responsive Best\r\n// Practices doc here: https://bit.ly/2tmRnEi, and our Responsive Grid\r\n// documentation here: http://docs.mobify.com/latest/guides/responsive-grid/\r\n//\r\n// Note: $small-breakpoint isn't needed, since it is 0px\r\n\r\n$medium-breakpoint: 600px;\r\n$large-breakpoint: 960px;\r\n$xlarge-breakpoint: $max-width;\r\n\r\n$susy: (\r\n // Add color to show the columns and gutters\r\n 'svg-grid-colors': hsl(0, 0%, 95%),\r\n 'columns': susy-repeat(4),\r\n 'gutters': 12px\r\n);\r\n\r\n$medium-layout: (\r\n 'svg-grid-colors': hsl(0, 0%, 95%),\r\n 'columns': susy-repeat(12),\r\n 'gutters': 12px\r\n);\r\n\r\n$large-layout: (\r\n 'svg-grid-colors': hsl(0, 0%, 95%),\r\n 'columns': susy-repeat(12),\r\n 'gutters': 24px\r\n);\r\n\r\n\r\n// [CCC] Typography\r\n// ---\r\n// $font-family: 'San Francisco', 'Roboto', 'Fira Sans', 'Segoe UI', sans-serif;\r\n$font-family: Verdana, Geneva, sans-serif; \r\n$header-font-family: 'Avenir Next Condensed', 'Roboto Condensed', 'Helvetica Neue', 'Roboto', sans-serif;\r\n$loaded-header-font-family: 'Roboto', $header-font-family;\r\n\r\n// Line height\r\n$huge-line-height: 32px;\r\n$bigger-line-height: 28px;\r\n$big-line-height: 24px;\r\n$line-height: 20px;\r\n$small-line-height: 16px;\r\n$smaller-line-height: 12px;\r\n$tiny-line-height: 8px;\r\n\r\n// Font sizes\r\n$huge-font-size: 28px;\r\n$bigger-font-size: 24px;\r\n$big-font-size: 20px;\r\n$font-size: 16px;\r\n$small-font-size: 14px;\r\n$smaller-font-size: 12px;\r\n$tiny-font-size: 10px;\r\n$smallest-font-size: 8px;\r\n\r\n// Font weight\r\n$thin-font-weight: 100;\r\n$extra-light-font-weight: 200;\r\n$light-font-weight: 300;\r\n$regular-font-weight: 400;\r\n$medium-font-weight: 500;\r\n$semi-bold-font-weight: 600;\r\n$bold-font-weight: 700;\r\n\r\n// [DDD] Color Palette\r\n// ---\r\n\r\n// Neutrals\r\n$neutral-00: #fff;\r\n$neutral-10: #f7f7f7;\r\n$neutral-12: #f1f3f6;\r\n$neutral-15: #eee;\r\n$neutral-17: #e1e1e1;\r\n$neutral-20: #d5d5d5;\r\n$neutral-30: #bfbfbf;\r\n$neutral-40: #999;\r\n$neutral-50: #696969;\r\n$neutral-60: #333;\r\n$neutral-70: #000;\r\n\r\n// Brand colors\r\n// $brand-color: #017e9b; // blue\r\n$brand-color: #4471ea; // blue\r\n// $secondary-brand-color: #005569;\r\n$secondary-brand-color: #fafafa;\r\n$tertiary-brand-color: #83bdcb;\r\n$quaternary-brand-color: #bfdfe6;\r\n\r\n// UI Kit colors\r\n$ui-brand-color: #005c83; // dark blue\r\n\r\n// Accent colors\r\n$accent-color: #ff852c; // orange\r\n$light-accent-color: lighten($accent-color, 15%);\r\n$dark-accent-color: darken($accent-color, 15%);\r\n\r\n// Primary Action\r\n$primary-action-color: #dc0a3c;\r\n$light-primary-action-color: lighten($primary-action-color, 15%);\r\n$dark-primary-action-color: darken($primary-action-color, 15%);\r\n\r\n// Secondary Action\r\n$secondary-action-color: #ff852c;\r\n$light-secondary-action-color: lighten($secondary-action-color, 15%);\r\n$dark-secondary-action-color: darken($secondary-action-color, 15%);\r\n\r\n// Success colors\r\n$success-color: #037b30;\r\n$light-success-color: lighten($success-color, 15%);\r\n$dark-success-color: darken($success-color, 15%);\r\n\r\n// Error colors\r\n$error-color: #c70936;\r\n$light-error-color: lighten($error-color, 15%);\r\n$feedback-error-color: #f8e7eb;\r\n$dark-error-color: darken($error-color, 15%);\r\n\r\n// Sale color\r\n$sale-color: $error-color;\r\n$prominent-color: $error-color;\r\n\r\n// Social colors\r\n$facebook-color: #3a5a93;\r\n$twitter-color: #55aace;\r\n$instagram-color: #405de6;\r\n$pinterest-color: #bd081c;\r\n$youtube-color: #e52d27;\r\n$google-plus-color: #dd4b39;\r\n$yelp-color: #af0606;\r\n\r\n\r\n// [EEE] Appearance\r\n// ---\r\n\r\n$font-color: $neutral-60;\r\n$font-color-light: $neutral-12;\r\n\r\n$link-color: $ui-brand-color;\r\n$active-link-color: $dark-accent-color;\r\n\r\n$focus-color: $brand-color;\r\n\r\n$border-color: $neutral-20;\r\n$border-radius: 4px;\r\n\r\n$input-background-color: $neutral-00;\r\n$input-border-color: $border-color;\r\n$focused-input-border-color: $secondary-brand-color;\r\n$disabled-input-color: $neutral-40;\r\n$disabled-input-background-color: $neutral-15;\r\n$disabled-button-background-color: $neutral-15;\r\n$add-to-cart-button-background-color: #f7ae3a;\r\n$horizontal-input-padding: $unit;\r\n$vertical-input-padding: $unit;\r\n\r\n$background-color: $neutral-12;\r\n$overlay-color: rgba($neutral-00, 0.85);\r\n\r\n\r\n// [FFF] Z-Index\r\n// ---\r\n\r\n// Organizes z-index usage by name. Values can be incremented/decremented\r\n// slightly as necessary. eg. $z1-layer + 1;\r\n\r\n$z1-depth: 1; // background\r\n$z2-depth: 10; // icon or other ui element\r\n$z3-depth: 100; // modal shade or similar\r\n$z4-depth: 1000; // modal dialog or similar\r\n\r\n\r\n// [GGG] Shorthands\r\n// ---\r\n\r\n$border: 1px solid $border-color;\r\n$light-border: 1px solid $neutral-15;\r\n$input-padding: $vertical-input-padding $horizontal-input-padding;\r\n\r\n$box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);\r\n$large-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.3);\r\n$inset-box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.3), inset 0 -2px 2px -2px rgba(0, 0, 0, 0.3);\r\n$input-box-shadow: inset 0 0 5px 0 rgba(0, 0, 0, 0.3);\r\n$themeColor-Light: #f3e2c7;\r\n$themeColor-Dark:#252525;\r\n$theme-font: verdana, sans-serif;\r\n$theme-supplementer: #f39c12;\r\n$font-size-desktop-h5: 1.25em;\r\n$font-size-mobile-h5: 0.8em;\r\n$font-size-desktop-p: 1.1em;\r\n$font-size-mobile-p: 0.7em;\r\n","@import './../../../styles/variables';\r\n\r\n.c-Plp__c-Header__c-CartIcon {\r\n // margin-left: 1rem;\r\n position: relative;\r\n\r\n .c-Plp__c-Header__c-CartIcon__badge {\r\n position: absolute;\r\n top: -7px;\r\n right: -9px;\r\n padding: 0px 5px;\r\n border-radius: 50%;\r\n background-color: $prominent-color;\r\n color: $neutral-00;\r\n font-size: $smaller-font-size;\r\n }\r\n\r\n .fa-shopping-cart {\r\n float: right;\r\n }\r\n}\r\n","@import './../../../styles/variables';\r\n\r\n.c-Footer {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n position: fixed;\r\n left: 0;\r\n bottom: 0;\r\n width: 100%;\r\n background-color: $brand-color;\r\n color: $font-color-light;\r\n padding: 0.7em;\r\n\r\n p {\r\n margin-bottom: 0;\r\n font-weight: bold;\r\n }\r\n}\r\n","@import './../../../styles/variables';\r\n\r\n.c-Plp__c-SortAndFilterPanel {\r\n text-align: center;\r\n .c-Plp__c-SortAndFilterPanel__tool {\r\n padding: 0.8rem;\r\n font-size: $font-size;\r\n font-weight: $bold-font-weight;\r\n border: 1px solid $neutral-17;\r\n .c-Plp__c-SortAndFilterPanel__toolContent {\r\n margin-bottom: 0;\r\n }\r\n }\r\n\r\n // .ripple {\r\n // background-color: $shocking-pink;\r\n // width: 1rem;\r\n // height: 1rem;\r\n // position: absolute;\r\n // border-radius: 50%;\r\n // transform: translateX(-100%) translateY(-100%);\r\n // mix-blend-mode: screen;\r\n // animation: ripple 1000ms ease-out forwards;\r\n // }\r\n \r\n // @keyframes ripple {\r\n // 0% { transform: translate(-100%, -100%); }\r\n // 80% { transform: translate(-100%, -100%) scale(50); }\r\n // 100% { transform: translate(-100%, -100%) scale(50); opacity: 0; }\r\n // }\r\n}\r\n","@import './../../../styles/variables';\r\n\r\n.c-SortModal {\r\n // transform: translate(0,0);\r\n // transition: transform .3s ease-out,-webkit-transform .3s ease-out;\r\n\r\n &.modal {\r\n &.show {\r\n display: block;\r\n background-color: rgba(0,0,0,0.5);\r\n }\r\n // &.fade .modal-dialog {\r\n // transition: transform .3s ease-out;\r\n // }\r\n .modal-dialog {\r\n pointer-events: auto;\r\n .modal-body {\r\n color: $neutral-40;\r\n .error {\r\n color: $error-color;\r\n font-size: $small-font-size;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.ReactModal__Overlay {\r\n opacity: 0;\r\n transition: all 0.3s ease-in-out;\r\n }\r\n \r\n &.ReactModal__Overlay--after-open {\r\n opacity: 1;\r\n }\r\n \r\n &.ReactModal__Overlay--before-close {\r\n opacity: 0;\r\n }\r\n}\r\n","@import './../../../styles/variables';\r\n\r\n.c-FilterModal {\r\n &.modal {\r\n &.show {\r\n display: block;\r\n background-color: rgba(0,0,0,0.5);\r\n }\r\n // &.fade .modal-dialog {\r\n // transition: transform .3s ease-out;\r\n // }\r\n .modal-dialog {\r\n pointer-events: auto;\r\n .modal-body {\r\n color: $neutral-40;\r\n padding: 1rem;\r\n .error {\r\n color: $error-color;\r\n font-size: $small-font-size;\r\n }\r\n .input-range {\r\n margin: 25px 0;\r\n font-weight: $bold-font-weight;\r\n font-size: $small-font-size;\r\n .input-range__label-container {\r\n font-family: $font-family;\r\n }\r\n \r\n .input-range__label {\r\n top: 20px;\r\n &.input-range__label--value {\r\n top: -40px;\r\n }\r\n &.input-range__label--max {\r\n right: 2em;\r\n }\r\n }\r\n }\r\n .c-FilterModal__input-range__subtitle {\r\n font-size: $font-size;\r\n font-weight: $bold-font-weight;\r\n text-align: center;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.ReactModal__Overlay {\r\n opacity: 0;\r\n transition: all 0.3s ease-in-out;\r\n }\r\n \r\n &.ReactModal__Overlay--after-open {\r\n opacity: 1;\r\n }\r\n \r\n &.ReactModal__Overlay--before-close {\r\n opacity: 0;\r\n }\r\n}\r\n","@import './../../../styles/variables';\r\n\r\n.c-ItemPrice {\r\n line-height: $smaller-font-size;\r\n margin-bottom: 0.9rem;\r\n display: flex;\r\n align-items: baseline;\r\n .c-ItemPrice__price {\r\n font-size: $small-font-size;\r\n font-weight: $bold-font-weight;\r\n padding-right: 0.5rem;\r\n }\r\n \r\n .c-ItemPrice__price--strikethrough {\r\n color: $neutral-40;\r\n font-weight: $bold-font-weight;\r\n font-size: $smaller-font-size;\r\n text-decoration: line-through;\r\n // margin-left: $unit * 0.8; \r\n }\r\n \r\n .c-ItemPrice__discount {\r\n color: #4aa219;\r\n font-weight: $bold-font-weight;\r\n font-size: $smaller-font-size;\r\n margin-left: auto;\r\n }\r\n}\r\n","@import './../../../styles/variables';\r\n\r\n.c-Plp__c-ProductContainer__c-ProductTile {\r\n padding: 10px 15px;\r\n border: 1px solid $neutral-17;\r\n margin-bottom: 4rem;\r\n cursor: pointer;\r\n\r\n &.c-Plp__c-ProductContainer__c-ProductTile--shadow {\r\n // box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);\r\n box-shadow: 0 5px 5px rgba(0, 0, 0, 0.12), 0 4px 11px rgba(0, 0, 0, 0.24);\r\n transition: all 0.3s cubic-bezier(.25,.8,.25,1);\r\n &:hover {\r\n box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);\r\n }\r\n }\r\n\r\n .c-Plp__c-ProductContainer__c-ProductTile__image {\r\n margin-bottom: 0.7rem;\r\n }\r\n\r\n .c-Plp__c-ProductContainer__c-ProductTile__name {\r\n font-size: $small-font-size;\r\n }\r\n\r\n .btn__addToCart {\r\n display: block;\r\n margin: 0 auto;\r\n border-radius: 20px;\r\n padding: 7px;\r\n background-color: $add-to-cart-button-background-color;\r\n cursor: pointer;\r\n font-size: $smaller-font-size;\r\n font-weight: $bold-font-weight;\r\n }\r\n \r\n .btn__addToCart:hover {\r\n opacity: 0.7;\r\n }\r\n\r\n @media only screen and (min-width: 768px) {\r\n border: none;\r\n &:not(:last-child) {\r\n margin-right: 2em;\r\n }\r\n }\r\n}\r\n","@import './../../../styles/variables';\r\n\r\n.c-Plp__c-ProductContainer {\r\n margin-bottom: 46px;\r\n\r\n .c-Cart__emptyPlp {\r\n background: $neutral-00;\r\n margin-top: 25%;\r\n border: 1px solid black;\r\n text-align: center;\r\n padding: 1em;\r\n\r\n .c-Cart__emptyPlp__information {\r\n color: $neutral-40;\r\n }\r\n }\r\n\r\n .c-Plp__c-ProductContainer__infoContainer {\r\n background: $neutral-00;\r\n color: $success-color;\r\n padding: 1em;\r\n font-weight: $bold-font-weight;\r\n\r\n .c-Plp__c-ProductContainer__information {\r\n display: inline-block;\r\n margin-bottom: 8px;\r\n }\r\n }\r\n\r\n .c-Plp__c-ProductContainer__btnClearSearch {\r\n display: block;\r\n margin: 0 auto;\r\n border-radius: 20px;\r\n padding: 7px 20px;\r\n background-color: $brand-color;\r\n color: $neutral-12; \r\n cursor: pointer;\r\n font-size: $smaller-font-size;\r\n font-weight: $bold-font-weight;\r\n }\r\n\r\n .row {\r\n justify-content: space-evenly;\r\n }\r\n\r\n @media only screen and (min-width: 768px) {\r\n .c-Cart__emptyPlp {\r\n margin-top: 0;\r\n width: 75%;\r\n margin-left: auto;\r\n margin-right: auto;\r\n \r\n }\r\n }\r\n}\r\n","@import './../../../styles/variables';\r\n\r\n.c-ProductContainerWithTools {\r\n\r\n .c-ProductContainerWithTools__asideCol {\r\n border-right: 2px solid #ddd;\r\n padding-right: 27px;\r\n }\r\n .c-SortTool__content {\r\n padding: 20px;\r\n .c-SortTool__header {\r\n margin-right: 3rem;\r\n\r\n .c-SortTool__title {\r\n font-weight: $bold-font-weight;\r\n font-size: $big-font-size;\r\n }\r\n }\r\n .radio {\r\n display: inline;\r\n margin-right: 2.5rem;\r\n input[type=radio] {\r\n display: none;\r\n }\r\n\r\n label {\r\n color: $neutral-40;\r\n padding: 5px;\r\n }\r\n\r\n .c-SortTool__body__label {\r\n border-bottom: 1px solid $brand-color;\r\n color: $brand-color;\r\n }\r\n }\r\n\r\n .c-SortTool__header, .c-SortTool__title, .c-SortTool__body, .c-SortTool__body>.container, .c-SortTool__body>.container.radio {\r\n display: inline-block;\r\n }\r\n }\r\n\r\n .c-FilterTool__content {\r\n padding: 1rem;\r\n .c-FilterTool__body {\r\n color: $neutral-40;\r\n margin: 3em 0;\r\n .input-range {\r\n // margin: 25px 0;\r\n font-weight: $bold-font-weight;\r\n font-size: $small-font-size;\r\n .input-range__label-container {\r\n font-family: $font-family;\r\n }\r\n\r\n .input-range__label {\r\n top: 20px;\r\n &.input-range__label--value {\r\n top: -40px;\r\n }\r\n &.input-range__label--max {\r\n right: 2em;\r\n }\r\n }\r\n }\r\n .c-FilterModal__input-range__subtitle {\r\n font-size: $font-size;\r\n font-weight: $bold-font-weight;\r\n text-align: center;\r\n margin-top: 1em;\r\n }\r\n }\r\n .c-FilterTool__footer {\r\n text-align: center;\r\n button {\r\n border-radius: 22px;\r\n padding: 9px 29px;\r\n }\r\n }\r\n }\r\n}\r\n"]} |