@everymatrix/lottery-tipping-ticket-controller 1.77.11 → 1.77.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/general-tooltip_6.cjs.entry.js +18 -13
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/cjs/{lottery-tipping-ticket-controller-49fafe80.js → lottery-tipping-ticket-controller-a62bd4e8.js} +4 -3
- package/dist/collection/components/lottery-tipping-ticket-banner/lottery-tipping-ticket-banner.css +4 -4
- package/dist/collection/components/lottery-tipping-ticket-controller/lottery-tipping-ticket-controller.css +22 -13
- package/dist/collection/components/lottery-tipping-ticket-controller/lottery-tipping-ticket-controller.js +3 -2
- package/dist/esm/general-tooltip_6.entry.js +19 -14
- package/dist/esm/index.js +1 -1
- package/dist/esm/{lottery-tipping-ticket-controller-d72be1e9.js → lottery-tipping-ticket-controller-71cc1f83.js} +4 -3
- package/dist/lottery-tipping-ticket-controller/general-tooltip_6.entry.js +9 -8
- package/dist/lottery-tipping-ticket-controller/index.esm.js +1 -1
- package/dist/lottery-tipping-ticket-controller/{lottery-tipping-ticket-controller-d72be1e9.js → lottery-tipping-ticket-controller-71cc1f83.js} +1 -1
- package/package.json +1 -1
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
const index = require('./index-b8586f2f.js');
|
|
6
|
-
const lotteryTippingTicketController = require('./lottery-tipping-ticket-controller-
|
|
6
|
+
const lotteryTippingTicketController = require('./lottery-tipping-ticket-controller-a62bd4e8.js');
|
|
7
7
|
|
|
8
8
|
/**
|
|
9
9
|
* @name startOfDay
|
|
@@ -91,7 +91,7 @@ function isToday(dirtyDate) {
|
|
|
91
91
|
return isSameDay(dirtyDate, Date.now());
|
|
92
92
|
}
|
|
93
93
|
|
|
94
|
-
const generalTooltipCss = ".general-tooltip-wrapper{display:inline-block;position:relative;line-height:0}.general-tooltip-container{display:contents;}.general-tooltip-popup{position:absolute;
|
|
94
|
+
const generalTooltipCss = ".general-tooltip-wrapper{display:inline-block;position:relative;line-height:0}.general-tooltip-container{display:contents;}.general-tooltip-popup{position:absolute;color:var(--emw--color-typography-inverse, #fff);background:var(--emw--color-background-inverse, #000);padding:8px 12px;border-radius:4px;font-size:0.875em;line-height:1.4;z-index:1000;opacity:0;visibility:hidden;transition:opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;white-space:nowrap;pointer-events:none;}.general-tooltip-popup.visible{opacity:1;visibility:visible}.general-tooltip-arrow{position:absolute;width:0;height:0;border-style:solid}.general-tooltip-top{bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:8px;}.general-tooltip-top .general-tooltip-arrow{top:100%;left:50%;transform:translateX(-50%);border-width:6px 6px 0 6px;border-color:var(--emw--color-gray-300, #333) transparent transparent transparent}.general-tooltip-bottom{top:100%;left:50%;transform:translateX(-50%);margin-top:8px;}.general-tooltip-bottom .general-tooltip-arrow{bottom:100%;left:50%;transform:translateX(-50%);border-width:0 6px 6px 6px;border-color:transparent transparent var(--emw--color-gray-300, #333) transparent}.general-tooltip-left{right:100%;top:50%;transform:translateY(-50%);margin-right:8px;}.general-tooltip-left .general-tooltip-arrow{left:100%;top:50%;transform:translateY(-50%);border-width:6px 0 6px 6px;border-color:transparent transparent transparent var(--emw--color-gray-300, #333)}.general-tooltip-right{left:100%;top:50%;transform:translateY(-50%);margin-left:8px;}.general-tooltip-right .general-tooltip-arrow{right:100%;top:50%;transform:translateY(-50%);border-width:6px 6px 6px 0;border-color:transparent var(--emw--color-gray-300, #333) transparent transparent}";
|
|
95
95
|
const GeneralTooltipStyle0 = generalTooltipCss;
|
|
96
96
|
|
|
97
97
|
const GeneralTooltip = class {
|
|
@@ -175,7 +175,7 @@ const GeneralTooltip = class {
|
|
|
175
175
|
};
|
|
176
176
|
GeneralTooltip.style = GeneralTooltipStyle0;
|
|
177
177
|
|
|
178
|
-
const lotteryTippingBulletCss = ".LotteryTippingBullet__segment{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;font-size:16px;line-height:1;font-weight:500;color:var(--emw--color-
|
|
178
|
+
const lotteryTippingBulletCss = ".LotteryTippingBullet__segment{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;font-size:16px;line-height:1;font-weight:500;color:var(--emw--color-typography, #000);background:var(--emw--color-background, #fff);border:1px solid var(--emw--color-gray-100, #e6e6e6);border-radius:6px;cursor:pointer;transition:all 0.2s ease;user-select:none}.LotteryTippingBullet__segment:not(.LotteryTippingBullet__segment--disabled):hover{cursor:pointer;animation:jelly 0.3s ease-in-out;transform:scale(1.02)}.LotteryTippingBullet__segment--text{border:none;color:var(--emw--color-typography, #000);background:transparent;font-weight:400}.LotteryTippingBullet__segment--text:hover{cursor:not-allowed !important}.LotteryTippingBullet__segment--active{font-weight:600;background-color:var(--emw--color-background-inverse, #000);color:var(--emw--color-primary, #fed275)}.LotteryTippingBullet__segment--disabled:not(.LotteryTippingBullet__segment--active){background-color:var(--emw--color-background-tertiary, #ccc);color:var(--emw--color-gray-150, #6f6f6f);border-color:var(--emw--color-gray-100, #e6e6e6)}.LotteryTippingBullet__segment--disabled:hover{cursor:not-allowed}@keyframes jelly{0%{transform:translate(0, 0)}20%{transform:translate(-0.5px, -0.5px)}40%{transform:translate(0.5px, 0.5px)}60%{transform:translate(-0.25px, -0.25px)}80%{transform:translate(0.25px, 0.25px)}100%{transform:translate(0, 0)}}";
|
|
179
179
|
const LotteryTippingBulletStyle0 = lotteryTippingBulletCss;
|
|
180
180
|
|
|
181
181
|
const LotteryTippingBullet = class {
|
|
@@ -373,7 +373,7 @@ const translate$1 = (key, customLang) => {
|
|
|
373
373
|
return TRANSLATIONS$1[lang !== undefined && SUPPORTED_LANGUAGES$1.includes(lang) ? lang : DEFAULT_LANGUAGE$1][key];
|
|
374
374
|
};
|
|
375
375
|
|
|
376
|
-
const lotteryTippingTicketBannerCss = ".lottery-tipping-ticket-banner__container {\n font-family: system-ui, sans-serif;\n font-size: 14px;\n container-type: inline-size;\n}\n\n.banner {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: space-between;\n padding: 0 1rem;\n background: var(--emw--color-primary, #fed275);\n border-top: 2px solid var(--emw--color-primary, #fed275);\n border-bottom: 2px solid var(--emw--color-primary, #fed275);\n gap: 0.5rem;\n white-space: nowrap;\n position: relative;\n height: 46px;\n}\n\n.left {\n flex: 1;\n gap: 0.4rem;\n}\n.left .logo {\n width: 216px;\n position: absolute;\n top: -7px;\n}\n\n.brand {\n font-weight: 700;\n color: var(--emw--color-
|
|
376
|
+
const lotteryTippingTicketBannerCss = ".lottery-tipping-ticket-banner__container {\n font-family: system-ui, sans-serif;\n font-size: 14px;\n container-type: inline-size;\n}\n\n.banner {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: space-between;\n padding: 0 1rem;\n background: var(--emw--color-primary, #fed275);\n border-top: 2px solid var(--emw--color-primary, #fed275);\n border-bottom: 2px solid var(--emw--color-primary, #fed275);\n gap: 0.5rem;\n white-space: nowrap;\n position: relative;\n height: 46px;\n}\n\n.left {\n flex: 1;\n gap: 0.4rem;\n}\n.left .logo {\n width: 216px;\n position: absolute;\n top: -7px;\n}\n\n.brand {\n font-weight: 700;\n color: var(--emw--color-typography, #000);\n}\n\n.mid {\n flex: 1;\n font-size: 1.5rem;\n font-weight: 800;\n font-style: italic;\n letter-spacing: 0.04em;\n color: var(--emw--color-typography, #000);\n text-align: center;\n}\n\n.right {\n flex: 1;\n display: flex;\n gap: 0.4rem;\n flex-wrap: wrap;\n justify-content: flex-end;\n}\n\n@container (max-width: 420px) {\n .mid {\n text-align: right;\n }\n .right {\n justify-content: center;\n }\n}\n.pill {\n border: 1px solid var(--emw--color-gray-150, #6f6f6f);\n border-radius: 0.4rem;\n padding: 0.25rem 0.7rem;\n font-size: 0.9rem;\n color: var(--emw--color-gray-400, #000);\n display: inline-flex;\n align-items: baseline;\n}\n\n.pill > strong {\n font-weight: 700;\n}";
|
|
377
377
|
const LotteryTippingTicketBannerStyle0 = lotteryTippingTicketBannerCss;
|
|
378
378
|
|
|
379
379
|
const LotteryTippingTicketBanner = class {
|
|
@@ -6669,6 +6669,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
|
|
6669
6669
|
overflow: hidden;
|
|
6670
6670
|
min-width: var(--lumo-size-m);
|
|
6671
6671
|
-webkit-user-select: none;
|
|
6672
|
+
-moz-user-select: none;
|
|
6672
6673
|
user-select: none;
|
|
6673
6674
|
--_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-primary-color-50pct));
|
|
6674
6675
|
--_focus-ring-width: var(--vaadin-focus-ring-width, 2px);
|
|
@@ -6878,11 +6879,11 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
|
|
6878
6879
|
}
|
|
6879
6880
|
`,{moduleId:"lumo-tab"});/**
|
|
6880
6881
|
* @license
|
|
6881
|
-
* Copyright (c) 2017 -
|
|
6882
|
+
* Copyright (c) 2017 - 2024 Vaadin Ltd.
|
|
6882
6883
|
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
6883
6884
|
*/const hh=s=>class extends $r(s){ready(){super.ready(),this.setAttribute("role","tab");}_onKeyUp(e){const i=this.hasAttribute("active");if(super._onKeyUp(e),i){const o=this.querySelector("a");o&&o.click();}}};/**
|
|
6884
6885
|
* @license
|
|
6885
|
-
* Copyright (c) 2017 -
|
|
6886
|
+
* Copyright (c) 2017 - 2024 Vaadin Ltd.
|
|
6886
6887
|
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
6887
6888
|
*/const uh=p`
|
|
6888
6889
|
:host {
|
|
@@ -6905,7 +6906,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
|
|
6905
6906
|
}
|
|
6906
6907
|
`;/**
|
|
6907
6908
|
* @license
|
|
6908
|
-
* Copyright (c) 2017 -
|
|
6909
|
+
* Copyright (c) 2017 - 2024 Vaadin Ltd.
|
|
6909
6910
|
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
6910
6911
|
*/m("vaadin-tab",uh,{moduleId:"vaadin-tab-styles"});class ph extends N(x(hh(F(b)))){static get template(){return g`
|
|
6911
6912
|
<slot></slot>
|
|
@@ -7150,11 +7151,11 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
|
|
7150
7151
|
}
|
|
7151
7152
|
`,{moduleId:"lumo-tabs"});/**
|
|
7152
7153
|
* @license
|
|
7153
|
-
* Copyright (c) 2017 -
|
|
7154
|
+
* Copyright (c) 2017 - 2024 Vaadin Ltd.
|
|
7154
7155
|
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
7155
7156
|
*/const mh=s=>class extends Vr(Ur(s)){static get properties(){return {orientation:{value:"horizontal",type:String,reflectToAttribute:!0,sync:!0},selected:{value:0,type:Number}}}static get observers(){return ["__tabsItemsChanged(items)"]}constructor(){super(),this.__itemsResizeObserver=new ResizeObserver(()=>{setTimeout(()=>this._updateOverflow());});}get _scrollOffset(){return this._vertical?this._scrollerElement.offsetHeight:this._scrollerElement.offsetWidth}get _scrollerElement(){return this.$.scroll}get __direction(){return !this._vertical&&this.__isRTL?1:-1}ready(){super.ready(),this._scrollerElement.addEventListener("scroll",()=>this._updateOverflow()),this.setAttribute("role","tablist"),Ji(this,()=>{this._updateOverflow();});}_onResize(){this._updateOverflow();}__tabsItemsChanged(e){this.__itemsResizeObserver.disconnect(),(e||[]).forEach(i=>{this.__itemsResizeObserver.observe(i);}),this._updateOverflow();}_scrollForward(){const e=this._getNavigationButtonVisibleWidth("forward-button"),i=this._getNavigationButtonVisibleWidth("back-button"),o=this._scrollerElement.getBoundingClientRect(),n=[...this.items].reverse().find(c=>this._isItemVisible(c,e,i,o)).getBoundingClientRect(),l=20+this.shadowRoot.querySelector('[part="back-button"]').clientWidth;let d;if(this.__isRTL){const c=o.right-l;d=n.right-c;}else {const c=o.left+l;d=n.left-c;}-this.__direction*d<1&&(d=-this.__direction*(this._scrollOffset-l)),this._scroll(d);}_scrollBack(){const e=this._getNavigationButtonVisibleWidth("forward-button"),i=this._getNavigationButtonVisibleWidth("back-button"),o=this._scrollerElement.getBoundingClientRect(),n=this.items.find(c=>this._isItemVisible(c,e,i,o)).getBoundingClientRect(),l=20+this.shadowRoot.querySelector('[part="forward-button"]').clientWidth;let d;if(this.__isRTL){const c=o.left+l;d=n.left-c;}else {const c=o.right-l;d=n.right-c;}this.__direction*d<1&&(d=this.__direction*(this._scrollOffset-l)),this._scroll(d);}_isItemVisible(e,i,o,r){if(this._vertical)throw new Error("Visibility check is only supported for horizontal tabs.");const n=this.__isRTL?o:i,a=this.__isRTL?i:o,l=r.right-n,d=r.left+a,c=e.getBoundingClientRect();return l>Math.floor(c.left)&&d<Math.ceil(c.right)}_getNavigationButtonVisibleWidth(e){const i=this.shadowRoot.querySelector(`[part="${e}"]`);return window.getComputedStyle(i).opacity==="0"?0:i.clientWidth}_updateOverflow(){const e=this._vertical?this._scrollerElement.scrollTop:Hr(this._scrollerElement,this.getAttribute("dir")),i=this._vertical?this._scrollerElement.scrollHeight:this._scrollerElement.scrollWidth;let o=Math.floor(e)>1?"start":"";Math.ceil(e)<Math.ceil(i-this._scrollOffset)&&(o+=" end"),this.__direction===1&&(o=o.replace(/start|end/giu,r=>r==="start"?"end":"start")),o?this.setAttribute("overflow",o.trim()):this.removeAttribute("overflow");}};/**
|
|
7156
7157
|
* @license
|
|
7157
|
-
* Copyright (c) 2017 -
|
|
7158
|
+
* Copyright (c) 2017 - 2024 Vaadin Ltd.
|
|
7158
7159
|
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
7159
7160
|
*/const fh=p`
|
|
7160
7161
|
:host {
|
|
@@ -7234,7 +7235,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
|
|
7234
7235
|
}
|
|
7235
7236
|
`;/**
|
|
7236
7237
|
* @license
|
|
7237
|
-
* Copyright (c) 2017 -
|
|
7238
|
+
* Copyright (c) 2017 - 2024 Vaadin Ltd.
|
|
7238
7239
|
* This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
|
|
7239
7240
|
*/m("vaadin-tabs",fh,{moduleId:"vaadin-tabs-styles"});class _h extends mh(N(x(b))){static get template(){return g`
|
|
7240
7241
|
<div on-click="_scrollBack" part="back-button" aria-hidden="true"></div>
|
|
@@ -7246,7 +7247,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
|
|
|
7246
7247
|
<div on-click="_scrollForward" part="forward-button" aria-hidden="true"></div>
|
|
7247
7248
|
`}static get is(){return "vaadin-tabs"}}v(_h);
|
|
7248
7249
|
|
|
7249
|
-
const lotteryTippingTicketBetCss = ".LotteryTippingTicketBet__container {\n display: block; /* Or inline-block, depending on desired layout flow */\n font-size: 14px;\n line-height: 1.5715;\n color: var(--emw--color-
|
|
7250
|
+
const lotteryTippingTicketBetCss = ".LotteryTippingTicketBet__container {\n display: block; /* Or inline-block, depending on desired layout flow */\n font-size: 14px;\n line-height: 1.5715;\n color: var(--emw--color-typography, #000);\n background: var(--emw--color-background, #fff);\n overflow: hidden;\n min-width: 300px;\n container-type: inline-size;\n}\n@container (max-width: 375px) {\n .LotteryTippingTicketBet__container {\n font-size: 12px;\n }\n}\n\n.table-wrapper {\n overflow-x: auto; /* Handle horizontal scroll if content overflows */\n}\n\n.my-table-component {\n width: 100%;\n border-collapse: collapse; /* Important for borders */\n text-align: left;\n border-radius: 0.1rem; /* Ant Design like subtle rounding */\n border-spacing: 0;\n}\n\n/* Header */\n.my-table-component th {\n background: var(--emw--color-background-secondary, #f5f5f5);\n color: var(--emw--color-typography, #000);\n font-weight: 500;\n padding: 0.4rem 0.5rem;\n transition: background 0.3s ease;\n}\n\n/* Cells */\n.my-table-component td {\n padding: 0.4rem 0.5rem;\n color: var(--emw--color-typography, #000);\n background: var(--emw--color-background, #fff);\n transition: background 0.3s;\n}\n@container (max-width: 400px) {\n .my-table-component td {\n padding: 0.3rem 0.3rem;\n }\n}\n\n.my-table-component.bordered th,\n.my-table-component.bordered td {\n border-bottom: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n/* Bordered style */\n.my-table-component.grid th,\n.my-table-component.grid td {\n border: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n.my-table-component.grid th {\n border-bottom-width: 1px; /* Ensure bottom border is consistent */\n}\n\n.my-table-component.grid {\n border: 1px solid var(--emw--color-gray-100, #e6e6e6); /* Outer border */\n border-right-width: 0;\n border-bottom-width: 0;\n}\n\n.my-table-component.grid th:last-child,\n.my-table-component.grid td:last-child {\n border-right: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n.my-table-component.grid tr:last-child td {\n border-bottom: 1px solid var(--emw--color-gray-100, #e6e6e6);\n}\n\n/* Striped style */\n.my-table-component.striped tbody tr:nth-child(even) td {\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n}\n\n/* Hover (optional, but nice) */\n.my-table-component tbody tr:hover td {\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n}\n\n.flex {\n display: flex;\n}\n\n.justify-end {\n justify-content: flex-end;\n}\n\n.gap-1 {\n gap: 4px;\n}\n\n.justify-between {\n justify-content: space-between;\n}\n\n.align-center {\n align-items: center;\n}\n\n.gap-1 {\n gap: 0.5rem;\n}\n\n.btn {\n color: var(--emw--color-typography, #000);\n background: var(--emw--color-background, #fff);\n font-size: 14px;\n transition: all 0.2s ease;\n}\n.btn:hover {\n cursor: pointer;\n}\n\n.btn:hover {\n background-color: var(--emw--color-gray-100, #e6e6e6);\n}\n\n.btn.disabled {\n opacity: 0.5;\n pointer-events: none;\n}\n.btn.disabled:hover {\n cursor: not-allowed !important;\n}\n\n.LotteryTippingTicketBet__tableToolbar {\n width: 100%;\n margin-bottom: 1rem;\n}\n\n.LotteryTippingTicketBet__tableToolbar--item {\n background-color: transparent;\n cursor: pointer;\n font-weight: 500;\n white-space: nowrap;\n display: inline-flex;\n border-radius: 1.6rem;\n border: 1px solid var(--emw--color-gray-100, #e6e6e6);\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n padding-left: 1rem;\n padding-right: 1rem;\n margin-right: 2rem;\n color: var(--emw--color-typography, #000);\n}\n.LotteryTippingTicketBet__tableToolbar--item.mr-0 {\n margin-right: 0rem !important;\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup {\n flex-basis: 2rem;\n display: flex;\n flex-direction: column;\n gap: 1rem;\n border-radius: 8px;\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 2rem;\n height: 2rem;\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n color: var(--emw--color-typography, #000);\n border-radius: 8px;\n transition: all 0.2s ease-in-out;\n cursor: pointer;\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item:hover {\n transform: scale(1.1);\n box-shadow: 0 6px 14px var(--emw-calender-curday-box-shadow, rgba(0, 0, 0, 0.09));\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item img {\n width: 20px;\n height: 20px;\n transition: filter 0.2s ease-in-out;\n filter: grayscale(0.3);\n}\n\n.LotteryTippingTicketBet__lineOperatorGroup--item:hover img {\n filter: grayscale(0);\n transform: rotate(3deg);\n}\n\ndiv.border-line {\n margin-top: 1rem;\n height: 1px;\n width: 100%;\n box-sizing: border-box;\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n transition: all 0.3s ease;\n}\n\n.LotteryTippingTicketBet__footer {\n padding: 0.5rem;\n}\n\n.my-pagination {\n display: flex;\n justify-content: space-between;\n align-items: center;\n gap: 1rem;\n font-size: 0.8rem;\n color: var(--emw--color-typography-secondary, #333);\n}\n\n.my-pagination span {\n font-weight: 500;\n user-select: none;\n}\n\n.my-pagination .btn {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 2rem;\n height: 2rem;\n border-radius: 50%;\n transition: all 0.3s ease;\n cursor: pointer;\n opacity: 0.9;\n color: var(--emw--color-typography, #000);\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n}\n\n.my-pagination .btn img {\n width: 20px;\n height: 20px;\n transition: transform 0.2s ease;\n}\n\n.my-pagination .btn:hover {\n transform: scale(1.1);\n box-shadow: 0 6px 14px var(--emw-calender-curday-box-shadow, rgba(0, 0, 0, 0.09));\n}\n\n.my-pagination .btn.disabled {\n background-color: var(--emw--color-background-tertiary, #ccc);\n cursor: not-allowed;\n opacity: 0.5;\n transform: scale(1);\n}\n\n.match-info-item {\n display: flex;\n}\n\n.match-info-item-label {\n margin-right: 6px;\n}\n\n.info-icon:hover {\n cursor: pointer;\n}\n\n.LotteryTippingTicketBet__empty p {\n text-align: center;\n}\n\n.no-wrap {\n white-space: nowrap;\n overflow: hidden;\n}\n\n.eventNameContainer__item {\n line-height: 1rem;\n}\n.eventNameContainer__item--title {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 300px;\n}\n@container (max-width: 600px) {\n .eventNameContainer__item--title {\n max-width: 180px;\n }\n}\n@container (max-width: 500px) {\n .eventNameContainer__item--title {\n max-width: 150px;\n }\n}\n@container (max-width: 400px) {\n .eventNameContainer__item--title {\n max-width: 100px;\n }\n}\n@container (max-width: 330px) {\n .eventNameContainer__item--title {\n max-width: 70px;\n }\n}\n\n.LotteryTippingTicketBet__main {\n perspective: 800px;\n will-change: transform, opacity;\n backface-visibility: hidden;\n}\n\n@container (max-width: 520px) {\n .LotteryTippingTicketBet__main {\n flex-wrap: wrap;\n justify-content: center;\n }\n .LotteryTippingTicketBet__tableToolbar--item {\n margin-right: 0 !important;\n }\n}\n/* Fade-In Keyframes */\n@keyframes fadeInLeft {\n from {\n opacity: 0;\n transform: translateX(100%);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n/* Fade-Out Keyframes */\n@keyframes fadeOut {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n@keyframes fadeInRight {\n from {\n opacity: 0;\n transform: translateX(-100%);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n@keyframes fadeInUp {\n from {\n opacity: 0;\n transform: translateY(100%);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n@-webkit-keyframes slide-left {\n 0% {\n -webkit-transform: translateX(0);\n transform: translateX(0);\n }\n 100% {\n -webkit-transform: translateX(-100px);\n transform: translateX(-100px);\n }\n}\n@keyframes slide-left {\n 0% {\n -webkit-transform: translateX(100%);\n transform: translateX(100%);\n }\n 100% {\n -webkit-transform: translateX(0px);\n transform: translateX(0px);\n }\n}\n@-webkit-keyframes slide-right {\n 0% {\n -webkit-transform: translateX(-100%);\n transform: translateX(-100%);\n }\n 100% {\n -webkit-transform: translateX(0px);\n transform: translateX(0px);\n }\n}\n@keyframes slide-right {\n 0% {\n -webkit-transform: translateX(-100px);\n transform: translateX(-100px);\n }\n 100% {\n -webkit-transform: translateX(0);\n transform: translateX(0);\n }\n}\n@-webkit-keyframes slide-top {\n 0% {\n -webkit-transform: translateY(-100px);\n transform: translateY(-100px);\n }\n 100% {\n -webkit-transform: translateY(0px);\n transform: translateY(0px);\n }\n}\n@keyframes slide-top {\n 0% {\n -webkit-transform: translateY(-100px);\n transform: translateY(-100px);\n }\n 100% {\n -webkit-transform: translateY(0px);\n transform: translateY(0px);\n }\n}\n/* Apply to your card classes */\n.card-in-left {\n -webkit-animation: slide-left 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n animation: slide-left 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n}\n\n.card-out-left {\n animation: fadeOut 0.2s ease-out both;\n}\n\n.card-in-right {\n -webkit-animation: slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n animation: slide-right 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n}\n\n.card-out-right {\n animation: fadeOut 0.2s ease-out both;\n}\n\n.card-in-up {\n -webkit-animation: slide-top 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n animation: slide-top 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;\n}\n\n.card-out-down {\n animation: fadeOut 0.2s ease-out both;\n}";
|
|
7250
7251
|
const LotteryTippingTicketBetStyle0 = lotteryTippingTicketBetCss;
|
|
7251
7252
|
|
|
7252
7253
|
const LotteryTippingTicketBet = class {
|
|
@@ -7326,12 +7327,16 @@ const LotteryTippingTicketBet = class {
|
|
|
7326
7327
|
lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
|
|
7327
7328
|
}
|
|
7328
7329
|
}
|
|
7330
|
+
disconnectedCallback() {
|
|
7331
|
+
this.stylingSubscription && this.stylingSubscription.unsubscribe();
|
|
7332
|
+
}
|
|
7329
7333
|
componentWillLoad() {
|
|
7330
7334
|
if (this.translationUrl) {
|
|
7331
7335
|
getTranslations(JSON.parse(this.translationUrl));
|
|
7332
7336
|
}
|
|
7333
7337
|
}
|
|
7334
7338
|
componentDidLoad() {
|
|
7339
|
+
console.log(111, this.stylingContainer);
|
|
7335
7340
|
if (this.stylingContainer) {
|
|
7336
7341
|
if (this.mbSource)
|
|
7337
7342
|
lotteryTippingTicketController.setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
|
|
@@ -7521,10 +7526,10 @@ const LotteryTippingTicketBet = class {
|
|
|
7521
7526
|
var _a, _b, _c, _d;
|
|
7522
7527
|
const loadingImagePath = index.getAssetPath('../static/loading.svg');
|
|
7523
7528
|
if (this.isLoading) {
|
|
7524
|
-
return (index.h("div", { class: "flex align-center gap-1" }, index.h("p", null, translate('loading', this.language)), index.h("img", { src: loadingImagePath })));
|
|
7529
|
+
return (index.h("div", { ref: (el) => (this.stylingContainer = el), class: "LotteryTippingTicketBet__container" }, index.h("div", { class: "flex align-center gap-1" }, index.h("p", null, translate('loading', this.language)), index.h("img", { src: loadingImagePath }))));
|
|
7525
7530
|
}
|
|
7526
7531
|
if (this.hasErrors) {
|
|
7527
|
-
return (index.h("div",
|
|
7532
|
+
return (index.h("div", { ref: (el) => (this.stylingContainer = el), class: "LotteryTippingTicketBet__container" }, index.h("p", null, translate('error', this.language))));
|
|
7528
7533
|
}
|
|
7529
7534
|
const MyTable = ({ columns, dataSource, hideHead = false, grid = true, bordered = true }) => (index.h("table", { class: { bordered: bordered, grid: grid, 'my-table-component': true } }, !hideHead && (index.h("thead", null, index.h("tr", null, columns.map((column) => {
|
|
7530
7535
|
var _a;
|
package/dist/cjs/index.cjs.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const lotteryTippingTicketController = require('./lottery-tipping-ticket-controller-
|
|
5
|
+
const lotteryTippingTicketController = require('./lottery-tipping-ticket-controller-a62bd4e8.js');
|
|
6
6
|
require('./index-b8586f2f.js');
|
|
7
7
|
|
|
8
8
|
|
|
@@ -2755,7 +2755,7 @@ const getPlayTypeConfig = ({ rawData, selectedBettingType, selectedPlayingMode }
|
|
|
2755
2755
|
return { betTypeId, betType };
|
|
2756
2756
|
};
|
|
2757
2757
|
|
|
2758
|
-
const lotteryTippingTicketControllerCss = ".lottery-tipping-ticket-controller__container {\n display: block;\n box-sizing: border-box;\n font-size: 14px;\n container-type: inline-size;\n}\n@container (max-width: 375px) {\n .lottery-tipping-ticket-controller__container {\n font-size: 12px;\n }\n}\n\n.LotteryTippingTicketController__top {\n padding: 1.8rem;\n display: flex;\n flex-direction: column;\n gap: 2rem;\n margin: 0 auto;\n max-width: 800px;\n}\n.LotteryTippingTicketController__row {\n display: flex;\n align-items: center;\n gap: 1rem;\n justify-content: space-between;\n flex-wrap: wrap;\n}\n.LotteryTippingTicketController__section {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n.LotteryTippingTicketController__label {\n font-weight: 500;\n white-space: nowrap;\n width: 6rem;\n}\n.LotteryTippingTicketController__segmented-control {\n height: 2.2rem;\n display: inline-flex;\n background-color: var(--emw--color-
|
|
2758
|
+
const lotteryTippingTicketControllerCss = ".lottery-tipping-ticket-controller__container {\n display: block;\n box-sizing: border-box;\n font-size: 14px;\n container-type: inline-size;\n background: var(--emw--color-background, #fff);\n}\n@container (max-width: 375px) {\n .lottery-tipping-ticket-controller__container {\n font-size: 12px;\n }\n}\n\n.LotteryTippingTicketController__top {\n padding: 1.8rem;\n display: flex;\n flex-direction: column;\n gap: 2rem;\n margin: 0 auto;\n max-width: 800px;\n}\n.LotteryTippingTicketController__row {\n display: flex;\n align-items: center;\n gap: 1rem;\n justify-content: space-between;\n flex-wrap: wrap;\n}\n.LotteryTippingTicketController__section {\n display: flex;\n align-items: center;\n gap: 12px;\n}\n.LotteryTippingTicketController__label {\n font-weight: 500;\n white-space: nowrap;\n width: 6rem;\n color: var(--emw--color-typography-secondary, #333);\n}\n.LotteryTippingTicketController__segmented-control {\n height: 2.2rem;\n display: inline-flex;\n background-color: var(--emw--color-background-secondary, #f5f5f5);\n border-radius: 2rem;\n padding: 0.2rem;\n}\n.LotteryTippingTicketController__segment {\n background-color: transparent;\n border: none;\n padding: 0.3rem 0.8rem;\n cursor: pointer;\n font-weight: 500;\n border-radius: 2rem;\n outline: none;\n transition: background-color 0.25s ease, color 0.25s ease;\n white-space: nowrap;\n color: var(--emw--color-typography, #000);\n}\n.LotteryTippingTicketController__segment--active {\n background-color: var(--emw--color-background, #ffffff);\n color: var(--emw--color-typography, #000);\n font-weight: 600;\n}\n.LotteryTippingTicketController__segment--disabled:hover {\n cursor: not-allowed !important;\n}\n.LotteryTippingTicketController__segment:not(.LotteryTippingTicketController__segment--active):hover {\n background-color: var(--emw--color-background-tertiary, #ccc);\n}\n\n.flex {\n display: flex;\n}\n\n.flex-wrap {\n flex-wrap: wrap;\n}\n\n.align-center {\n align-items: center;\n}\n\n.gap-1 {\n gap: 4px;\n}\n\n.LotteryTippingTicketController__main {\n align-items: flex-start;\n justify-content: center;\n gap: 2rem;\n max-width: 1200px;\n margin: 0 auto;\n padding: 0 20px;\n flex-wrap: wrap;\n}\n.LotteryTippingTicketController__main--left {\n border: 1px solid var(--emw--color-gray-50, #f5f5f5);\n padding: 1rem;\n border-radius: 1rem;\n flex: 1.5;\n}\n.LotteryTippingTicketController__main--right {\n padding: 1rem;\n border-radius: 1rem;\n flex: 1;\n}\n\n.order-summary {\n max-width: 360px;\n width: 100%;\n background: var(--emw--color-background, #fff);\n}\n\n.order-summary__title {\n margin-bottom: 16px;\n text-align: center;\n color: var(--emw--color-typography, #000);\n text-transform: uppercase;\n}\n\n.order-summary__ticket-info {\n display: flex;\n align-items: center;\n margin-bottom: 16px;\n gap: 10px;\n color: var(--emw--color-typography, #000);\n}\n\n.order-summary__ticket {\n font-weight: 500;\n width: 50px;\n text-align: right;\n color: var(--emw--color-typography, #000);\n}\n\n.order-summary__details {\n display: flex;\n align-items: center;\n color: var(--emw--color-typography, #000);\n}\n\n.order-summary__multiplier {\n color: var(--emw--color-typography-secondary, #333);\n margin: 0 8px;\n}\n\n.order-summary__divider {\n border: none;\n border-top: 1px solid var(--emw--color-gray-100, #e6e6e6);\n margin: 20px 0;\n}\n\n.order-summary__button-wrapper {\n display: flex;\n justify-content: center;\n}\n\n.order-summary__button {\n cursor: pointer;\n padding: 0.5rem 4rem;\n background: var(--emw--color-primary, #fed275);\n color: var(--emw--color-typography, #000);\n border-radius: var(--emw--button-border-radius, 4px);\n border: none;\n}\n\n.order-summary__button:not(.order-summary__button--disabled):not(.order-summary__button--loading):hover {\n transform: translateY(-1px);\n background: var(--emw--color-primary-variant, #ffe66f);\n}\n\n.order-summary__button--loading {\n background: var(--emw--color-primary-variant, #ffe66f);\n cursor: not-allowed;\n}\n\n.order-summary__button--disabled {\n background: var(--emw--color-background-secondary, #f5f5f5);\n color: var(--emw--color-typography, #000);\n cursor: not-allowed;\n}\n\n.skeleton-content {\n display: flex;\n flex-direction: column;\n gap: 29px;\n align-items: center;\n}\n\n.skeleton-item {\n background: var(--emw--color-background-secondary, #f5f5f5);\n border-radius: 4px;\n height: 40px;\n width: 200px;\n}\n\n.skeleton-animated {\n animation: skeleton-shimmer 1.5s infinite linear;\n background: linear-gradient(90deg, var(--emw--color-background-secondary, #f5f5f5) 25%, var(--emw--color-background-tertiary, #ccc) 37%, var(--emw--color-background-secondary, #f5f5f5) 63%);\n background-size: 200% 100%;\n}\n\n@keyframes skeleton-shimmer {\n to {\n background-position: 100% 0;\n }\n}";
|
|
2759
2759
|
const LotteryTippingTicketControllerStyle0 = lotteryTippingTicketControllerCss;
|
|
2760
2760
|
|
|
2761
2761
|
const LotteryTippingTicketController = class {
|
|
@@ -3053,12 +3053,13 @@ const LotteryTippingTicketController = class {
|
|
|
3053
3053
|
renderOrderSummary() {
|
|
3054
3054
|
return (index.h("div", { class: "LotteryTippingTicketController__main--right order-summary" }, index.h("h3", { class: "order-summary__title" }, translate('orderSummaryTitle', this.language)), index.h("div", { class: "order-summary__ticket-info" }, index.h("div", { class: "order-summary__ticket" }, translate('orderSummaryTickets', this.language), ":"), index.h("div", { class: "order-summary__details" }, index.h("span", { class: "order-summary__line-count" }, this.lineCountRender), index.h("div", null, this.currentStake && index.h("span", { class: "order-summary__multiplier" }, "x"), index.h("span", { class: "order-summary__stake" }, this.currentStakeFormatted)), this.isBothBettingType && (index.h("div", null, index.h("span", { class: "order-summary__multiplier" }, "x"), index.h("span", { class: "order-summary__stake" }, "2"))))), index.h("hr", { class: "order-summary__divider" }), index.h("div", { class: "order-summary__ticket-info" }, index.h("div", { class: "order-summary__ticket" }, translate('orderSummaryTotal', this.language), ":"), index.h("span", { class: "order-summary__details" }, this.totalAmountFormatted)), index.h("div", { class: "order-summary__button-wrapper" }, index.h("button", { class: {
|
|
3055
3055
|
'order-summary__button': true,
|
|
3056
|
-
'order-summary__button--disabled': !this.hasSelectAllBullet
|
|
3056
|
+
'order-summary__button--disabled': !this.hasSelectAllBullet,
|
|
3057
|
+
'order-summary__button--loading': this.submitLoading
|
|
3057
3058
|
}, onClick: this.handleSubmit.bind(this), disabled: !this.hasSelectAllBullet || this.submitLoading }, index.h("div", { class: "flex align-center gap-1" }, translate('orderSummarySubmit', this.language), this.submitLoading && index.h("img", { src: this.loadingImagePath }))))));
|
|
3058
3059
|
}
|
|
3059
3060
|
render() {
|
|
3060
3061
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
3061
|
-
return (index.h("div", { key: '
|
|
3062
|
+
return (index.h("div", { key: '0a07c0f2b9d0ba2f72596ca2a39daace665d752f', class: "lottery-tipping-ticket-controller__container", ref: (el) => (this.stylingContainer = el) }, index.h("lottery-tipping-ticket-banner", { key: 'c02cbcab65f5d37455fdf6f416d880e40156f7a5', "client-styling": this.clientStyling, "client-styling-Url": this.clientStylingUrl, stopTime: (_b = (_a = this.rawData) === null || _a === void 0 ? void 0 : _a.currentDraw) === null || _b === void 0 ? void 0 : _b.wagerCloseTime, period: (_d = (_c = this.rawData) === null || _c === void 0 ? void 0 : _c.currentDraw) === null || _d === void 0 ? void 0 : _d.date, language: this.language, "translation-url": this.translationUrl }), this.renderBettingControls(), index.h("div", { key: 'bab9dfd04949e8f6cf41dea54a365beb5ab68c31', class: "flex flex-wrap LotteryTippingTicketController__main" }, index.h("div", { key: '3e60ccac1e6fcac2002f969a15fe5b323778999c', class: "LotteryTippingTicketController__main--left" }, index.h("lottery-tipping-ticket-bet", { key: '687dc500753e860750d436203b7a2585ed37658d', ref: (el) => (this.childRef = el), endpoint: this.endpoint, "session-id": this.sessionId, "game-id": (_e = this.rawData) === null || _e === void 0 ? void 0 : _e.type, "draw-id": this.drawId, language: this.language, "translation-url": this.translationUrl, "max-total-pages": this.lineNumberRange.maxLineNumber, "min-total-pages": this.lineNumberRange.minLineNumber, "total-pages": this.lineNumberRange.defaultBoards, mode: this.selectedPlayingMode === PlayModeEnum.SingleBet ? 'single' : 'multi', "client-styling": this.clientStyling, "client-styling-Url": this.clientStylingUrl })), this.renderOrderSummary()), this.dialogConfig.visible && (index.h("vaadin-confirm-dialog", { key: '4e5ae727ceaff20804a3c7c9acf63f8a3d2bd54d', rejectButtonVisible: true, rejectText: translate('cancel', this.language), confirmText: translate('confirm', this.language), opened: (_f = this.dialogConfig) === null || _f === void 0 ? void 0 : _f.visible, onConfirm: this.dialogConfig.onConfirm, onReject: this.dialogConfig.onCancel }, (_g = this.dialogConfig) === null || _g === void 0 ? void 0 : _g.content))));
|
|
3062
3063
|
}
|
|
3063
3064
|
static get assetsDirs() { return ["../static"]; }
|
|
3064
3065
|
static get watchers() { return {
|
package/dist/collection/components/lottery-tipping-ticket-banner/lottery-tipping-ticket-banner.css
CHANGED
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
|
|
32
32
|
.brand {
|
|
33
33
|
font-weight: 700;
|
|
34
|
-
color: var(--emw--color-
|
|
34
|
+
color: var(--emw--color-typography, #000);
|
|
35
35
|
}
|
|
36
36
|
|
|
37
37
|
.mid {
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
font-weight: 800;
|
|
41
41
|
font-style: italic;
|
|
42
42
|
letter-spacing: 0.04em;
|
|
43
|
-
color: var(--emw--color-
|
|
43
|
+
color: var(--emw--color-typography, #000);
|
|
44
44
|
text-align: center;
|
|
45
45
|
}
|
|
46
46
|
|
|
@@ -61,11 +61,11 @@
|
|
|
61
61
|
}
|
|
62
62
|
}
|
|
63
63
|
.pill {
|
|
64
|
-
border:
|
|
64
|
+
border: 1px solid var(--emw--color-gray-150, #6f6f6f);
|
|
65
65
|
border-radius: 0.4rem;
|
|
66
66
|
padding: 0.25rem 0.7rem;
|
|
67
67
|
font-size: 0.9rem;
|
|
68
|
-
color: var(--emw--color-gray-
|
|
68
|
+
color: var(--emw--color-gray-400, #000);
|
|
69
69
|
display: inline-flex;
|
|
70
70
|
align-items: baseline;
|
|
71
71
|
}
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
box-sizing: border-box;
|
|
4
4
|
font-size: 14px;
|
|
5
5
|
container-type: inline-size;
|
|
6
|
+
background: var(--emw--color-background, #fff);
|
|
6
7
|
}
|
|
7
8
|
@container (max-width: 375px) {
|
|
8
9
|
.lottery-tipping-ticket-controller__container {
|
|
@@ -34,11 +35,12 @@
|
|
|
34
35
|
font-weight: 500;
|
|
35
36
|
white-space: nowrap;
|
|
36
37
|
width: 6rem;
|
|
38
|
+
color: var(--emw--color-typography-secondary, #333);
|
|
37
39
|
}
|
|
38
40
|
.LotteryTippingTicketController__segmented-control {
|
|
39
41
|
height: 2.2rem;
|
|
40
42
|
display: inline-flex;
|
|
41
|
-
background-color: var(--emw--color-
|
|
43
|
+
background-color: var(--emw--color-background-secondary, #f5f5f5);
|
|
42
44
|
border-radius: 2rem;
|
|
43
45
|
padding: 0.2rem;
|
|
44
46
|
}
|
|
@@ -52,17 +54,18 @@
|
|
|
52
54
|
outline: none;
|
|
53
55
|
transition: background-color 0.25s ease, color 0.25s ease;
|
|
54
56
|
white-space: nowrap;
|
|
57
|
+
color: var(--emw--color-typography, #000);
|
|
55
58
|
}
|
|
56
59
|
.LotteryTippingTicketController__segment--active {
|
|
57
60
|
background-color: var(--emw--color-background, #ffffff);
|
|
58
|
-
color: var(--emw--color-
|
|
61
|
+
color: var(--emw--color-typography, #000);
|
|
59
62
|
font-weight: 600;
|
|
60
63
|
}
|
|
61
64
|
.LotteryTippingTicketController__segment--disabled:hover {
|
|
62
65
|
cursor: not-allowed !important;
|
|
63
66
|
}
|
|
64
67
|
.LotteryTippingTicketController__segment:not(.LotteryTippingTicketController__segment--active):hover {
|
|
65
|
-
background-color: var(--emw--
|
|
68
|
+
background-color: var(--emw--color-background-tertiary, #ccc);
|
|
66
69
|
}
|
|
67
70
|
|
|
68
71
|
.flex {
|
|
@@ -111,7 +114,7 @@
|
|
|
111
114
|
.order-summary__title {
|
|
112
115
|
margin-bottom: 16px;
|
|
113
116
|
text-align: center;
|
|
114
|
-
color: var(--emw--color-
|
|
117
|
+
color: var(--emw--color-typography, #000);
|
|
115
118
|
text-transform: uppercase;
|
|
116
119
|
}
|
|
117
120
|
|
|
@@ -120,21 +123,24 @@
|
|
|
120
123
|
align-items: center;
|
|
121
124
|
margin-bottom: 16px;
|
|
122
125
|
gap: 10px;
|
|
126
|
+
color: var(--emw--color-typography, #000);
|
|
123
127
|
}
|
|
124
128
|
|
|
125
129
|
.order-summary__ticket {
|
|
126
130
|
font-weight: 500;
|
|
127
131
|
width: 50px;
|
|
128
132
|
text-align: right;
|
|
133
|
+
color: var(--emw--color-typography, #000);
|
|
129
134
|
}
|
|
130
135
|
|
|
131
136
|
.order-summary__details {
|
|
132
137
|
display: flex;
|
|
133
138
|
align-items: center;
|
|
139
|
+
color: var(--emw--color-typography, #000);
|
|
134
140
|
}
|
|
135
141
|
|
|
136
142
|
.order-summary__multiplier {
|
|
137
|
-
color: var(--emw--color-
|
|
143
|
+
color: var(--emw--color-typography-secondary, #333);
|
|
138
144
|
margin: 0 8px;
|
|
139
145
|
}
|
|
140
146
|
|
|
@@ -153,22 +159,25 @@
|
|
|
153
159
|
cursor: pointer;
|
|
154
160
|
padding: 0.5rem 4rem;
|
|
155
161
|
background: var(--emw--color-primary, #fed275);
|
|
156
|
-
color: var(--emw--color-
|
|
162
|
+
color: var(--emw--color-typography, #000);
|
|
157
163
|
border-radius: var(--emw--button-border-radius, 4px);
|
|
158
|
-
border:
|
|
164
|
+
border: none;
|
|
159
165
|
}
|
|
160
166
|
|
|
161
167
|
.order-summary__button:not(.order-summary__button--disabled):not(.order-summary__button--loading):hover {
|
|
162
168
|
transform: translateY(-1px);
|
|
163
|
-
box-shadow: 0 4px 8px var(--emw--button-box-shadow-color-secondary, rgba(0, 0, 0, 0.15));
|
|
164
169
|
background: var(--emw--color-primary-variant, #ffe66f);
|
|
165
170
|
}
|
|
166
171
|
|
|
172
|
+
.order-summary__button--loading {
|
|
173
|
+
background: var(--emw--color-primary-variant, #ffe66f);
|
|
174
|
+
cursor: not-allowed;
|
|
175
|
+
}
|
|
176
|
+
|
|
167
177
|
.order-summary__button--disabled {
|
|
168
|
-
background: var(--emw--color-
|
|
169
|
-
color: var(--emw--color-typography, #
|
|
178
|
+
background: var(--emw--color-background-secondary, #f5f5f5);
|
|
179
|
+
color: var(--emw--color-typography, #000);
|
|
170
180
|
cursor: not-allowed;
|
|
171
|
-
border: 1px solid var(--emw--color-gray-100, #e6e6e6);
|
|
172
181
|
}
|
|
173
182
|
|
|
174
183
|
.skeleton-content {
|
|
@@ -179,7 +188,7 @@
|
|
|
179
188
|
}
|
|
180
189
|
|
|
181
190
|
.skeleton-item {
|
|
182
|
-
background: var(--emw--color-
|
|
191
|
+
background: var(--emw--color-background-secondary, #f5f5f5);
|
|
183
192
|
border-radius: 4px;
|
|
184
193
|
height: 40px;
|
|
185
194
|
width: 200px;
|
|
@@ -187,7 +196,7 @@
|
|
|
187
196
|
|
|
188
197
|
.skeleton-animated {
|
|
189
198
|
animation: skeleton-shimmer 1.5s infinite linear;
|
|
190
|
-
background: linear-gradient(90deg, var(--emw--color-
|
|
199
|
+
background: linear-gradient(90deg, var(--emw--color-background-secondary, #f5f5f5) 25%, var(--emw--color-background-tertiary, #ccc) 37%, var(--emw--color-background-secondary, #f5f5f5) 63%);
|
|
191
200
|
background-size: 200% 100%;
|
|
192
201
|
}
|
|
193
202
|
|
|
@@ -298,12 +298,13 @@ export class LotteryTippingTicketController {
|
|
|
298
298
|
renderOrderSummary() {
|
|
299
299
|
return (h("div", { class: "LotteryTippingTicketController__main--right order-summary" }, h("h3", { class: "order-summary__title" }, translate('orderSummaryTitle', this.language)), h("div", { class: "order-summary__ticket-info" }, h("div", { class: "order-summary__ticket" }, translate('orderSummaryTickets', this.language), ":"), h("div", { class: "order-summary__details" }, h("span", { class: "order-summary__line-count" }, this.lineCountRender), h("div", null, this.currentStake && h("span", { class: "order-summary__multiplier" }, "x"), h("span", { class: "order-summary__stake" }, this.currentStakeFormatted)), this.isBothBettingType && (h("div", null, h("span", { class: "order-summary__multiplier" }, "x"), h("span", { class: "order-summary__stake" }, "2"))))), h("hr", { class: "order-summary__divider" }), h("div", { class: "order-summary__ticket-info" }, h("div", { class: "order-summary__ticket" }, translate('orderSummaryTotal', this.language), ":"), h("span", { class: "order-summary__details" }, this.totalAmountFormatted)), h("div", { class: "order-summary__button-wrapper" }, h("button", { class: {
|
|
300
300
|
'order-summary__button': true,
|
|
301
|
-
'order-summary__button--disabled': !this.hasSelectAllBullet
|
|
301
|
+
'order-summary__button--disabled': !this.hasSelectAllBullet,
|
|
302
|
+
'order-summary__button--loading': this.submitLoading
|
|
302
303
|
}, onClick: this.handleSubmit.bind(this), disabled: !this.hasSelectAllBullet || this.submitLoading }, h("div", { class: "flex align-center gap-1" }, translate('orderSummarySubmit', this.language), this.submitLoading && h("img", { src: this.loadingImagePath }))))));
|
|
303
304
|
}
|
|
304
305
|
render() {
|
|
305
306
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
306
|
-
return (h("div", { key: '
|
|
307
|
+
return (h("div", { key: '0a07c0f2b9d0ba2f72596ca2a39daace665d752f', class: "lottery-tipping-ticket-controller__container", ref: (el) => (this.stylingContainer = el) }, h("lottery-tipping-ticket-banner", { key: 'c02cbcab65f5d37455fdf6f416d880e40156f7a5', "client-styling": this.clientStyling, "client-styling-Url": this.clientStylingUrl, stopTime: (_b = (_a = this.rawData) === null || _a === void 0 ? void 0 : _a.currentDraw) === null || _b === void 0 ? void 0 : _b.wagerCloseTime, period: (_d = (_c = this.rawData) === null || _c === void 0 ? void 0 : _c.currentDraw) === null || _d === void 0 ? void 0 : _d.date, language: this.language, "translation-url": this.translationUrl }), this.renderBettingControls(), h("div", { key: 'bab9dfd04949e8f6cf41dea54a365beb5ab68c31', class: "flex flex-wrap LotteryTippingTicketController__main" }, h("div", { key: '3e60ccac1e6fcac2002f969a15fe5b323778999c', class: "LotteryTippingTicketController__main--left" }, h("lottery-tipping-ticket-bet", { key: '687dc500753e860750d436203b7a2585ed37658d', ref: (el) => (this.childRef = el), endpoint: this.endpoint, "session-id": this.sessionId, "game-id": (_e = this.rawData) === null || _e === void 0 ? void 0 : _e.type, "draw-id": this.drawId, language: this.language, "translation-url": this.translationUrl, "max-total-pages": this.lineNumberRange.maxLineNumber, "min-total-pages": this.lineNumberRange.minLineNumber, "total-pages": this.lineNumberRange.defaultBoards, mode: this.selectedPlayingMode === PlayModeEnum.SingleBet ? 'single' : 'multi', "client-styling": this.clientStyling, "client-styling-Url": this.clientStylingUrl })), this.renderOrderSummary()), this.dialogConfig.visible && (h("vaadin-confirm-dialog", { key: '4e5ae727ceaff20804a3c7c9acf63f8a3d2bd54d', rejectButtonVisible: true, rejectText: translate('cancel', this.language), confirmText: translate('confirm', this.language), opened: (_f = this.dialogConfig) === null || _f === void 0 ? void 0 : _f.visible, onConfirm: this.dialogConfig.onConfirm, onReject: this.dialogConfig.onCancel }, (_g = this.dialogConfig) === null || _g === void 0 ? void 0 : _g.content))));
|
|
307
308
|
}
|
|
308
309
|
static get is() { return "lottery-tipping-ticket-controller"; }
|
|
309
310
|
static get encapsulation() { return "shadow"; }
|