From ecbd9d33e40c8818f730eae7f48d30102bff40e5 Mon Sep 17 00:00:00 2001 From: Brandon Comerford Date: Thu, 28 Sep 2023 21:54:41 -0500 Subject: [PATCH] Cornerstone update 5.6.0 (#49) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * feat(storefront)BCTHEME75: add keyboard focus on write-a-review modal (#1835) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront)bctheme-225:fix filter top outline on focus (#1829) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront)BCTHEME-224: change role for sort by select (#1837) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront):bctheme-212 fix rating icons focus border (#1819) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront)BCTHEME-216: fix outline styles for breadcrumbs on focus (#1824) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * Fixed merge conflict * feat(content): MERC-7162 Add header bottom global region * Removed broken import from tools.scss file * BCTHEME-213 Add Info and Add Coupon forms on Cart Page tabbable when hidden (#1820) * Releasing 4.11.0-rc.1 * Update GitHub Action to use Node 12 Node 12 is now supported for Stencil CLI, so we'll use it for this action going forward. * Add examples of useful GitHub Actions for theme development * Releasing 4.11.0 * fix(payments): INT-3211 Change width size for apple pay button * Update Changelog * feat(storefront): STRF-8630 update cornerstone to be compatible with handlebars v4 * fix(storefront): BCTHEME-197 Logo focus of voice over has wrong (100% of the screen) width (#1831) * fix(storefront): BCTHEME-222 Rating and Other filter sections are not accessible by keyboard (#1838) * BCTHEME-210 Carousel hidden when one or more of its images not found (#1816) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * BCTHEME-214 Wishlist first option has no bottom outline when in focus (#1825) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-217 Product link has incorrect voice over focus on Cart Page (#1830) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-172 Card content truncated on zooming browser to 400% (#1803) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * BCTHEME-185 Sort By dropdowns need visual focus border (#1833) * BCTHEME-188 Product cards should link to products (#1842) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * BCTHEME-184 Options on change modal need focus border (#1839) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * BCTHEME-199 Zooming and scaling must not be disabled (#1843) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * BCTHEME-202 Notification of number of products not announced (#1845) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * BCTHEME-190 Content should not scroll in two directions when zoomed (#1853) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * feat(storefront)BCTHEME-205: add filter reset announcement (#1858) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * feat(storefront) BCTHEME-206: add announcement fot filtered result on Shop-by-price (#1854) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront)BCTHEME-164: fix image in modal for IE11 (#1840) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-279 fix logo displaying (#1865) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * feat(storefront):add to cart notification (#1860) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * BCTHEME-44 Cornerstone quick view (#1857) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-277 Certain Special Characters not rendering under Wishlists (#1873) * fix(storefront): BCTHEME-219 Social icons not clickable in modal after reopening (#1874) * fix(storefront): BCTHEME-282 Fix aria-labels for collapsibleFactory elements (#1868) * BCTHEME-269 Remove layout shifts to improve CLS indicator from Lighthouse performance report (#1869) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-233 Cornerstone - Unable to Compare Products from Recently Viewed Items (#1877) * feat(storefront): BCTHEME-290 add aria labelwith price for product list item (#1878) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * BCTHEME-209 Search result not notified by screen reader (#1867) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-289 Add aria label with price to Product Grid Item (#1875) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-268 Update carousel images to improve LCP indicator from Lighthouse performance report (#1876) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * feat(storefront): BCTHEME-187 improve localization and add default and fallback messages (#1850) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-297 Cornerstone 4.11.0 - Product Image Carousel Becomes Unresponsive on Product Page (#1879) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * Resolved issues after merging PRs for 4.12 release * Releasing 4.12.0-rc.1 * Reduce lodash usage in compare-products.js and image-gallery.js * Releasing 4.12.0-rc.2 * Releasing 4.12.0-rc.3 * Releasing 4.12.0-rc.4 * Upload bundle analysis as part of github action * feat(search): ES-1590 display error message if search fails * feat: (STRF-8747) add new stencil config files to .gitignore * Releasing 4.12.0 * Revert "Releasing 4.12.0" * feat(storefront): BCTHEME-299 update changelog for release 4.12 * Releasing 4.12.0 * Updated CHANGELOG.md before 4.12 release * Reverting cornerstone version to 4.12-rc.4 * Releasing 4.12.0 * Reverting 4.12 changes * Releasing 4.12.0 * Reverted 4.12 release commit and updated package.json versions * Releasing 4.12.0 * Revert fix(storefront): BCTHEME-219 Social icons not clickable in modal * Don't load social icons in quick view * Bump stencil-utils * fix(storefront): BCTHEME-305 Price Lists - Price in the cart is not updated when changing currency on mobile * fix(storefront): BCTHEME-314 ccount >Payment Methods throws Server Error when using Cornerstone theme (#1898) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-315 Write a Review modal cause TypeError (#1899) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * Releasing 4.12.1 * feat(payments): PAYPAL-712 Checkout page - Smart Payment Button styli… (#1866) feat(payments): PAYPAL-712 Checkout page - Smart Payment Button styling (Cornerstone) * feat(storefront): BCTHEME-116 move tax field after grand total when tax inclusive (#1903) * fix(storefront): BCTHEME-105 Cornerstone - Body text size above 14px is cut off on cart shipping dropdowns (#1881) * feat(storefront): BCTHEME-69 Add tooltips for carousel bullets (buttons) (#1889) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-319 Write a review modal extra executions (#1902) (#1902) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-232 Faceted search filters are hidden from screen readers (#1897) * fix(storefront): BCTHEME-292 Social icon tooltip displaying should be fixed (#1907) * BCTHEME-293 Product list item Quick view button is not tabbable (#1900) (#1900) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-273 fix contrast ratio for Skip to Main Content element (#1880) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * feat(storefront): BCTHEME-275 add upsell banner contrast (#1891) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-274 fix contranst ratio for brand name (#1882) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-288 Shoppers are not anchor-linked to reviews on PDPs if product description tabs are enabled (#1883) * fix(storefront): BCTHEME-308 HTML Entity displayed as is via system/error message on a Storefront (#1888) * STRF-8769 Moved zoomSize and productSize to the upper level, cause product.js is not availabe on the Quick View (#1884) * Bump versions of Ruby (#1905) To fix issue #1904 * Changelog update * fix(storefront): BCTHEME-104 Selecting product options doesn't update image on PDP in Internet Explorer (#1913) * fix(storefront): BCTHEME-11 hide product options that are out of stock on cart (#1911) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-301 Header content placed out of the header block on mobile (#1908) (#1908) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-85 “Sort by” dropdown selection not reflected on search results page for News and Information tab (#1910) (#1910) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-86 Cornerstone - Text hover color does not change when Dropdown menu display mode is set to Alternative (#1918) (#1918) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-321 fix social icon tooltip overlaying (#1914) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * Resolving eslint error after merging * fix(storefront): BCTHEME-30 fix misaligned tooltip for required product option (#1915) Co-authored-by: yurytut1993 <66325265+yurytut1993@users.noreply.github.com> * fix(storefront): BCTHEME-87 Product images squashed in Category view in AMP (#1921) (#1921) * fix(storefront): BCTHEME-313 Parse HTML entities in jsContext (#1917) * Added Changelog item for BCTHEME-313 * Releasing 5.0.0-rc.1 * feat(payments): PAYPAL-823 Add new banner on the cart page (#1901) * Releasing 5.0.0-rc.2 * Releasing 5.0.0 * feat(storefront): BCTHEME-304 add pagination for wishlists (#1906) * fix(storefront): BCTHEME-341 fix placeholder contrast ratio (#1933) * fix(storefront): BCTHEME-37 Cornerstone - Image Zoom Does Not Work on Internet Explorer (#1923) (#1923) * feat(storefront): BCTHEME-306 show price range on option selection (#1924) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-16 Cornerstone - loading of thumbnail image delayed on cart page (#1925 (#1925) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-193 fix not being able to change product qty with keyboard multiple times (#1927) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-345 define a main region on pages (#1929) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * fix(storefront): BCTHEME-346 add announcement for shipping estimator error messages (#1932) Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> * feat(storefront): BCTHEME-343 No tooltips provided for carousel buttons (#1934) (#1934) * feature(storefront): Empty cart message not read by screen reader (#1935) (#1935) * feat(storefront): BCTHEME-344 Carousel buttons do not receive focus (#1937) (#1937) * fix(storefront): BCTHEME-155 fix recaptcha announcement for hidden content (#1943) * fix(storefront): BCTHEME-379 fix non-text contrast on add to cart button (#1946) * fix(storefront): BCTHEME-369 fix announcement on adding to cart by screen reader (#1950) * feat(storefront): BCTHEME-373 Alt text not provided for ratings (#1949) * feat(storefront): BCTHEME-78 Add Play/Pause button to carousel (#1944) * fix(storefront): BCTHEME-366 Error message on PLPs not announced by screen reader (#1956) * fix(storefront): BCTHEME-361 fix subscription message announcement (#1952) * feat(payments): PAYPAL-903 Product Page Banners (Cornerstone) - creat… (#1948) * feat(payments): PAYPAL-903 Product Page Banners (Cornerstone) - create custom price event * feat(payments): PAYPAL-903 Product Page Banners (Cornerstone) - create custom price event - CR fixes Co-authored-by: Alex Saiannyi <67792608+bc-alexsaiannyi@users.noreply.github.com> * BCTHEME-327: PDP - Empty "Description" is Hiding All Tabs When in Tab View (#1947) * feat(storefront): BCTHEME-388 Dots on carousel should have similar colours as other slider controls (#1958) * fix(storefront): BCTHEME-384 When default option is out of stock add to cart button does not populate for in stock options (#1955) * fix(storefront): BCTHEME-383 Selecting certain option types pushes window view to the bottom of the page (#1959) * Fixed merge conflict * STRF-8898 'Show More' gives no additional options when filter clicked (#1945) * Releasing 5.1.0-rc.1 * BCTHEME-387: Updates Cornerstone variants to meet the updated verticals outlined in BCTHEME-387. (#1962) Co-authored-by: Dante Muñoz * Releasing 5.1.0-rc.2 * Releasing 5.1.0 * feat(storefront): STRF-8948 Fix Sort By on Search Page (#1971) * fix(storefront): BCTHEME-368 fix announcement for shop by price filter selection (#1966) * fix(storefront): BCTHEME-207 fix focus on sort by (#1964) * fix(storefront): BCTHEME-385 move a phrase from html to en.json (#1972) * feat(storefront): BCTHEME-390 Integrate accessibility scripts to product images slider on PDP (#1965) * fix(storefront): BCTHEME-354 If multiple Pick List Options are applied, customers cannot select 'none' on both (#1975) * fix(storefront): BCTHEME-356 Required checkbox message blocks the checkbox (#1963) * Updated Changelog PR link for BCTHEME-212 Fixed review rating icons focus border. * feat(storefront): BCTHEME-391 Move focus on filter items Modal after show more button was clicked and accessibility refactoring (#1977) * feat(storefront) BCTHEME-381 add suffient text for swatch option (#1976) * fix(storefront): BCTHEME-398 Make every product option group id unique (#1979) * fix(storefront): BCTHEME-264 fix update discount banner on PDP (#1974) * fix(storefront): BCTHEME-372 Error message not announced automatically (#1983) * fix(storefront): BCTHEME-400 If product options are not required, the 'None' option will remain selected even if another option is chosen (#1980) * fix(storefront): BCTHEME-334 Add alt attribute for no image placeholders (#1984) * fix(storefront): BCTHEME-401 Category pages are creating alt attribute within the span tag (#1987) * fix(storefront): BCTHEME-362 fix cut off cart button on zooming 400 (#1988) * Releasing 5.2.0-rc.1 * Releasing 5.2.0 * Reverting 5.2.0 to 5.2.0-rc.1 * Releasing 5.2.0 * Revert "Releasing 5.2.0" * Releasing 5.2.0 * Revert "Releasing 5.2.0" 2nd time * Releasing 5.2.0 * feat(storefront): BCTHEME-200 add notifications announcement on carousel change (#1986) * fix(storefront): BCTHEME-392 fixed line breaks on Dropdown Menu (#1996) * fix(storefront): BCTHEME-347 Add unique identifiers to product cards (#1999) * fix(storefront): BCTHEME-409 Update focus trap in Modal (#1998) * fix(search): ES-2031 add error message for when star search is not availabble in facted search * feat(search): ES-1590 render error msg for brand page * fix(search): ES-2031 make search error more generic * feat(search): ES-2031 add change to changelog * feat(storefront): BCTHEME-322 add sold-out badges for products on PLP (#2003) * BCTHEME-426: Insufficient link text for "Read More" links (#2012) * BCTHEME-422: Announce email field as mandatory (#2011) * BCTHEME-420: 'Skip to main content' is not visible (#2010) * fix(storefront): BCTHEME-427 Insufficient button label on cart page (#2013) * feat(storefront): BCTHEME-231 Add placeholder for failed to load carousel images and update scalability (#2009) * fix(storefront): BCTHEME-429 Unlabelled edit fields on cart page (#2016) * fix(storefront): BCTHEME-428 Insufficient link text on cart page (#2014) * fix(storefront): BCTHEME-424 Alt text should include product name for ratings (#2015) * fix(storefront): IE11 - Clicking on Search Does Not Display Search Bar (#2017) * Releasing 5.3.0-rc.1 * Fixing 'Skip to main' content mobile display * Releasing 5.3.0-rc.2 * Releasing 5.3.0 * Revert Releasing 5.3.0 * Remove AddThis for social sharing, replace with provider sharing links (#1997) * Updated changelog * Releasing 5.3.0 * fix(search): ES-2071 removed adding selected filters for price filter since not needed (#2018) * fix(storefront): BCTHEME-431 remove horizontal scroll on swatch options PDP (#2023) * fix(search): ES-2138 fixed count showing issue for category facet * fix(storefront): BCTHEME-349 improve email validation for forms (#2029) * feat(storefront): BCTHEME-445 replace page builder ssl settings with new global region for html widget (#2026) * fix(storefront): BCTHEME-447 extend keyboard support for radio buttons (#2028) * feat(storefront): BCTHEME-446 Improve performance of analyzing homepage carousel image (#2027) * fix(storefront): BCTHEME-395 Wish List drop down is truncated on product page (#2001) * fix(storefront): BCTHEME-434 Hamburger Menu Icon missing on Google AMP Pages (#2022) * fix(storefront): BCTHEME-449 remove main tag duplicates (#2032) * feat(storefront): BCTHEME-425 Incorrect focus order for product carousels (#2034) * Releasing 5.4.0-rc.1 * fix(storefront): DEV-426 Fix GitHub workflows for default storefront * Releasing 5.4.0 * fix(storefront): BCTHEME-325 Apple pay button displaying needs to be fixed (#2043) * fix(storefront): BCTHEME-457 Update focus tooltip styles contrast to achieve accessibility AA Complaince (#2047) * Use https:// for schema markup (#2039) * fix(storefront): BCTHEME-423 Search result on search page not notified by screen reader (#2024) * feat(payment): PAYPAL-968 added banner widgets to page builder (#2021) * fix(storefront): bctheme-448 fix multiple swatch options (#2040) * feat(storefront): BCTHEME-476 Scale focus trap for all modals (#2049) * Releasing 5.5.0-rc.1 * Releasing 5.5.0 * fix(storefront): BCTHEME-496 Translation Gap: Delete from Cart confirmation popup. (#2065) * fix(storefront): BCTHEME-512 add translation for invalid quantity value error on cart (#2062) * fix(storefront): BCTHEME-459 fix product quantity change error (#2052) * Fix eslint grunt check * build(deps): bump underscore from 1.12.0 to 1.13.1 (#2053) * Updated CHANGELOG.md for #2052 * fix(storefront): BCTHEME-514 Translation Gap: Gift Certificate -> Code required message (#2064) * fix(storefront): BCTHEME-490 Translation Gap: Compare products error message (#2061) Co-authored-by: yurytut1993 <66325265+yurytut1993@users.noreply.github.com> * fix(storefront): BCTHEME-492 Translation Gap: Compare page fields (Description, Rating and Availability) (#2059) * fix(storefront): BCTHEME-479 Logo on AMP Product details page (PDP) does not fit header (#2054) * fix(storefront): BCTHEME-477 Add to cart button and Wishlist should be on one line on desktop (#2050) * fix(storefront): BCTHEME-535 Translation Gap: Cart -> Shipping estimator error messages. (#2066) * fix(storefront): BCTHEME-507 Translation Gap: Account -> Wish List -> Name required message. (#2060) * fix(storefront): BCTHEME-452 Unable to select 'None' on unrequired Swatch Options (#2068) * Fix eslint errors in cart.js, shipping-estimator.js and test in cart.spec.js (#2072) * fix(storefront): STRF-9126 Facebook social share returns an error for blog pages * fix(storefront): BCTHEME-544 fix potential shift on change options modal on Cart (#2071) * fix(storefront): BCTHEME-543 Product images in quick view can be squashed (#2075) * fix(storefront): BCTHEME-601 Enter press on Compare checkbox cause quick view opening (#2074) * feat(storefront): BCTHEME-608 Translation mechanism for config.json values should be implemented (#2076) * Update CHANGELOG.md * Updated CHANGELOG.md for #2024 * Releasing 5.6.0-rc.1 * Add missing quotes for Country and State/Province fields of Shipping Estimator to pass functional tests (#2079) * Releasing 5.6.0-rc.2 * Releasing 5.6.0 --------- Co-authored-by: Alex Saiannyi <67792608+bc-alexsaiannyi@users.noreply.github.com> Co-authored-by: BC-tymurbiedukhin <66319629+BC-tymurbiedukhin@users.noreply.github.com> Co-authored-by: Tymur Biedukhin Co-authored-by: Erik Christensen Co-authored-by: Juned Kazi Co-authored-by: yurytut1993 <66325265+yurytut1993@users.noreply.github.com> Co-authored-by: Nathan Booker Co-authored-by: Nathan Booker Co-authored-by: Marco Loyo Co-authored-by: Jairo Panduro Co-authored-by: Pascal Zajac Co-authored-by: Yurii Zusik Co-authored-by: sacr3dc0w Co-authored-by: alex.saiannyi Co-authored-by: Kevin Wang Co-authored-by: MaxGenash Co-authored-by: David Huynh Co-authored-by: Andrii Fetisov <54856617+bc-fetisov@users.noreply.github.com> Co-authored-by: jairo-bc <68893868+jairo-bc@users.noreply.github.com> Co-authored-by: Andrew A. Barber Co-authored-by: Brian Davenport Co-authored-by: Olga Lashkul <32959076+helga1507@users.noreply.github.com> Co-authored-by: Dante Munoz <35115108+DanteMunoz@users.noreply.github.com> Co-authored-by: Dante Muñoz Co-authored-by: Nataliya Solyanik Co-authored-by: bc-krishsenthilraj <39140274+bc-krishsenthilraj@users.noreply.github.com> Co-authored-by: Senthil Krishnasamy Co-authored-by: Yevhenii Buliuk <82589781+bc-yevhenii-buliuk@users.noreply.github.com> Co-authored-by: Andrii Vitvitskyi Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: bc-vlad-dlogush <83779098+bc-vlad-dlogush@users.noreply.github.com> --- .../poll_for_changed_configuration.yml | 5 -- CHANGELOG.md | 19 ++++++ assets/js/test-unit/theme/cart.spec.js | 4 ++ assets/js/theme/account.js | 2 +- assets/js/theme/brand.js | 2 +- assets/js/theme/cart.js | 36 +++++++++--- assets/js/theme/cart/shipping-estimator.js | 7 ++- assets/js/theme/category.js | 2 +- .../common/gift-certificate-validator.js | 2 +- assets/js/theme/common/models/forms.js | 39 +++++++++++++ assets/js/theme/common/product-details.js | 58 ++++++++++++------- assets/js/theme/common/utils/form-utils.js | 5 +- .../theme/common/utils/translations-utils.js | 24 ++++++++ assets/js/theme/compare.js | 2 +- assets/js/theme/gift-certificate.js | 6 +- assets/js/theme/global.js | 16 ++++- assets/js/theme/global/compare-products.js | 14 ++--- assets/js/theme/global/quick-view.js | 13 ++++- assets/js/theme/product/share.js | 3 - assets/js/theme/search.js | 2 +- assets/js/theme/wishlist.js | 2 +- .../scss/components/citadel/forms/_forms.scss | 4 ++ .../stencil/heroCarousel/_heroCarousel.scss | 28 +++++++++ .../stencil/productView/_productView.scss | 26 ++++++++- config.json | 4 +- lang/en.json | 34 ++++++++--- package-lock.json | 4 +- package.json | 2 +- .../components/account/add-wishlist.html | 2 + .../components/amp/common/store-logo.html | 2 +- templates/components/amp/css/form.html | 3 + templates/components/amp/css/header.html | 21 +++++-- templates/components/amp/products/card.html | 2 + templates/components/amp/products/list.html | 2 + .../components/brand/product-listing.html | 4 ++ .../cart/gift-certificate-input.html | 2 +- .../components/cart/shipping-estimator.html | 3 + .../components/category/product-listing.html | 2 + templates/components/common/footer.html | 5 -- templates/components/common/share.html | 2 +- .../components/products/add-to-cart.html | 5 +- templates/components/products/card.html | 15 ++++- .../components/products/description-tabs.html | 8 ++- templates/components/products/list-item.html | 20 +++++-- templates/components/products/list.html | 2 + .../components/products/options/swatch.html | 8 +-- .../components/products/price-range.html | 40 ++++++++++--- templates/components/products/price.html | 32 +++++++--- .../products/product-aria-label.html | 44 ++++++++------ .../components/products/product-badge.html | 21 ++++++- .../components/search/product-listing.html | 2 + templates/pages/cart.html | 2 + templates/pages/compare.html | 6 +- templates/pages/home.html | 8 ++- 54 files changed, 476 insertions(+), 152 deletions(-) delete mode 100644 assets/js/theme/product/share.js diff --git a/.github/workflow-examples/poll_for_changed_configuration.yml b/.github/workflow-examples/poll_for_changed_configuration.yml index 6420f8d96a..714d9d69cc 100644 --- a/.github/workflow-examples/poll_for_changed_configuration.yml +++ b/.github/workflow-examples/poll_for_changed_configuration.yml @@ -49,13 +49,8 @@ jobs: TOKEN: ${{ secrets.STENCIL_ACCESS_TOKEN_PRODUCTION }} run: stencil init -u $URL -t $TOKEN -p 3000 -<<<<<<< HEAD - - name: Check for an updated configuration on the live store - run: stencil pull -======= - name: Check for an updated configuration on the live default storefront (channel ID 1) run: stencil pull -c 1 ->>>>>>> 5.5.0 - name: Create Pull Request id: cpr diff --git a/CHANGELOG.md b/CHANGELOG.md index 589491997a..1ad4d1dbb4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,24 @@ ## Draft +## 5.6.0 (06-15-2021) +- Translation mechanism for config.json values have been implemented. [#2076](https://github.com/bigcommerce/cornerstone/pull/2076) +- Enter press on Compare checkbox cause quick view opening. [#2074](https://github.com/bigcommerce/cornerstone/pull/2074) +- Product images in quick view can be squashed. [#2075](https://github.com/bigcommerce/cornerstone/pull/2075) +- Fixed shift in change options popup on Cart page.[#2071](https://github.com/bigcommerce/cornerstone/pull/2071) +- Fixed possibility to select 'None' on multi unrequired Swatch Options. [#2068](https://github.com/bigcommerce/cornerstone/pull/2068) +- Translation Gap: Account -> Wish List -> Name required message. [#2060](https://github.com/bigcommerce/cornerstone/pull/2060) +- Translation Gap: Cart -> Shipping estimator error messages. [#2066](https://github.com/bigcommerce/cornerstone/pull/2066) +- Add to cart button and Wishlist should be on one line on desktop. [#2050](https://github.com/bigcommerce/cornerstone/pull/2050) +- Logo on AMP Product details page (PDP) doesn't fit header. [#2054](https://github.com/bigcommerce/cornerstone/pull/2054) +- Translation Gap: Compare page fields (Description, Rating and Availability). [#2059](https://github.com/bigcommerce/cornerstone/pull/2059) +- Translation Gap: Compare products error message. [#2061](https://github.com/bigcommerce/cornerstone/pull/2061) +- Translation Gap: Gift Certificate -> Code required message. [#2064](https://github.com/bigcommerce/cornerstone/pull/2064) +- Added translation for invalid quantity value error on Cart. [#2062](https://github.com/bigcommerce/cornerstone/pull/2062) +- Translation Gap: Delete from Cart confirmation popup. [#2065](https://github.com/bigcommerce/cornerstone/pull/2065) +- Fixed NaN error on increase/decrease product quantity by adding field validation. [#2052](https://github.com/bigcommerce/cornerstone/pull/2052) +- Fixed social share links on blog post. [#2077](https://github.com/bigcommerce/cornerstone/pull/2077) + ## 5.5.0 (05-20-2021) - Scale focus trap for all modals. [#2049](https://github.com/bigcommerce/cornerstone/pull/2049) - Fixed displaying swatch name for multiple swatch options on page. [#2040](https://github.com/bigcommerce/cornerstone/pull/2040) @@ -9,6 +27,7 @@ - Use https:// for schema markup. [#2039](https://github.com/bigcommerce/cornerstone/pull/2039) - Update focus tooltip styles contrast to achieve accessibility AA Complaince. [#2047](https://github.com/bigcommerce/cornerstone/pull/2047) - Apple pay button displaying needs to be fixed. [#2043](https://github.com/bigcommerce/cornerstone/pull/2043) +- Fixed search result on search page not notified by screen reader. [#2024](https://github.com/bigcommerce/cornerstone/pull/2024) ## 5.4.0 (04-26-2021) - Incorrect focus order for product carousels. [#2034](https://github.com/bigcommerce/cornerstone/pull/2034) diff --git a/assets/js/test-unit/theme/cart.spec.js b/assets/js/test-unit/theme/cart.spec.js index 7ae39d7c5c..c4540afb99 100644 --- a/assets/js/test-unit/theme/cart.spec.js +++ b/assets/js/test-unit/theme/cart.spec.js @@ -5,6 +5,10 @@ import Cart from '../../theme/cart.js'; var dataSpy; var UpdateSpy; var c = new Cart(); +c.context = { + shippingCountryErrorMessage: `The 'Country' field cannot be blank.`, + shippingProvinceErrorMessage: `The 'State/Province' field cannot be blank.`, +}; beforeEach(function() { UpdateSpy = spyOn(utils.api.cart, 'itemUpdate'); diff --git a/assets/js/theme/account.js b/assets/js/theme/account.js index a4bc2f13c4..6e2c7d2650 100644 --- a/assets/js/theme/account.js +++ b/assets/js/theme/account.js @@ -33,7 +33,7 @@ export default class Account extends PageManager { const $reorderForm = classifyForm('[data-account-reorder-form]'); const $invoiceButton = $('[data-print-invoice]'); - compareProducts(this.context.urls); + compareProducts(this.context); // Injected via template this.passwordRequirements = this.context.passwordRequirements; diff --git a/assets/js/theme/brand.js b/assets/js/theme/brand.js index 3cddd3d07a..b32d212ab9 100644 --- a/assets/js/theme/brand.js +++ b/assets/js/theme/brand.js @@ -11,7 +11,7 @@ export default class Brand extends CatalogPage { } onReady() { - compareProducts(this.context.urls); + compareProducts(this.context); if ($('#facetedSearch').length > 0) { this.initFacetedSearch(); diff --git a/assets/js/theme/cart.js b/assets/js/theme/cart.js index 139147c404..11eb856c02 100644 --- a/assets/js/theme/cart.js +++ b/assets/js/theme/cart.js @@ -1,9 +1,10 @@ import PageManager from './page-manager'; import { bind, debounce } from 'lodash'; -import giftCertCheck from './common/gift-certificate-validator'; +import checkIsGiftCertValid from './common/gift-certificate-validator'; +import { createTranslationDictionary } from './common/utils/translations-utils'; import utils from '@bigcommerce/stencil-utils'; import ShippingEstimator from './cart/shipping-estimator'; -import { defaultModal, modalTypes } from './global/modal'; +import { defaultModal, ModalEvents } from './global/modal'; import swal from './global/sweet-alert'; import CartItemDetails from './common/cart-item-details'; @@ -90,7 +91,7 @@ export default class Cart extends PageManager { invalidEntry = $el.val(); $el.val(oldQty); return swal.fire({ - text: `${invalidEntry} is not a valid entry`, + text: this.context.invalidEntryMessage.replace('[ENTRY]', invalidEntry), icon: 'error', }); } else if (newQty < minQty) { @@ -157,9 +158,20 @@ export default class Cart extends PageManager { utils.api.productAttributes.configureInCart(itemId, options, (err, response) => { modal.updateContent(response.content); - const $productOptionsContainer = $('[data-product-attributes-wrapper]', this.$modal); - const modalBodyReservedHeight = $productOptionsContainer.outerHeight(); - $productOptionsContainer.css('height', modalBodyReservedHeight); + const optionChangeHandler = () => { + const $productOptionsContainer = $('[data-product-attributes-wrapper]', this.$modal); + const modalBodyReservedHeight = $productOptionsContainer.outerHeight(); + + if ($productOptionsContainer.length && modalBodyReservedHeight) { + $productOptionsContainer.css('height', modalBodyReservedHeight); + } + }; + + if (this.$modal.hasClass('open')) { + optionChangeHandler(); + } else { + this.$modal.one(ModalEvents.opened, optionChangeHandler); + } this.productDetails = new CartItemDetails(this.$modal, context); @@ -275,6 +287,7 @@ export default class Cart extends PageManager { text: string, icon: 'warning', showCancelButton: true, + cancelButtonText: this.context.cancelButtonText, }).then((result) => { if (result.value) { // remove item from cart @@ -365,9 +378,10 @@ export default class Cart extends PageManager { event.preventDefault(); - if (!giftCertCheck(code)) { + if (!checkIsGiftCertValid(code)) { + const validationDictionary = createTranslationDictionary(this.context); return swal.fire({ - text: $certInput.data('error'), + text: validationDictionary.invalid_gift_certificate, icon: 'error', }); } @@ -456,6 +470,10 @@ export default class Cart extends PageManager { this.bindGiftCertificateEvents(); // initiate shipping estimator module - this.shippingEstimator = new ShippingEstimator($('[data-shipping-estimator]')); + const shippingErrorMessages = { + country: this.context.shippingCountryErrorMessage, + province: this.context.shippingProvinceErrorMessage, + }; + this.shippingEstimator = new ShippingEstimator($('[data-shipping-estimator]'), shippingErrorMessages); } } diff --git a/assets/js/theme/cart/shipping-estimator.js b/assets/js/theme/cart/shipping-estimator.js index 8be324d460..b5ff4d4d5d 100644 --- a/assets/js/theme/cart/shipping-estimator.js +++ b/assets/js/theme/cart/shipping-estimator.js @@ -6,11 +6,12 @@ import collapsibleFactory from '../common/collapsible'; import swal from '../global/sweet-alert'; export default class ShippingEstimator { - constructor($element) { + constructor($element, shippingErrorMessages) { this.$element = $element; this.$state = $('[data-field-type="State"]', this.$element); this.isEstimatorFormOpened = false; + this.shippingErrorMessages = shippingErrorMessages; this.initFormValidation(); this.bindStateCountryChange(); this.bindEstimatorEvents(); @@ -63,7 +64,7 @@ export default class ShippingEstimator { cb(result); }, - errorMessage: 'The \'Country\' field cannot be blank.', + errorMessage: this.shippingErrorMessages.country, }, ]); } @@ -85,7 +86,7 @@ export default class ShippingEstimator { cb(result); }, - errorMessage: 'The \'State/Province\' field cannot be blank.', + errorMessage: this.shippingErrorMessages.province, }, ]); } diff --git a/assets/js/theme/category.js b/assets/js/theme/category.js index 345a0a3617..053618bfd6 100644 --- a/assets/js/theme/category.js +++ b/assets/js/theme/category.js @@ -35,7 +35,7 @@ export default class Category extends CatalogPage { this.makeShopByPriceFilterAccessible(); - compareProducts(this.context.urls); + compareProducts(this.context); if ($('#facetedSearch').length > 0) { this.initFacetedSearch(); diff --git a/assets/js/theme/common/gift-certificate-validator.js b/assets/js/theme/common/gift-certificate-validator.js index da49d7fdd7..aad6bf3123 100644 --- a/assets/js/theme/common/gift-certificate-validator.js +++ b/assets/js/theme/common/gift-certificate-validator.js @@ -1,5 +1,5 @@ export default function (cert) { - if (typeof cert !== 'string') { + if (typeof cert !== 'string' || cert.length === 0) { return false; } diff --git a/assets/js/theme/common/models/forms.js b/assets/js/theme/common/models/forms.js index ddb7dfc846..23dc4f3829 100644 --- a/assets/js/theme/common/models/forms.js +++ b/assets/js/theme/common/models/forms.js @@ -22,6 +22,45 @@ const forms = { notEmpty(value) { return value.length > 0; }, + + /** + * validates a field like product quantity + * @param value + * @returns {boolean} + * + */ + numbersOnly(value) { + const re = /^\d+$/; + return re.test(value); + }, + + /** + * validates increase in value does not exceed max + * @param {number} value + * @param {number} max + * @returns {number} + * + */ + validateIncreaseAgainstMaxBoundary(value, max) { + const raise = value + 1; + + if (!max || raise <= max) return raise; + return value; + }, + + /** + * validates decrease in value does not fall below min + * @param {number} value + * @param {number} min + * @returns {number} + * + */ + validateDecreaseAgainstMinBoundary(value, min) { + const decline = value - 1; + + if (!min || decline >= min) return decline; + return value; + }, }; export default forms; diff --git a/assets/js/theme/common/product-details.js b/assets/js/theme/common/product-details.js index c475f6b66e..6f1a3f099b 100644 --- a/assets/js/theme/common/product-details.js +++ b/assets/js/theme/common/product-details.js @@ -5,6 +5,9 @@ import 'foundation-sites/js/foundation/foundation.reveal'; import ImageGallery from '../product/image-gallery'; import modalFactory, { alertModal, showAlertModal } from '../global/modal'; import { isEmpty, isPlainObject } from 'lodash'; +import nod from '../common/nod'; +import { announceInputErrorMessage } from '../common/utils/form-utils'; +import forms from '../common/models/forms'; import { normalizeFormData } from './utils/api'; import { isBrowserIE, convertIntoArray } from './utils/ie-helpers'; import bannerUtils from './utils/banner-utils'; @@ -23,6 +26,12 @@ export default class ProductDetails extends ProductDetailsBase { this.storeInitMessagesForSwatches(); const $form = $('form[data-cart-item-add]', $scope); + + this.addToCartValidator = nod({ + submit: $form.find('input#form-action-addToCart'), + tap: announceInputErrorMessage, + }); + const $productOptionsElement = $('[data-product-option-change]', $form); const hasOptions = $productOptionsElement.html().trim().length; const hasDefaultOptions = $productOptionsElement.find('[data-default]').length; @@ -41,7 +50,10 @@ export default class ProductDetails extends ProductDetailsBase { } }; - $(window).on('load', () => $.each($productSwatchLabels, placeSwatchLabelImage)); + $(window).on('load', () => { + this.registerAddToCartValidation(); + $.each($productSwatchLabels, placeSwatchLabelImage); + }); if (context.showSwatchNames) { this.$swatchOptionMessage.removeClass('u-hidden'); @@ -65,7 +77,11 @@ export default class ProductDetails extends ProductDetailsBase { }); $form.on('submit', event => { - this.addProductToCart(event, $form[0]); + this.addToCartValidator.performCheck(); + + if (this.addToCartValidator.areAll('valid')) { + this.addProductToCart(event, $form[0]); + } }); // Update product attributes. Also update the initial view in case items are oos @@ -85,6 +101,19 @@ export default class ProductDetails extends ProductDetailsBase { this.previewModal = modalFactory('#previewModal')[0]; } + registerAddToCartValidation() { + this.addToCartValidator.add([{ + selector: '[data-quantity-change] > .form-input--incrementTotal', + validate: (cb, val) => { + const result = forms.numbersOnly(val); + cb(result); + }, + errorMessage: this.context.productQuantityErrorMessage, + }]); + + return this.addToCartValidator; + } + storeInitMessagesForSwatches() { if (this.swatchGroupIdList.length && isEmpty(this.swatchInitMessageStorage)) { this.swatchGroupIdList.each((_, swatchGroupId) => { @@ -317,35 +346,20 @@ export default class ProductDetails extends ProductDetailsBase { const quantityMin = parseInt($input.data('quantityMin'), 10); const quantityMax = parseInt($input.data('quantityMax'), 10); - let qty = parseInt($input.val(), 10); - + let qty = forms.numbersOnly($input.val()) ? parseInt($input.val(), 10) : quantityMin; // If action is incrementing if ($target.data('action') === 'inc') { - // If quantity max option is set - if (quantityMax > 0) { - // Check quantity does not exceed max - if ((qty + 1) <= quantityMax) { - qty++; - } - } else { - qty++; - } + qty = forms.validateIncreaseAgainstMaxBoundary(qty, quantityMax); } else if (qty > 1) { - // If quantity min option is set - if (quantityMin > 0) { - // Check quantity does not fall below min - if ((qty - 1) >= quantityMin) { - qty--; - } - } else { - qty--; - } + qty = forms.validateDecreaseAgainstMinBoundary(qty, quantityMin); } // update hidden input viewModel.quantity.$input.val(qty); // update text viewModel.quantity.$text.text(qty); + // perform validation after updating product quantity + this.addToCartValidator.performCheck(); }); // Prevent triggering quantity change when pressing enter diff --git a/assets/js/theme/common/utils/form-utils.js b/assets/js/theme/common/utils/form-utils.js index f750b66431..bebb29a536 100644 --- a/assets/js/theme/common/utils/form-utils.js +++ b/assets/js/theme/common/utils/form-utils.js @@ -135,8 +135,9 @@ function announceInputErrorMessage({ element, result }) { } const activeInputContainer = $(element).parent(); // the reason for using span tag is nod-validate lib - // which does not add error message class while initialising form - const errorMessage = $(activeInputContainer).find('span'); + // which does not add error message class while initialising form. + // specific class is added since it can be multiple spans + const errorMessage = $(activeInputContainer).find('span.form-inlineMessage'); if (errorMessage.length) { const $errMessage = $(errorMessage[0]); diff --git a/assets/js/theme/common/utils/translations-utils.js b/assets/js/theme/common/utils/translations-utils.js index c96dde833d..b1f8c3fd90 100644 --- a/assets/js/theme/common/utils/translations-utils.js +++ b/assets/js/theme/common/utils/translations-utils.js @@ -26,3 +26,27 @@ export const createTranslationDictionary = (context) => { return acc; }, {}); }; + +const defaultPageBuilderValues = { + pdp_sale_badge_label: 'On Sale!', + pdp_sold_out_label: 'Sold Out', + 'pdp-sale-price-label': 'Now:', + 'pdp-non-sale-price-label': 'Was:', + 'pdp-retail-price-label': 'MSRP:', + 'pdp-custom-fields-tab-label': 'Additional Information', +}; + +/** + * defines Translation for values from page builder (locally could be found in config.json) + */ +export const translatePageBuilderValues = () => { + $('[data-page-builder-key]').each((_, selector) => { + const $item = $(selector); + const itemText = $item.text().trim(); + const itemDefaultTranslation = $item.data('default-translation'); + + if (itemText === defaultPageBuilderValues[$item.data('page-builder-key')] && itemText !== itemDefaultTranslation) { + $item.text(itemDefaultTranslation); + } + }); +}; diff --git a/assets/js/theme/compare.js b/assets/js/theme/compare.js index e962008126..181620ac3b 100644 --- a/assets/js/theme/compare.js +++ b/assets/js/theme/compare.js @@ -4,7 +4,7 @@ import compareProducts from './global/compare-products'; export default class Compare extends PageManager { onReady() { - compareProducts(this.context.urls); + compareProducts(this.context); const message = this.context.compareRemoveMessage; diff --git a/assets/js/theme/gift-certificate.js b/assets/js/theme/gift-certificate.js index f4cba12f97..d9d0018493 100644 --- a/assets/js/theme/gift-certificate.js +++ b/assets/js/theme/gift-certificate.js @@ -1,6 +1,6 @@ import PageManager from './page-manager'; import nod from './common/nod'; -import giftCertChecker from './common/gift-certificate-validator'; +import checkIsGiftCertValid from './common/gift-certificate-validator'; import formModel from './common/models/forms'; import { createTranslationDictionary } from './common/utils/translations-utils'; import { announceInputErrorMessage } from './common/utils/form-utils'; @@ -204,9 +204,9 @@ export default class GiftCertificate extends PageManager { balanceValidator.add({ selector: $balanceForm.find('input[name="giftcertificatecode"]'), validate(cb, val) { - cb(giftCertChecker(val)); + cb(checkIsGiftCertValid(val)); }, - errorMessage: 'You must enter a certificate code.', + errorMessage: this.validationDictionary.invalid_gift_certificate, }); return balanceValidator; diff --git a/assets/js/theme/global.js b/assets/js/theme/global.js index b030eae56e..572643d627 100644 --- a/assets/js/theme/global.js +++ b/assets/js/theme/global.js @@ -15,11 +15,21 @@ import adminBar from './global/adminBar'; import carousel from './common/carousel'; import loadingProgressBar from './global/loading-progress-bar'; import svgInjector from './global/svg-injector'; +import { translatePageBuilderValues } from './common/utils/translations-utils'; export default class Global extends PageManager { onReady() { const { - channelId, cartId, productId, categoryId, secureBaseUrl, maintenanceModeSettings, adminBarLanguage, showAdminBar, + channelId, + cartId, + productId, + categoryId, + secureBaseUrl, + maintenanceModeSettings, + adminBarLanguage, + showAdminBar, + isProductCardPresented, + isProductListPresented, } = this.context; cartPreview(secureBaseUrl, cartId); quickSearch(); @@ -35,5 +45,9 @@ export default class Global extends PageManager { } loadingProgressBar(); svgInjector(); + + if (isProductListPresented || isProductCardPresented) { + translatePageBuilderValues(); + } } } diff --git a/assets/js/theme/global/compare-products.js b/assets/js/theme/global/compare-products.js index 6398c97486..2c47789e64 100644 --- a/assets/js/theme/global/compare-products.js +++ b/assets/js/theme/global/compare-products.js @@ -12,19 +12,19 @@ function incrementCounter(counter, item) { counter.push(item); } -function updateCounterNav(counter, $link, urlContext) { +function updateCounterNav(counter, $link, urls) { if (counter.length !== 0) { if (!$link.is('visible')) { $link.addClass('show'); } - $link.attr('href', `${urlContext.compare}/${counter.join('/')}`); + $link.attr('href', `${urls.compare}/${counter.join('/')}`); $link.find('span.countPill').html(counter.length); } else { $link.removeClass('show'); } } -export default function (urlContext) { +export default function ({ noCompareMessage, urls }) { let compareCounter = []; const $compareLink = $('a[data-compare-nav]'); @@ -33,7 +33,7 @@ export default function (urlContext) { const $checked = $('body').find('input[name="products\[\]"]:checked'); compareCounter = $checked.length ? $checked.map((index, element) => element.value).get() : []; - updateCounterNav(compareCounter, $compareLink, urlContext); + updateCounterNav(compareCounter, $compareLink, urls); }); $('body').triggerHandler('compareReset'); @@ -48,7 +48,7 @@ export default function (urlContext) { decrementCounter(compareCounter, product); } - updateCounterNav(compareCounter, $clickedCompareLink, urlContext); + updateCounterNav(compareCounter, $clickedCompareLink, urls); }); $('body').on('submit', '[data-product-compare]', event => { @@ -56,7 +56,7 @@ export default function (urlContext) { const productsToCompare = $this.find('input[name="products\[\]"]:checked'); if (productsToCompare.length <= 1) { - showAlertModal('You must select at least two products to compare'); + showAlertModal(noCompareMessage); event.preventDefault(); } }); @@ -65,7 +65,7 @@ export default function (urlContext) { const $clickedCheckedInput = $('body').find('input[name="products\[\]"]:checked'); if ($clickedCheckedInput.length <= 1) { - showAlertModal('You must select at least two products to compare'); + showAlertModal(noCompareMessage); return false; } }); diff --git a/assets/js/theme/global/quick-view.js b/assets/js/theme/global/quick-view.js index d4ab963755..90fd2005ea 100644 --- a/assets/js/theme/global/quick-view.js +++ b/assets/js/theme/global/quick-view.js @@ -2,7 +2,7 @@ import 'foundation-sites/js/foundation/foundation'; import 'foundation-sites/js/foundation/foundation.dropdown'; import utils from '@bigcommerce/stencil-utils'; import ProductDetails from '../common/product-details'; -import { defaultModal } from './modal'; +import { defaultModal, ModalEvents } from './modal'; import 'slick-carousel'; import { setCarouselState, onSlickCarouselChange, onUserCarouselChange } from '../common/carousel'; @@ -17,12 +17,13 @@ export default function (context) { modal.open({ size: 'large' }); utils.api.product.getById(productId, { template: 'products/quick-view' }, (err, response) => { + if (err) return; + modal.updateContent(response); modal.$content.find('.productView').addClass('productView--quickView'); const $carousel = modal.$content.find('[data-slick]'); - if ($carousel.length) { $carousel.on('init breakpoint swipe', setCarouselState); $carousel.on('click', '.slick-arrow, .slick-dots', setCarouselState); @@ -31,7 +32,13 @@ export default function (context) { $carousel.on('click', '.slick-arrow, .slick-dots', $carousel, e => onUserCarouselChange(e, context)); $carousel.on('swipe', (e, carouselObj) => onUserCarouselChange(e, context, carouselObj.$slider)); - $carousel.slick(); + if (modal.$modal.hasClass('open')) { + $carousel.slick(); + } else { + modal.$modal.one(ModalEvents.opened, () => { + if ($.contains(document, $carousel[0])) $carousel.slick(); + }); + } } return new ProductDetails(modal.$content.find('.quickView'), context); diff --git a/assets/js/theme/product/share.js b/assets/js/theme/product/share.js deleted file mode 100644 index da2589a576..0000000000 --- a/assets/js/theme/product/share.js +++ /dev/null @@ -1,3 +0,0 @@ -export default function () { - -} diff --git a/assets/js/theme/search.js b/assets/js/theme/search.js index 8467de01e5..f0ee7de4b3 100644 --- a/assets/js/theme/search.js +++ b/assets/js/theme/search.js @@ -134,7 +134,7 @@ export default class Search extends CatalogPage { } onReady() { - compareProducts(this.context.urls); + compareProducts(this.context); this.arrangeFocusOnSortBy(); const $searchForm = $('[data-advanced-search-form]'); diff --git a/assets/js/theme/wishlist.js b/assets/js/theme/wishlist.js index c41feacff2..bcfd30c677 100644 --- a/assets/js/theme/wishlist.js +++ b/assets/js/theme/wishlist.js @@ -45,7 +45,7 @@ export default class WishList extends PageManager { cb(result); }, - errorMessage: 'You must enter a wishlist name.', + errorMessage: this.context.enterWishlistNameError, }, ]); diff --git a/assets/scss/components/citadel/forms/_forms.scss b/assets/scss/components/citadel/forms/_forms.scss index 2c247fa8c4..a440737af4 100644 --- a/assets/scss/components/citadel/forms/_forms.scss +++ b/assets/scss/components/citadel/forms/_forms.scss @@ -271,6 +271,10 @@ text-align: center; vertical-align: middle; width: remCalc(35px); + + .form-field--success & { + float:none; + } } diff --git a/assets/scss/components/stencil/heroCarousel/_heroCarousel.scss b/assets/scss/components/stencil/heroCarousel/_heroCarousel.scss index 99c9836287..547432f7ef 100644 --- a/assets/scss/components/stencil/heroCarousel/_heroCarousel.scss +++ b/assets/scss/components/stencil/heroCarousel/_heroCarousel.scss @@ -134,6 +134,34 @@ background-size: contain; } } + + .slick-slide { + &.is-square-image-type { + .heroCarousel-image-wrapper { + height: 100vw; + } + } + + &.is-vertical-image-type { + .heroCarousel-image-wrapper { + height: 110vw; + } + } + + &.is-square-image-type, + &.is-vertical-image-type { + .heroCarousel-image-wrapper { + @include breakpoint("small") { + height: 56.25vw; + } + } + } + + &.is-image-error { + background: url("../img/hero-carousel-image-load-error.svg") center center no-repeat; + background-size: contain; + } + } } .heroCarousel-slide { diff --git a/assets/scss/components/stencil/productView/_productView.scss b/assets/scss/components/stencil/productView/_productView.scss index ab5242a0d8..63d8bbe921 100644 --- a/assets/scss/components/stencil/productView/_productView.scss +++ b/assets/scss/components/stencil/productView/_productView.scss @@ -69,6 +69,14 @@ margin-left: -(spacing("quarter")); margin-right: -(spacing("quarter")); + &[data-slick] { + opacity: 0; + + &.slick-initialized { + opacity: 1; + } + } + .slick-list { margin-left: remCalc(40px); margin-right: remCalc(40px); @@ -348,6 +356,10 @@ .form { display: inline; + + .add-to-cart-wrapper { + display: inline; + } } input[type="file"] { @@ -358,6 +370,10 @@ font-size: 0; // 2 margin-bottom: 2rem; + &--error > .form-inlineMessage { + font-size: 1rem; + } + // scss-lint:disable SelectorDepth, NestingDepth > .form-checkbox + .form-label { @@ -390,7 +406,6 @@ } @include breakpoint("medium") { - float: none; padding: 0; width: auto; } @@ -407,11 +422,18 @@ font-size: 1.3rem; border-radius: 30px; + @include breakpoint("medium") { + width: auto; + } + @include breakpoint("large") { margin-right: spacing("half"); - width: auto; } } + + .button--primary { + margin-right: spacing("half"); + } } } diff --git a/config.json b/config.json index 9d4529213f..8959ff8960 100644 --- a/config.json +++ b/config.json @@ -1,6 +1,6 @@ { "name": "Midwest Nice", - "version": "5.5.0", + "version": "5.6.0", "template_engine": "handlebars_v4", "meta": { "price": 0, @@ -159,8 +159,6 @@ "color-greyLight": "#999999", "color-greyLighter": "#cccccc", "color-greyLightest": "#e5e5e5", - "color-sitePrimary": "#f37160", - "color-siteSecondary": "#9cc", "banner--deafault-backgroundColor": "#707070", "button--default-color": "#666666", "button--default-colorHover": "#333333", diff --git a/lang/en.json b/lang/en.json index 393855729c..80738fa8ef 100755 --- a/lang/en.json +++ b/lang/en.json @@ -67,6 +67,7 @@ }, "label": "Your Cart ({quantity, plural, one {# item} other {# items}})", "is_empty": "Your cart is empty", + "invalid_entry_message": "[ENTRY] is not a valid entry", "coupon_code": "Coupon Code", "discount": "Discount", "included_in_total": " Included in Total", @@ -88,11 +89,10 @@ }, "gift_certificates": { "change_gift_certificate": "Change {certificate_name}", - "add_cert_code": "Add Card", + "add_cert_code": "Add Gift Card", "gift_certificate": "Gift Card", "code_label": "Gift Card ({code})", - "cert_code": "Enter your card code", - "empty_error": "Please enter your valid card code.", + "cert_code": "Enter your gift card code", "remove": "Remove" }, "shipping_estimator": { @@ -105,7 +105,9 @@ "zip_postal_code": "Zip/postcode", "free_shipping": "Free shipping", "hide_ups_rates": "Hide UPS Rates", - "show_ups_rates": "Show UPS Rates" + "show_ups_rates": "Show UPS Rates", + "empty_country_error": "The 'Country' field cannot be blank.", + "empty_province_error": "The 'State/Province' field cannot be blank." }, "gift_wrapping": { "title": "Gift Wrapping", @@ -214,7 +216,8 @@ "header": "Comparing {products, plural, one {# Product} other {# Products}}", "remove": "Remove", "no_remove": "At least 2 products are needed to make a valid comparison.", - "add_to_cart": "Add to cart" + "add_to_cart": "Add to cart", + "no_compare": "You must select at least two products to compare" }, "category": { "label": "Categories", @@ -476,7 +479,8 @@ "save": "Save Wish List", "delete_alert": "Are you sure you want to delete your Wish List(s)? This action cannot be undone.", "create_new": "Create New Wish List", - "add_to_default": "Add to My Wish List" + "add_to_default": "Add to My Wish List", + "enter_wishlist_name_error": "You must enter a wishlist name." } }, "page": { @@ -694,6 +698,7 @@ "change_product_options": "Change options for {name}", "quantity_decrease": "Decrease Quantity of {name}", "quantity_increase": "Increase Quantity of {name}", + "quantity_error_message":"The quantity should contain only numbers", "purchase_units": "{quantity, plural, =0{0 units} one {# unit} other {# units}}", "max_purchase_quantity": "Maximum Purchase:", "min_purchase_quantity": "Minimum Purchase:", @@ -924,7 +929,8 @@ "price_max_evaluation": "Min. price must be less than max. price.", "price_min_not_entered": "Min. price is required.", "price_max_not_entered": "Max. price is required.", - "price_invalid_value": "Input must be greater than 0." + "price_invalid_value": "Input must be greater than 0.", + "invalid_gift_certificate": "Please enter your valid gift card code." }, "validation_fallback_messages": { "valid_email": "You must enter a valid email.", @@ -938,7 +944,8 @@ "price_max_evaluation": "Min. price must be less than max. price.", "price_min_not_entered": "Min. price is required.", "price_max_not_entered": "Max. price is required.", - "price_invalid_value": "Input must be greater than 0." + "price_invalid_value": "Input must be greater than 0.", + "invalid_gift_certificate": "Please enter your valid gift card code." }, "validation_default_messages": { "valid_email": "You must enter a valid email.", @@ -952,6 +959,15 @@ "price_max_evaluation": "Min. price must be less than max. price.", "price_min_not_entered": "Min. price is required.", "price_max_not_entered": "Max. price is required.", - "price_invalid_value": "Input must be greater than 0." + "price_invalid_value": "Input must be greater than 0.", + "invalid_gift_certificate": "Please enter your valid gift card code." + }, + "page_builder": { + "pdp_sale_badge_label": "On Sale!", + "pdp_sold_out_label": "Sold Out", + "pdp-sale-price-label": "Now:", + "pdp-non-sale-price-label": "Was:", + "pdp-retail-price-label": "MSRP:", + "pdp-custom-fields-tab-label": "Additional Information" } } \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 27ff0fd046..97f1bb2e27 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "bigcommerce-cornerstone", - "version": "5.5.0", + "version": "5.6.0", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "bigcommerce-cornerstone", - "version": "5.5.0", + "version": "5.6.0", "license": "MIT", "dependencies": { "@bigcommerce/stencil-utils": "^6.8.1", diff --git a/package.json b/package.json index cd941f44d7..6c717f89dc 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "bigcommerce-cornerstone", "description": "The BigCommerce reference theme for the Stencil platform", - "version": "5.5.0", + "version": "5.6.0", "private": true, "author": "BigCommerce", "license": "MIT", diff --git a/templates/components/account/add-wishlist.html b/templates/components/account/add-wishlist.html index 5a4265a8a5..8e998d8baf 100644 --- a/templates/components/account/add-wishlist.html +++ b/templates/components/account/add-wishlist.html @@ -1,3 +1,5 @@ +{{inject 'enterWishlistNameError' (lang 'account.wishlists.enter_wishlist_name_error')}} +
{{#if forms.wishlist.id}} diff --git a/templates/components/amp/common/store-logo.html b/templates/components/amp/common/store-logo.html index 1a01864259..550ffe0e69 100644 --- a/templates/components/amp/common/store-logo.html +++ b/templates/components/amp/common/store-logo.html @@ -10,7 +10,7 @@ {{#if (last (split theme_settings.logo_size 'x')) 'gtnum' (first (split theme_settings.logo_size 'x')) }} sizes="(max-width: 360px) 100vw, 1vw" {{else}} - sizes="(max-width: 640px) 15vw, 7vw" + sizes="(max-width: 768px) 15vw, 10vw" {{/if}} layout="responsive" {{/if}} diff --git a/templates/components/amp/css/form.html b/templates/components/amp/css/form.html index 08ee739048..5bb0369862 100644 --- a/templates/components/amp/css/form.html +++ b/templates/components/amp/css/form.html @@ -365,6 +365,9 @@ .form-field--warning .form-input { float: left } +.form-field--success[data-quantity-change] .form-input { + float:none; +} .form-field--success .form-input, .form-field--success .form-select, .form-field--success .form-checkbox + .form-label::before, diff --git a/templates/components/amp/css/header.html b/templates/components/amp/css/header.html index e5b7d4068e..80675a3770 100644 --- a/templates/components/amp/css/header.html +++ b/templates/components/amp/css/header.html @@ -25,15 +25,28 @@ align-items: center; } +.amp-header-logo { + display: flex; + justify-content: center; + align-items: center; + flex-grow: 1; + max-height: 55px; + padding-right: 3.92857rem; +} + .amp-header-link { display: inline-block; text-decoration: none; + vertical-align: middle; } -.amp-header-logo { - flex-grow: 1; - padding-right: 3.92857rem; - text-align: center; +.amp-header-link amp-img { + max-height: 55px; +} + +.amp-header-link amp-img img { + min-width: auto; + width: auto; } .amp-empty-space { diff --git a/templates/components/amp/products/card.html b/templates/components/amp/products/card.html index b85c852dcf..946f502318 100644 --- a/templates/components/amp/products/card.html +++ b/templates/components/amp/products/card.html @@ -1,3 +1,5 @@ +{{inject "isProductCardPresented" true}} +
{{#or price.sale_price_with_tax.value price.sale_price_without_tax.value}} diff --git a/templates/components/amp/products/list.html b/templates/components/amp/products/list.html index 98b419ea9a..86d2ba9368 100644 --- a/templates/components/amp/products/list.html +++ b/templates/components/amp/products/list.html @@ -1,3 +1,5 @@ +{{inject "isProductListPresented" true}} +
    {{#each products}}
  • diff --git a/templates/components/brand/product-listing.html b/templates/components/brand/product-listing.html index 1017a4235e..ea09261c2d 100644 --- a/templates/components/brand/product-listing.html +++ b/templates/components/brand/product-listing.html @@ -1,3 +1,7 @@ +{{inject 'noCompareMessage' (lang 'compare.no_compare')}} + +{{> components/products/filter sort=pagination.brand.sort}} +
    {{#if theme_settings.product_list_display_mode '===' 'grid'}} {{> components/products/grid products=brand.products show_compare=brand.show_compare theme_settings=theme_settings event="list"}} diff --git a/templates/components/cart/gift-certificate-input.html b/templates/components/cart/gift-certificate-input.html index 2759cad7c5..4b8aef4ade 100644 --- a/templates/components/cart/gift-certificate-input.html +++ b/templates/components/cart/gift-certificate-input.html @@ -8,7 +8,7 @@