@thefittingroom/shop-ui 2.0.0 → 2.0.2

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.
@@ -16,18 +16,19 @@ export declare class SizeRecComponent {
16
16
  private _sku;
17
17
  private isLoggedIn;
18
18
  private tfrInfoIcon;
19
+ private tfrLoginToView;
19
20
  private tfrSizeHowItFits;
20
- private tfrSizeRecTitle;
21
21
  private tfrSizeRecActionLogin;
22
22
  private tfrSizeRecActionLogout;
23
23
  private tfrSizeRecLoading;
24
24
  private tfrSizeRecommendationError;
25
25
  private tfrSizeRecommendationsContainer;
26
26
  private tfrSizeRecSelect;
27
+ private tfrSizeRecSelectContainer;
27
28
  private tfrSizeRecSize;
28
29
  private tfrSizeRecTable;
30
+ private tfrSizeRecTitle;
29
31
  private tfrSizeRecTitleToggle;
30
- private tfrSizeRecSelectContainer;
31
32
  private tfrLoggedInElements;
32
33
  private tfrLoggedOutElements;
33
34
  private tfrToggleOpenElements;
package/dist/esm/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * thefittingroom v2.0.0 (2024-10-23T03:37:20.685Z)
2
+ * thefittingroom v2.0.2 (2024-10-23T17:24:53.220Z)
3
3
  * Copyright 2022-present, TheFittingRoom, Inc. All rights reserved.
4
4
  */
5
5
  function loadImageRecursive(imageURL, imageURLs) {
@@ -26518,10 +26518,10 @@ var e=[],t=[];function n(n,r){if(n&&"undefined"!=typeof document){var a,s=!0===r
26518
26518
  var css$a = ".tfr-c-white{color:var(--tfr-white)}.tfr-c-brand{color:var(--tfr-brand-color)}.tfr-c-brand-bg{background-color:var(--tfr-brand-color)}.tfr-c-black{color:var(--tfr-black)}.tfr-c-black-o5{color:rgba(0,0,0,.5)}.tfr-c-red{color:var(--tfr-red)}";
26519
26519
  n(css$a,{});
26520
26520
 
26521
- var css$9 = "#fit-title{margin-bottom:20px;margin-top:-30px}#fit-subtitle,#fit-title{color:#209da7;font-size:24px;font-weight:700}#fit-subtitle{position:absolute;right:17px;top:100px}#fit-subtitle-mobile{color:#7d7d7d;font-size:24px;font-weight:700;margin-top:20px}#fit-outline-container{display:flex;justify-content:center}#fit-outline-inner{position:relative}#fit-outline-inner,#tfr-fit-outline-img{width:184px}#fit-outline-inner,#fit-outline-inner-left,#fit-outline-inner-right,#tfr-fit-outline-img{height:701px}#fit-outline-inner-left,#fit-outline-inner-right{position:relative;width:260px}#fit-outline-container .fit-outline-line{display:block}.fit-outline-line{background:#000;height:1px;position:absolute}.fit-outline-line-text{border-bottom:1px solid #000;font-size:24px;position:absolute}.fit-outline-line-chest-text{left:-11px;text-align:right;top:163px;width:254px}.fit-outline-line-n-waist-text{left:-11px;text-align:right;top:208px;width:254px}.fit-outline-line-p-waist-text{right:-10px;text-align:left;top:233px;width:253px}.fit-outline-line-h-hip-text{left:-3px;text-align:right;top:255px;width:246px}.fit-outline-line-l-hip-text{left:-3px;text-align:right;top:302px;width:246px}.fit-outline-line-thigh-text{right:3px;text-align:left;top:341px;width:240px}.fit-outline-line-chest{left:42px;top:194px;width:99px}.fit-outline-line-n-waist{left:50px;top:239px;width:83px}.fit-outline-line-p-waist{left:45px;top:264px;width:93px}.fit-outline-line-h-hip{left:30px;top:286px;width:122px}.fit-outline-line-l-hip{left:21px;top:333px;width:141px}.fit-outline-line-thigh-l{left:27px;top:372px;width:60px}.fit-outline-line-thigh-r{left:95px;top:372px;width:61px}#fit-line-container{position:relative;width:100%}#fit-line-text-container{align-items:center;display:flex;justify-content:space-between}.fit-line-item{font-weight:700;width:110px}.fit-line-item .light-text{font-weight:500}.fit-line-item-green{color:#209da7}#fit-line{display:flex;justify-content:space-around;margin-bottom:4px;margin-top:30px}#fit-line-1,#fit-line-2,#fit-line-3,#fit-line-4,#fit-line-5,#fit-line-6,#fit-line-7{background:#000;height:2px;position:relative;width:110px}#fit-line-3,#fit-line-4,#fit-line-5{background:#209da7}#fit-line-1:before,#fit-line-2:before,#fit-line-3:before,#fit-line-5:before,#fit-line-6:before,#fit-line-7:before{background:#000;border-radius:50%;content:\"\";height:12px;position:absolute;top:-5px;width:12px}#fit-line-1:before,#fit-line-2:before,#fit-line-3:before{left:0}#fit-line-5:before,#fit-line-6:before,#fit-line-7:before{right:0}#fit-line-1:before,#fit-line-2:before,#fit-line-6:before,#fit-line-7:before{background:#000}#fit-line-3:before,#fit-line-5:before{background:#209da7}#fit-line-2:before,#fit-line-6:before{display:none}#fit-line-1:after,#fit-line-2:after,#fit-line-3:after,#fit-line-4:after,#fit-line-5:after,#fit-line-6:after,#fit-line-7:after{border-left:2px dashed #000;content:\"\";display:block;height:20px;left:50%;position:absolute;top:-20px}#fit-line-3:after,#fit-line-4:after,#fit-line-5:after{border-left:2px dashed #209da7}#fit-line-texts{display:flex;justify-content:space-between;padding:0 70px}#fit-line-texts div:nth-of-type(2){color:#209da7}.margin-top-10{margin-top:10px}.desktop-hidden{display:none}#cta-link{cursor:pointer;font-size:20px;margin:auto;text-decoration:underline;width:150px}.powered-by{align-items:center;display:flex;justify-content:center;margin-top:10px}@media screen and (max-width:599px){#fit-title{margin-top:0}#fit-outline-container{margin-top:-50px;transform:scale(.85)}.fit-line-item{font-size:11px}.fit-outline-line-text{font-size:16px;line-height:31px}.fit-outline-line-chest-text,.fit-outline-line-n-waist-text{left:-11px;width:auto}.fit-outline-line-p-waist-text{right:-10px;width:auto}.fit-outline-line-h-hip-text,.fit-outline-line-l-hip-text{left:-3px;width:auto}.fit-outline-line-thigh-text{right:3px;width:auto}#fit-line{margin-top:10px}#fit-line-texts{font-size:12px;padding:0 15px}#fit-line-2:before,#fit-line-6:before,.desktop-hidden{display:block}#fit-line-1:after,#fit-line-2:after,#fit-line-3:after,#fit-line-4:after,#fit-line-5:after,#fit-line-6:after,#fit-line-7:after,.mobile-hidden{display:none}#cta-section{margin-top:-40px}}";
26521
+ var css$9 = "#fit-title{margin-bottom:20px;margin-top:-30px}#fit-subtitle,#fit-title{color:#209da7;font-size:24px;font-weight:700}#fit-subtitle{position:absolute;right:17px;top:100px}#fit-subtitle-mobile{color:#7d7d7d;font-size:24px;font-weight:700;margin-top:20px}#fit-outline-container{display:flex;justify-content:center}#fit-outline-inner{position:relative}#fit-outline-inner,#tfr-fit-outline-img{width:184px}#fit-outline-inner,#fit-outline-inner-left,#fit-outline-inner-right,#tfr-fit-outline-img{height:701px}#fit-outline-inner-left,#fit-outline-inner-right{position:relative;width:260px}#fit-outline-container .fit-outline-line{display:block}.fit-outline-line{background:#000;height:1px;position:absolute}.fit-outline-line-text{border-bottom:1px solid #000;font-size:24px;position:absolute}.fit-outline-line-chest-text{left:-11px;text-align:right;top:163px;width:254px}.fit-outline-line-n-waist-text{left:-11px;text-align:right;top:208px;width:254px}.fit-outline-line-p-waist-text{right:-10px;text-align:left;top:233px;width:253px}.fit-outline-line-h-hip-text{left:-3px;text-align:right;top:255px;width:246px}.fit-outline-line-l-hip-text{left:-3px;text-align:right;top:302px;width:246px}.fit-outline-line-thigh-text{right:3px;text-align:left;top:341px;width:240px}.fit-outline-line-chest{left:42px;top:194px;width:99px}.fit-outline-line-n-waist{left:50px;top:239px;width:83px}.fit-outline-line-p-waist{left:45px;top:264px;width:93px}.fit-outline-line-h-hip{left:30px;top:286px;width:122px}.fit-outline-line-l-hip{left:21px;top:333px;width:141px}.fit-outline-line-thigh-l{left:27px;top:372px;width:60px}.fit-outline-line-thigh-r{left:95px;top:372px;width:61px}#fit-line-container{position:relative;width:100%}#fit-line-text-container{align-items:center;display:flex;justify-content:space-between}.fit-line-item{font-weight:700;width:110px}.fit-line-item .light-text{font-weight:500}.fit-line-item-green{color:#209da7}#fit-line{display:flex;justify-content:space-around;margin-bottom:4px;margin-top:30px}#fit-line-1,#fit-line-2,#fit-line-3,#fit-line-4,#fit-line-5,#fit-line-6,#fit-line-7{background:#000;height:2px;position:relative;width:110px}#fit-line-3,#fit-line-4,#fit-line-5{background:#209da7}#fit-line-1:before,#fit-line-2:before,#fit-line-3:before,#fit-line-5:before,#fit-line-6:before,#fit-line-7:before{background:#000;border-radius:50%;content:\"\";height:12px;position:absolute;top:-5px;width:12px}#fit-line-1:before,#fit-line-2:before,#fit-line-3:before{left:0}#fit-line-5:before,#fit-line-6:before,#fit-line-7:before{right:0}#fit-line-1:before,#fit-line-2:before,#fit-line-6:before,#fit-line-7:before{background:#000}#fit-line-3:before,#fit-line-5:before{background:#209da7}#fit-line-2:before,#fit-line-6:before{display:none}#fit-line-1:after,#fit-line-2:after,#fit-line-3:after,#fit-line-4:after,#fit-line-5:after,#fit-line-6:after,#fit-line-7:after{border-left:2px dashed #000;content:\"\";display:block;height:20px;left:50%;position:absolute;top:-20px}#fit-line-3:after,#fit-line-4:after,#fit-line-5:after{border-left:2px dashed #209da7}#fit-line-texts{display:flex;justify-content:space-between;padding:0 70px}#fit-line-texts div:nth-of-type(2){color:#209da7}.margin-top-10{margin-top:10px}.desktop-hidden{display:none}#cta-link{cursor:pointer;font-size:20px;margin:auto;text-decoration:underline;width:150px}.powered-by{align-items:center;display:flex;justify-content:center;margin-top:10px}@media screen and (max-width:599px){#fit-outline-inner,#fit-outline-inner-left,#fit-outline-inner-right{height:400px}#fit-outline-inner{flex-shrink:0;overflow:hidden}#fit-title{margin-top:0}#fit-outline-container{margin-top:-50px;transform:scale(.7)}.fit-line-item{font-size:10px;font-weight:500}.fit-outline-line-text{font-size:16px;line-height:31px}.fit-outline-line-chest-text,.fit-outline-line-n-waist-text{left:-11px;width:auto}.fit-outline-line-p-waist-text{right:-10px;width:auto}.fit-outline-line-h-hip-text,.fit-outline-line-l-hip-text{left:-3px;width:auto}.fit-outline-line-thigh-text{right:3px;width:auto}#fit-line{margin-top:10px}#fit-line-texts{font-size:12px;padding:0 15px}#cta-section{margin-top:-30px}#fit-line-2:before,#fit-line-6:before,.desktop-hidden{display:block}#fit-line-1:after,#fit-line-2:after,#fit-line-3:after,#fit-line-4:after,#fit-line-5:after,#fit-line-6:after,#fit-line-7:after,.mobile-hidden{display:none}}";
26522
26522
  n(css$9,{});
26523
26523
 
26524
- var css$8 = ".tfr-home-button-container{display:flex;flex-wrap:wrap;margin:20px}.tfr-home-button-container>button{border:0;cursor:pointer;height:60px;margin:20px;width:200px}.tfr-home-button-container>button:hover{background-color:#e6e6e6}[data-tfr=hidden]{display:none}.tfr-modal{background-color:rgba(0,0,0,.53);display:flex;height:100%;left:0;position:fixed;top:0;width:100%;z-index:10000}.tfr-modal-content{margin:0 auto;text-align:center;width:90%}.tfr-modal-content-flex{align-items:center;display:flex}.tfr-modal-content-container{background-color:#fff;border:1px solid #434343;border-radius:0;box-shadow:0 6px 6px #00000029;line-height:normal;max-height:100vh;max-width:850px;overflow:auto;width:100%}#tfr-close-container{padding-right:10px}.tfr-close-container{text-align:end}.tfr-close{color:#aaa;font-size:28px;font-weight:700;height:50px;width:50px}.tfr-close:focus,.tfr-close:hover{color:#000;text-decoration:none}.tfr-cursor:hover{cursor:pointer}.tfr-underline{text-decoration:underline}.tfr-standard-button{border:0;border-radius:3px;color:#fff;height:43px;width:138px}.tfr-logo-container{align-items:center;display:flex}.tfr-modal-title-logo-container{align-items:center;display:flex;justify-content:center}.tfr-girl-clothes{display:inline-block;height:316px;width:253px}.tfr-t-a-center{text-align:center}.tfr-w-70-p{width:70%}.tfr-w-80-p{width:80%}.tfr-w-85-p{width:85%}.tfr-w-150{width:150px}.tfr-h-150{height:150px}.tfr-d-none{display:none}.tfr-d-block{display:block}.tfr-d-flex{display:flex}.tfr-how-it-works-item{align-items:center;display:flex;justify-items:center}.tfr-try-on-content{margin-left:60px}#tfr-tryon-image{max-width:30vw}.progress-bar{background-color:#fff;border:1px solid #bdbdbd;height:10px;margin:15px auto 0;width:55%}.progress-bar-fill{animation-duration:120s;animation-name:progress;background-color:#209da7;color:#fff;display:block;font-size:16px;height:100%;text-align:center;transition:width .6s linear}#tfr-video{height:100%;max-height:350px;max-width:350px}.tfr-logo-box{display:flex;margin:auto;max-height:400px;max-width:860px;padding:20px}.tfr-flex,.tfr-logo-box{align-items:center;justify-content:center}.tfr-qr-code{width:200px}.tfr-space-above{margin-top:10px}.tfr-max-w-600{margin:auto;max-width:600px}#tfr-qr-border-box{align-items:center;border:2px solid var(--tfr-brand-color);border-radius:16px;display:flex;flex-direction:column;height:350px;justify-content:center;margin-left:20px;padding:0 30px;width:300px}.tfr-mobile-logo{height:60px}#email-input,#password-input{font-size:16px}.tfr-door-icon,.tfr-user-icon{color:#209da7}.tfr-logged-in,.tfr-toggle-closed{display:none}.tfr-flex{display:flex}.tfr-gap-2{gap:8px}.tfr-items-center{align-items:center}.tfr-mb-2{margin-bottom:8px}#tfr-logged-out-overlay-container{position:relative}#tfr-logged-out-overlay{align-items:center;background:hsla(0,0%,100%,.8);bottom:0;display:flex;font-size:16px;font-weight:700;justify-content:center;left:0;line-height:16px;position:absolute;right:0;text-align:center;top:0}";
26524
+ var css$8 = ".tfr-home-button-container{display:flex;flex-wrap:wrap;margin:20px}.tfr-home-button-container>button{border:0;cursor:pointer;height:60px;margin:20px;width:200px}.tfr-home-button-container>button:hover{background-color:#e6e6e6}[data-tfr=hidden]{display:none}.tfr-modal{background-color:rgba(0,0,0,.53);display:flex;height:100%;left:0;position:fixed;top:0;width:100%;z-index:10000}.tfr-modal-content{margin:0 auto;text-align:center;width:90%}.tfr-modal-content-flex{align-items:center;display:flex}.tfr-modal-content-container{background-color:#fff;border:1px solid #434343;border-radius:0;box-shadow:0 6px 6px #00000029;line-height:normal;max-height:100vh;max-width:850px;overflow:auto;width:100%}#tfr-close-container{padding-right:10px}.tfr-close-container{text-align:end}.tfr-close{color:#aaa;font-size:28px;font-weight:700;height:50px;width:50px}.tfr-close:focus,.tfr-close:hover{color:#000;text-decoration:none}.tfr-cursor:hover{cursor:pointer}.tfr-underline{text-decoration:underline}.tfr-standard-button{border:0;border-radius:3px;color:#fff;height:43px;width:138px}.tfr-logo-container{align-items:center;display:flex}.tfr-modal-title-logo-container{align-items:center;display:flex;justify-content:center}.tfr-girl-clothes{display:inline-block;height:316px;width:253px}.tfr-t-a-center{text-align:center}.tfr-w-70-p{width:70%}.tfr-w-80-p{width:80%}.tfr-w-85-p{width:85%}.tfr-w-150{width:150px}.tfr-h-150{height:150px}.tfr-d-none{display:none}.tfr-d-block{display:block}.tfr-d-flex{display:flex}.tfr-how-it-works-item{align-items:center;display:flex;justify-items:center}.tfr-try-on-content{margin-left:60px}#tfr-tryon-image{max-width:30vw}.progress-bar{background-color:#fff;border:1px solid #bdbdbd;height:10px;margin:15px auto 0;width:55%}.progress-bar-fill{animation-duration:120s;animation-name:progress;background-color:#209da7;color:#fff;display:block;font-size:16px;height:100%;text-align:center;transition:width .6s linear}#tfr-video{height:100%;max-height:350px;max-width:350px}.tfr-logo-box{display:flex;margin:auto;max-height:400px;max-width:860px;padding:20px}.tfr-flex,.tfr-logo-box{align-items:center;justify-content:center}.tfr-qr-code{width:200px}.tfr-space-above{margin-top:10px}.tfr-max-w-600{margin:auto;max-width:600px}#tfr-qr-border-box{align-items:center;border:2px solid var(--tfr-brand-color);border-radius:16px;display:flex;flex-direction:column;height:350px;justify-content:center;margin-left:20px;padding:0 30px;width:300px}.tfr-mobile-logo{height:60px}#email-input,#password-input{font-size:16px}.tfr-door-icon,.tfr-user-icon{color:#209da7}.tfr-logged-in,.tfr-toggle-closed{display:none}.tfr-flex{display:flex}.tfr-gap{gap:4px}.tfr-items-center{align-items:center}.tfr-mb-2{margin-bottom:8px}#tfr-logged-out-overlay-container{position:relative}#tfr-logged-out-overlay{align-items:center;background:hsla(0,0%,100%,.8);bottom:0;display:flex;font-size:16px;font-weight:700;justify-content:center;left:0;line-height:16px;position:absolute;right:0;text-align:center;top:0}";
26525
26525
  n(css$8,{});
26526
26526
 
26527
26527
  var css$7 = "input{border:none;box-shadow:none!important;width:100%}input:focus,select:focus,textarea:focus{border:none;outline:none}.tfr-fieldset{margin-left:auto;margin-right:auto;width:65%}.tfr-fieldset,.tfr-fieldset-inline{border-color:rgba(0,0,0,.5);border-radius:10px;border-width:1px;padding:5px 10px 10px;text-align:left}.tfr-fieldset-inline{margin-right:10px;width:250px}.tfr-fieldset-err{border-color:red}";
@@ -26530,10 +26530,10 @@ n(css$7,{});
26530
26530
  var css$6 = ".lds-ellipsis{display:inline-block;height:80px;position:relative;width:80px}.lds-ellipsis div{animation-timing-function:cubic-bezier(0,1,1,0);background:var(--tfr-brand-color);border-radius:50%;display:block;height:13px;position:absolute;top:33px;width:13px}.lds-ellipsis div:first-child{animation:lds-ellipsis1 .6s infinite;left:8px}.lds-ellipsis div:nth-child(2){animation:lds-ellipsis2 .6s infinite;left:8px}.lds-ellipsis div:nth-child(3){animation:lds-ellipsis2 .6s infinite;left:32px}.lds-ellipsis div:nth-child(4){animation:lds-ellipsis3 .6s infinite;left:56px}@keyframes lds-ellipsis1{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes lds-ellipsis3{0%{transform:scale(1)}to{transform:scale(0)}}@keyframes lds-ellipsis2{0%{transform:translate(0)}to{transform:translate(24px)}}";
26531
26531
  n(css$6,{});
26532
26532
 
26533
- var css$5 = "@media screen and (max-width:702px){.tfr-modal-title-logo-container{display:flex;flex-direction:column}}@media screen and (min-width:600px){.tfr-modal-content-container{border-radius:10px;height:auto;margin:auto;width:100%}}@media screen and (max-width:599px){#tfr-size-recommendations{width:calc(100vw - 30px)!important}.tfr-mobile-hidden{display:none}.tfr-modal-content-container{max-height:none;max-width:100vw;min-height:100vh;min-width:100vw}.trf-logo-title{margin-bottom:10px}.tfr-modal-content-flex{overflow:auto}}@media screen and (max-width:500px){.tfr-fieldset{width:90%}.tfr-how-it-works-item{flex-direction:column}.tfr-try-on-content{margin-left:0;margin-top:20px}}@media screen and (max-height:800px){.tfr-video-responsive{height:280px!important}}";
26533
+ var css$5 = "@media screen and (max-width:702px){.tfr-modal-title-logo-container{display:flex;flex-direction:column}}@media screen and (min-width:600px){.tfr-modal-content-container{border-radius:10px;height:auto;margin:auto;width:100%}}@media screen and (max-width:599px){#tfr-size-recommendations{width:calc(100vw - 30px)!important}.tfr-mobile-small-text{font-size:12px}.tfr-mobile-hidden{display:none}.tfr-modal-content{overflow:hidden}.tfr-modal-content-container{max-height:none;max-width:100vw;min-height:100vh;min-width:100vw}.trf-logo-title{margin-bottom:10px}.tfr-modal-content-flex{overflow:auto}}@media screen and (max-width:500px){.tfr-fieldset{width:90%}.tfr-how-it-works-item{flex-direction:column}.tfr-try-on-content{margin-left:0;margin-top:20px}}@media screen and (max-height:800px){.tfr-video-responsive{height:280px!important}}";
26534
26534
  n(css$5,{});
26535
26535
 
26536
- var css$4 = "#tfr-size-recommendations{align-items:center;background-color:var(--tfr-main-bg-color);border:var(--tfr-main-border-width) solid var(--tfr-main-border-color);border-radius:var(--tfr-main-border-radius);color:var(--tfr-dark);display:flex;flex-direction:column;font-family:var(--tfr-main-font);justify-content:center;padding:var(--tfr-main-v-padding) var(--tfr-main-h-padding);width:var(--tfr-main-width)}#tfr-size-recommendations-container{align-items:center;display:none;flex-direction:column;justify-content:center;position:relative;width:100%}#tfr-size-rec-select-container{align-items:center;display:none;flex-direction:column;font-size:13px;width:100%}#tfr-size-rec-title{align-items:center;display:flex;font-family:var(--tfr-title-font);margin-bottom:8px}#tfr-size-rec-title-toggle{color:var(--tfr-grey);cursor:pointer;position:absolute;right:0;top:0;transition:all .3s ease}.tfr-chevron-up{transform:rotate(180deg) scaleY(.6)}.tfr-chevron-down{transform:rotate(0deg) scaleY(.6)}#tfr-info-icon{cursor:pointer}#tfr-size-rec-subtitle{border-bottom:2px solid #000;font-size:18px;font-weight:700;text-align:center;width:100%}#tfr-size-rec-title{font-size:14px}#tfr-size-rec-table{display:flex;flex-direction:column;font-size:12px;padding:0 10px;width:100%}.tfr-size-rec-table-row:first-of-type{border-top-width:0}.tfr-size-rec-table-row{align-items:center;border-top:var(--tfr-main-border-width) solid var(--tfr-main-border-color);display:flex;font-family:var(--tfr-row-font);justify-content:center;min-height:40px}.tfr-size-rec-table-cell-left,.tfr-size-rec-table-cell-right{flex:1 1 0px}.tfr-size-rec-table-cell-left{flex-grow:1;padding-left:8px;text-align:right}.tfr-size-rec-table-cell-right{margin-left:16px;padding-right:8px;text-align:left}.tfr-size-rec-table-cell-right.perfect{color:var(--tfr-brand-color)}#tfr-size-rec-size{display:inline-block}#tfr-size-rec-size>.tfr-size-rec-login-cta{font-weight:500;margin-left:10px}.tfr-size-rec-login-cta,.tfr-size-rec-table-cell-right{font-size:12px}.tfr-size-rec-login-cta{color:var(--tfr-muted);display:flex;width:150px}#tfr-size-rec-action-login,#tfr-size-rec-action-logout{display:none;font-family:var(--tfr-cta-font)}#tfr-size-rec-action{cursor:pointer;font-size:16px;text-decoration:underline}#tfr-size-rec-select{background-color:var(--tfr-size-selector-bg-color);border-color:var(--tfr-size-selector-border-color);border-radius:var(--tfr-size-selector-button-radius);border-style:solid;border-width:var(--tfr-size-selector-border-width);box-shadow:var(--tfr-size-selector-button-shadow);color:var(--tfr-size-selector-text-color);display:none;font-size:var(--tfr-size-selector-font-size);font-weight:var(--tfr-size-selector-font-weight);margin-bottom:20px;margin-top:10px}#tfr-size-rec-select,.tfr-size-rec-select-button{align-items:center;height:var(--tfr-size-selector-button-height);justify-content:center}.tfr-size-rec-select-button{cursor:pointer;display:flex;transition:all .15s ease-in;width:80px}.tfr-size-rec-select-button:hover:not(.active){background-color:var(--tfr-size-selector-bg-color-hover);opacity:.7}.tfr-size-rec-select-button.active{background-color:var(--tfr-size-selector-bg-color-active);border-color:var(--tfr-size-selector-button-active-border-color);border-style:solid;border-width:var(--tfr-size-selector-button-active-border-width);height:var(--tfr-size-selector-button-active-height)}.tfr-size-rec-select-button.active,.tfr-size-rec-select-button:first-of-type{border-bottom-left-radius:var(--tfr-size-selector-button-radius);border-top-left-radius:var(--tfr-size-selector-button-radius)}.tfr-size-rec-select-button.active,.tfr-size-rec-select-button:last-of-type{border-bottom-right-radius:var(--tfr-size-selector-button-radius);border-top-right-radius:var(--tfr-size-selector-button-radius)}.tfr-powered-by{align-items:center;display:flex;font-size:10px;margin-top:10px}.tfr-powered-by-logo{margin:0 4px}.tfr-powered-by-logo,.tfr-powered-by-logo img,.tfr-powered-by-logo svg{height:24px;width:24px}.tfr-powered-by-text-bold{font-weight:700}#tfr-size-recommendation-error{color:#8d0000;display:none}#tfr-sign-in-nav{margin-bottom:80px}";
26536
+ var css$4 = "#tfr-size-recommendations{align-items:center;background-color:var(--tfr-main-bg-color);border:var(--tfr-main-border-width) solid var(--tfr-main-border-color);border-radius:var(--tfr-main-border-radius);color:var(--tfr-dark);display:flex;flex-direction:column;font-family:var(--tfr-main-font);justify-content:center;padding:var(--tfr-main-v-padding) var(--tfr-main-h-padding);width:var(--tfr-main-width)}#tfr-size-recommendations-container{align-items:center;display:none;flex-direction:column;justify-content:center;position:relative;width:100%}#tfr-size-rec-select-container{align-items:center;display:none;flex-direction:column;font-size:13px;width:100%}#tfr-size-rec-title{align-items:center;display:flex;font-family:var(--tfr-title-font);margin-bottom:8px}#tfr-size-rec-title-toggle{color:var(--tfr-grey);cursor:pointer;position:absolute;right:0;top:0;transition:all .3s ease}.tfr-chevron-up{transform:rotate(180deg) scaleY(.6)}.tfr-chevron-down{transform:rotate(0deg) scaleY(.6)}#tfr-info-icon{cursor:pointer}#tfr-size-rec-subtitle{border-bottom:2px solid #000;font-size:18px;font-weight:700;text-align:center;width:100%}#tfr-size-rec-title{font-size:14px}#tfr-size-rec-table{display:flex;flex-direction:column;font-size:12px;padding:0 10px;width:100%}.tfr-size-rec-table-row:first-of-type{border-top-width:0}.tfr-size-rec-table-row{align-items:center;border-top:var(--tfr-main-border-width) solid var(--tfr-main-border-color);display:flex;font-family:var(--tfr-row-font);justify-content:center;min-height:40px}.tfr-size-rec-table-cell-left,.tfr-size-rec-table-cell-right{flex:1 1 0px}.tfr-size-rec-table-cell-left{flex-grow:1;padding-left:8px;text-align:right}.tfr-size-rec-table-cell-right{margin-left:16px;padding-right:8px;text-align:left}.tfr-size-rec-table-cell-right.perfect{color:var(--tfr-brand-color)}#tfr-size-rec-size{display:inline-block}#tfr-size-rec-size>.tfr-size-rec-login-cta{font-weight:500;margin-left:10px}.tfr-size-rec-login-cta,.tfr-size-rec-table-cell-right{font-size:12px}.tfr-size-rec-login-cta{color:var(--tfr-muted);display:flex;width:150px}#tfr-size-rec-action-login,#tfr-size-rec-action-logout{display:none;font-family:var(--tfr-cta-font)}#tfr-size-rec-action{cursor:pointer;font-size:16px;text-decoration:underline}#tfr-size-rec-select{background-color:var(--tfr-size-selector-bg-color);border-color:var(--tfr-size-selector-border-color);border-radius:var(--tfr-size-selector-button-radius);border-style:solid;border-width:var(--tfr-size-selector-border-width);box-shadow:var(--tfr-size-selector-button-shadow);color:var(--tfr-size-selector-text-color);display:none;font-size:var(--tfr-size-selector-font-size);font-weight:var(--tfr-size-selector-font-weight);margin-bottom:20px;margin-top:10px}#tfr-size-rec-select,.tfr-size-rec-select-button{align-items:center;height:var(--tfr-size-selector-button-height);justify-content:center}.tfr-size-rec-select-button{cursor:pointer;display:flex;transition:all .15s ease-in;width:80px}.tfr-size-rec-select-button:hover:not(.active):not(.tfr-disabled){background-color:var(--tfr-size-selector-bg-color-hover);opacity:.7}.tfr-size-rec-select-button.active{background-color:var(--tfr-size-selector-bg-color-active);border-color:var(--tfr-size-selector-button-active-border-color);border-style:solid;border-width:var(--tfr-size-selector-button-active-border-width);height:var(--tfr-size-selector-button-active-height)}.tfr-size-rec-select-button.active,.tfr-size-rec-select-button:first-of-type{border-bottom-left-radius:var(--tfr-size-selector-button-radius);border-top-left-radius:var(--tfr-size-selector-button-radius)}.tfr-size-rec-select-button.active,.tfr-size-rec-select-button:last-of-type{border-bottom-right-radius:var(--tfr-size-selector-button-radius);border-top-right-radius:var(--tfr-size-selector-button-radius)}.tfr-powered-by{align-items:center;display:flex;font-size:10px;margin-top:10px}.tfr-powered-by-logo{margin:0 4px}.tfr-powered-by-logo,.tfr-powered-by-logo img,.tfr-powered-by-logo svg{height:24px;width:12px}.tfr-powered-by-text-bold{font-weight:700}#tfr-size-recommendation-error{color:#8d0000;display:none}#tfr-sign-in-nav{margin-bottom:80px}.tfr-disabled{cursor:default}#tfr-login-to-view{cursor:pointer}";
26537
26537
  n(css$4,{});
26538
26538
 
26539
26539
  var css$3 = ".tfr-mt-10{margin-top:10px}.tfr-mt-20{margin-top:20px}.tfr-mt-15{margin-top:15px}.tfr-mt-30{margin-top:30px}.mt-40{margin-top:40px}.tfr-mb-40{margin-bottom:40px}.tfr-mb-20{margin-bottom:20px}.tfr-mr-10{margin-right:10px}.tfr-mr-15{margin-right:15px}.tfr-mt-50{margin-top:50px}.tfr-mt-60{margin-top:60px}.tfr-mb-60{margin-bottom:60px}.tfr-mr-20{margin-right:20px}.tfr-mt-15-p{margin-top:15%}.tfr-mb-13-p{margin-bottom:13%}.tfr-m-h-auto{margin-left:auto;margin-right:auto}.tfr-pt-20{padding-top:20px}.tfr-pb-50{padding-bottom:50px}.tfr-p-20{padding:20px 10px}.tfr-pr-20{padding-right:20px}.tfr-pl-20{padding-left:20px}.tfr-pb-7-p{padding-bottom:7%}";
@@ -26671,7 +26671,7 @@ const FitModal = (props) => {
26671
26671
 
26672
26672
  <div id="fit-line-texts">
26673
26673
  <div>Poor Fit</div>
26674
- <div>Acceptable Fit Fit</div>
26674
+ <div>Acceptable Fit</div>
26675
26675
  <div>Poor Fit</div>
26676
26676
  </div>
26677
26677
  </div>
@@ -26680,7 +26680,7 @@ const FitModal = (props) => {
26680
26680
 
26681
26681
  <div id="fit-outline-container">
26682
26682
  <div id="fit-outline-inner-left">
26683
- <div class="fit-outline-line-text fit-outline-line-p-waist-text">Pant Waist</div>
26683
+ <div class="fit-outline-line-text fit-outline-line-p-waist-text">Pant&nbsp;Waist</div>
26684
26684
  <div class="fit-outline-line-text fit-outline-line-thigh-text">Thigh</div>
26685
26685
  </div>
26686
26686
 
@@ -26700,9 +26700,9 @@ const FitModal = (props) => {
26700
26700
  <div id="fit-subtitle" class="mobile-hidden">Measurement&nbsp;Points</div>
26701
26701
 
26702
26702
  <div class="fit-outline-line-text fit-outline-line-chest-text">Chest/Bust</div>
26703
- <div class="fit-outline-line-text fit-outline-line-n-waist-text">Natural Waist</div>
26704
- <div class="fit-outline-line-text fit-outline-line-h-hip-text">High Hip</div>
26705
- <div class="fit-outline-line-text fit-outline-line-l-hip-text">Low Hip</div>
26703
+ <div class="fit-outline-line-text fit-outline-line-n-waist-text">Natural&nbsp;Waist</div>
26704
+ <div class="fit-outline-line-text fit-outline-line-h-hip-text">High&nbsp;Hip</div>
26705
+ <div class="fit-outline-line-text fit-outline-line-l-hip-text">Low&nbsp;Hip</div>
26706
26706
  </div>
26707
26707
  </div>
26708
26708
  </div>
@@ -27323,6 +27323,7 @@ class SizeRecComponent {
27323
27323
  this.tfrSizeRecSelect.style.display = 'flex';
27324
27324
  this.tfrSizeHowItFits.style.display = 'block';
27325
27325
  if (isLoggedIn) {
27326
+ this.tfrSizeRecSelect.style.opacity = '1';
27326
27327
  this.tfrLoggedInElements.forEach((element) => (element.style.display = 'block'));
27327
27328
  this.tfrLoggedOutElements.forEach((element) => (element.style.display = 'none'));
27328
27329
  this.tfrSizeRecActionLogin.style.display = 'none';
@@ -27333,6 +27334,7 @@ class SizeRecComponent {
27333
27334
  this.tfrSizeRecTitleToggle.classList.remove('tfr-chevron-down');
27334
27335
  }
27335
27336
  else {
27337
+ this.tfrSizeRecSelect.style.opacity = '0.4';
27336
27338
  this.tfrLoggedInElements.forEach((element) => (element.style.display = 'none'));
27337
27339
  this.tfrLoggedOutElements.forEach((element) => (element.style.display = 'block'));
27338
27340
  this.tfrSizeRecActionLogin.style.display = 'block';
@@ -27382,6 +27384,7 @@ class SizeRecComponent {
27382
27384
  this.tfrSizeHowItFits = document.getElementById('tfr-size-how-it-fits');
27383
27385
  this.tfrSizeRecTitle = document.getElementById('tfr-size-rec-title');
27384
27386
  this.tfrInfoIcon = document.getElementById('tfr-info-icon');
27387
+ this.tfrLoginToView = document.getElementById('tfr-login-to-view');
27385
27388
  this.tfrSizeRecActionLogin = document.getElementById('tfr-size-rec-action-login');
27386
27389
  this.tfrSizeRecActionLogout = document.getElementById('tfr-size-rec-action-logout');
27387
27390
  this.tfrSizeRecTable = document.getElementById('tfr-size-rec-table');
@@ -27403,6 +27406,7 @@ class SizeRecComponent {
27403
27406
  this.tfrSizeRecSelect.addEventListener('click', this.onSizeRecSelectClick.bind(this));
27404
27407
  this.tfrSizeRecTitleToggle.addEventListener('click', this.toggletSizeRecSelectContainer.bind(this));
27405
27408
  this.tfrInfoIcon.addEventListener('click', this.onFitInfoClick);
27409
+ this.tfrLoginToView.addEventListener('click', this.onSignInClick);
27406
27410
  }
27407
27411
  onSizeRecSelectClick(e) {
27408
27412
  const target = e.target;
@@ -27455,7 +27459,9 @@ class SizeRecComponent {
27455
27459
  </div>`;
27456
27460
  }
27457
27461
  renderGarmentLocations(locations) {
27458
- const innerHtml = locations.map((location) => this.renderSizeRecTableRow(location, this.randomFit(), true)).join('');
27462
+ const innerHtml = locations
27463
+ .map((location, index) => this.renderSizeRecTableRow(location, this.randomFit(index), true))
27464
+ .join('');
27459
27465
  const html = `<div id="tfr-logged-out-overlay-container">
27460
27466
  <div id="tfr-logged-out-overlay">
27461
27467
  Login to reveal how this item will fit specifically at each area of your body in different sizes
@@ -27466,9 +27472,9 @@ class SizeRecComponent {
27466
27472
  </div>`;
27467
27473
  this.tfrSizeRecTable.innerHTML = html;
27468
27474
  }
27469
- randomFit() {
27470
- const fits = ['Perfect', 'Slightly tight', 'Fitted', 'Less fitted', 'Slightly loose'];
27471
- return fits[Math.floor(Math.random() * fits.length)];
27475
+ randomFit(index) {
27476
+ const choices = ['Slightly Tight', 'Perfect Fit', 'Perfect Fit', 'Slightly Loose', 'Perfect Fit'];
27477
+ return choices[index % choices.length];
27472
27478
  }
27473
27479
  toggletSizeRecSelectContainer() {
27474
27480
  if (this.isCollapsed) {
@@ -27500,19 +27506,19 @@ class SizeRecComponent {
27500
27506
  <div id="tfr-size-rec-title-toggle" class="tfr-chevron-up">v</div>
27501
27507
 
27502
27508
  <div class="tfr-logged-out">
27503
- <div class="tfr-flex tfr-gap-2 tfr-mb-2">
27504
- <div>Uncertain of your size?</div>
27509
+ <div class="tfr-flex tfr-gap tfr-mb-2 tfr-mobile-small-text">
27510
+ <div>Uncertain&nbsp;of&nbsp;your&nbsp;size?</div>
27505
27511
 
27506
27512
  <div class="tfr-toggle-closed">
27507
27513
  <div class="tfr-flex tfr-items-center">
27508
27514
  <div>Try</div>
27509
27515
  <div class="tfr-powered-by-logo">${tfrDoor}</div>
27510
- <div class="tfr-powered-by-text-bold">The Fitting Room</div>
27516
+ <div class="tfr-powered-by-text-bold">The&nbsp;Fitting&nbsp;Room</div>
27511
27517
  </div>
27512
27518
  </div>
27513
27519
 
27514
27520
  <div class="tfr-toggle-open">
27515
- <div class="tfr-flex tfr-items-center">
27521
+ <div id="tfr-login-to-view" class="tfr-flex tfr-items-center">
27516
27522
  ${userIcon} Login to view
27517
27523
  </div>
27518
27524
  </div>