@ptcwebops/ptcw-design 5.8.1 → 5.8.3
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/blog-detail-content_21.cjs.entry.js +7 -1
- package/dist/cjs/ptc-ellipsis-dropdown.cjs.entry.js +1 -1
- package/dist/cjs/ptc-readmore.cjs.entry.js +1 -1
- package/dist/collection/components/ptc-ellipsis-dropdown/ptc-ellipsis-dropdown.js +1 -1
- package/dist/collection/components/ptc-preloader-section/ptc-preloader-section.css +142 -0
- package/dist/collection/components/ptc-preloader-section/ptc-preloader-section.js +6 -0
- package/dist/collection/components/ptc-readmore/ptc-readmore.js +1 -1
- package/dist/custom-elements/index.js +9 -3
- package/dist/esm/blog-detail-content_21.entry.js +7 -1
- package/dist/esm/ptc-ellipsis-dropdown.entry.js +1 -1
- package/dist/esm/ptc-readmore.entry.js +1 -1
- package/dist/ptcw-design/{p-e09163f2.entry.js → p-3a53b3e8.entry.js} +1 -1
- package/dist/ptcw-design/p-754fe9f4.entry.js +1 -0
- package/dist/ptcw-design/p-ab7224b7.entry.js +1 -0
- package/dist/ptcw-design/ptcw-design.esm.js +1 -1
- package/package.json +1 -1
- package/readme.md +1 -1
- package/dist/ptcw-design/p-510575ce.entry.js +0 -1
- package/dist/ptcw-design/p-5af20305.entry.js +0 -1
|
@@ -48,7 +48,7 @@ const PtcEllipsisDropdown = class {
|
|
|
48
48
|
return (index.h("div", { class: this.dropdownType == 'tab-with-banner' ? "ptc-ellipsis-dropdown tab-with-banner" : "ptc-ellipsis-dropdown default", onClick: (e) => this.dropdownToggle(e) }, (this.isMobile || (this.isIPad && this.dropdownType === 'tab-with-banner')) ? (index.h("div", { class: 'mob-drop' }, index.h("span", { class: 'opt-name' }, this.dataItems.map((item) => item.isSelected ? item.text : '')), index.h("svg", { width: "12", height: "9", viewBox: "0 0 12 9", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M1 1.65723L5.94975 6.60697L10.8995 1.65723", stroke: "#00890B", "stroke-width": "2", "stroke-linecap": "round" })))) : (index.h("div", { class: isActive || this.isDropdownOpen ? "ellipsis-icon active" : "ellipsis-icon" }, index.h("icon-asset", { type: "ptc", size: "xxx-small", name: "ellipsis", color: isActive || this.isDropdownOpen ? 'white' : 'black' }))), index.h("div", { class: "dropdown-container" }, index.h("slot", { name: "dropdown" }), this.dataItems.map(dataItem => {
|
|
49
49
|
let activeClass = dataItem.value == this.selectedTab ? 'active' : '';
|
|
50
50
|
let activeDropdown = dataItem.isSelected ? 'selected-drop' : '';
|
|
51
|
-
return (index.h("dropdown-item", { class: activeClass + activeDropdown }, index.h("span", { onClick: (e) => {
|
|
51
|
+
return (index.h("dropdown-item", { class: activeClass + activeDropdown + 'mf-listen' }, index.h("span", { onClick: (e) => {
|
|
52
52
|
e.preventDefault();
|
|
53
53
|
this.onItemSelected(dataItem);
|
|
54
54
|
} }, dataItem.text)));
|
|
@@ -77,7 +77,7 @@ const PtcReadmore = class {
|
|
|
77
77
|
}
|
|
78
78
|
render() {
|
|
79
79
|
const classMap = this.getCssClassMap();
|
|
80
|
-
return (index.h(index.Host, { class: this.display }, index.h("div", { class: classMap }, index.h("input", { type: "checkbox", id: "expanded", onClick: (e) => this.handleClick(e), tabIndex: -1 }), !!this.visibleLines || !!this.visibleLinesCustom ? index.h("p", { class: `read-more-text ${this.visibleLines}`, style: { WebkitLineClamp: `${this.visibleLinesCustom}` } }, index.h("slot", null)) : null, index.h("label", { htmlFor: "expanded", role: "button", class: `${this.zIndex + ' ' + this.readMorePosition} read-more-cta-label` }, index.h("span", null, this.moreText)))));
|
|
80
|
+
return (index.h(index.Host, { class: this.display }, index.h("div", { class: classMap }, index.h("input", { type: "checkbox", id: "expanded", onClick: (e) => this.handleClick(e), tabIndex: -1 }), !!this.visibleLines || !!this.visibleLinesCustom ? index.h("p", { class: `read-more-text ${this.visibleLines}`, style: { WebkitLineClamp: `${this.visibleLinesCustom}` } }, index.h("slot", null)) : null, index.h("label", { htmlFor: "expanded", role: "button", class: `${this.zIndex + ' ' + this.readMorePosition} read-more-cta-label mf-listen` }, index.h("span", null, this.moreText)))));
|
|
81
81
|
}
|
|
82
82
|
getCssClassMap() {
|
|
83
83
|
return {
|
|
@@ -39,7 +39,7 @@ export class PtcEllipsisDropdown {
|
|
|
39
39
|
return (h("div", { class: this.dropdownType == 'tab-with-banner' ? "ptc-ellipsis-dropdown tab-with-banner" : "ptc-ellipsis-dropdown default", onClick: (e) => this.dropdownToggle(e) }, (this.isMobile || (this.isIPad && this.dropdownType === 'tab-with-banner')) ? (h("div", { class: 'mob-drop' }, h("span", { class: 'opt-name' }, this.dataItems.map((item) => item.isSelected ? item.text : '')), h("svg", { width: "12", height: "9", viewBox: "0 0 12 9", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M1 1.65723L5.94975 6.60697L10.8995 1.65723", stroke: "#00890B", "stroke-width": "2", "stroke-linecap": "round" })))) : (h("div", { class: isActive || this.isDropdownOpen ? "ellipsis-icon active" : "ellipsis-icon" }, h("icon-asset", { type: "ptc", size: "xxx-small", name: "ellipsis", color: isActive || this.isDropdownOpen ? 'white' : 'black' }))), h("div", { class: "dropdown-container" }, h("slot", { name: "dropdown" }), this.dataItems.map(dataItem => {
|
|
40
40
|
let activeClass = dataItem.value == this.selectedTab ? 'active' : '';
|
|
41
41
|
let activeDropdown = dataItem.isSelected ? 'selected-drop' : '';
|
|
42
|
-
return (h("dropdown-item", { class: activeClass + activeDropdown }, h("span", { onClick: (e) => {
|
|
42
|
+
return (h("dropdown-item", { class: activeClass + activeDropdown + 'mf-listen' }, h("span", { onClick: (e) => {
|
|
43
43
|
e.preventDefault();
|
|
44
44
|
this.onItemSelected(dataItem);
|
|
45
45
|
} }, dataItem.text)));
|
|
@@ -1578,6 +1578,148 @@ ptc-link, ptc-square-card,
|
|
|
1578
1578
|
position: relative;
|
|
1579
1579
|
}
|
|
1580
1580
|
|
|
1581
|
+
.preloader-white-paper {
|
|
1582
|
+
position: relative;
|
|
1583
|
+
width: 100%;
|
|
1584
|
+
top: 0px;
|
|
1585
|
+
left: 0px;
|
|
1586
|
+
}
|
|
1587
|
+
.preloader-white-paper .hero-image {
|
|
1588
|
+
height: 462px;
|
|
1589
|
+
left: 0px;
|
|
1590
|
+
position: absolute;
|
|
1591
|
+
top: 0px;
|
|
1592
|
+
width: 100%;
|
|
1593
|
+
z-index: 2;
|
|
1594
|
+
background-color: var(--color-gray-03);
|
|
1595
|
+
}
|
|
1596
|
+
.preloader-white-paper .content-container {
|
|
1597
|
+
z-index: 3;
|
|
1598
|
+
position: relative;
|
|
1599
|
+
}
|
|
1600
|
+
.preloader-white-paper .content-container .content-container-child {
|
|
1601
|
+
top: 80px;
|
|
1602
|
+
margin-bottom: 70px;
|
|
1603
|
+
background-color: var(--color-white);
|
|
1604
|
+
position: relative;
|
|
1605
|
+
}
|
|
1606
|
+
.preloader-white-paper .content-container .grid-top {
|
|
1607
|
+
margin-top: 4px;
|
|
1608
|
+
margin-bottom: 40px;
|
|
1609
|
+
}
|
|
1610
|
+
.preloader-white-paper .content-container .grid-top-2 {
|
|
1611
|
+
margin-bottom: 28px;
|
|
1612
|
+
}
|
|
1613
|
+
.preloader-white-paper .content-container .block-1 {
|
|
1614
|
+
height: 527px;
|
|
1615
|
+
}
|
|
1616
|
+
.preloader-white-paper .content-container .skeleton .skeleton-block.longer {
|
|
1617
|
+
width: 95%;
|
|
1618
|
+
}
|
|
1619
|
+
.preloader-white-paper .content-container .skeleton .skeleton-block.longest {
|
|
1620
|
+
width: 97%;
|
|
1621
|
+
}
|
|
1622
|
+
.preloader-white-paper .content-container .skeleton .skeleton-block.long {
|
|
1623
|
+
width: 93%;
|
|
1624
|
+
}
|
|
1625
|
+
.preloader-white-paper .related-items {
|
|
1626
|
+
margin-top: 157px;
|
|
1627
|
+
padding-bottom: 40px;
|
|
1628
|
+
}
|
|
1629
|
+
.preloader-white-paper .related-items .title {
|
|
1630
|
+
display: flex;
|
|
1631
|
+
flex-direction: row;
|
|
1632
|
+
justify-content: center;
|
|
1633
|
+
}
|
|
1634
|
+
.preloader-white-paper .related-items .skeleton .skeleton-block.block-2 {
|
|
1635
|
+
height: 302px;
|
|
1636
|
+
width: 100%;
|
|
1637
|
+
}
|
|
1638
|
+
@media only screen and (min-width: 768px) {
|
|
1639
|
+
.preloader-white-paper .related-items .skeleton .skeleton-block.block-2 {
|
|
1640
|
+
height: 425px;
|
|
1641
|
+
}
|
|
1642
|
+
}
|
|
1643
|
+
|
|
1644
|
+
.preloader-value-led {
|
|
1645
|
+
position: relative;
|
|
1646
|
+
height: 120%;
|
|
1647
|
+
width: 100%;
|
|
1648
|
+
top: 0px;
|
|
1649
|
+
left: 0px;
|
|
1650
|
+
}
|
|
1651
|
+
.preloader-value-led .hero-image {
|
|
1652
|
+
height: 462px;
|
|
1653
|
+
left: 0px;
|
|
1654
|
+
position: absolute;
|
|
1655
|
+
top: 0px;
|
|
1656
|
+
width: 100%;
|
|
1657
|
+
z-index: 2;
|
|
1658
|
+
background-color: var(--color-gray-03);
|
|
1659
|
+
}
|
|
1660
|
+
.preloader-value-led .content-container {
|
|
1661
|
+
z-index: 3;
|
|
1662
|
+
position: relative;
|
|
1663
|
+
height: 120%;
|
|
1664
|
+
}
|
|
1665
|
+
.preloader-value-led .content-container .content-container-child {
|
|
1666
|
+
top: 80px;
|
|
1667
|
+
margin-bottom: 70px;
|
|
1668
|
+
position: relative;
|
|
1669
|
+
}
|
|
1670
|
+
.preloader-value-led .content-container .content-container-child .container-child-1 {
|
|
1671
|
+
background-color: var(--color-white);
|
|
1672
|
+
display: none;
|
|
1673
|
+
}
|
|
1674
|
+
@media only screen and (min-width: 992px) {
|
|
1675
|
+
.preloader-value-led .content-container .content-container-child .container-child-1 {
|
|
1676
|
+
display: block;
|
|
1677
|
+
}
|
|
1678
|
+
}
|
|
1679
|
+
.preloader-value-led .content-container .content-container-child .container-child-2 {
|
|
1680
|
+
background-color: var(--color-white);
|
|
1681
|
+
}
|
|
1682
|
+
.preloader-value-led .content-container .related-items {
|
|
1683
|
+
height: 100px;
|
|
1684
|
+
}
|
|
1685
|
+
.preloader-value-led .content-container .grid-top {
|
|
1686
|
+
margin-top: 4px;
|
|
1687
|
+
margin-bottom: 40px;
|
|
1688
|
+
}
|
|
1689
|
+
.preloader-value-led .content-container .grid-top-1 {
|
|
1690
|
+
margin-bottom: 49px;
|
|
1691
|
+
}
|
|
1692
|
+
.preloader-value-led .content-container .block-1 {
|
|
1693
|
+
height: 434px;
|
|
1694
|
+
}
|
|
1695
|
+
.preloader-value-led .content-container .skeleton .skeleton-block.longer {
|
|
1696
|
+
width: 97%;
|
|
1697
|
+
}
|
|
1698
|
+
.preloader-value-led .content-container .skeleton .skeleton-block.longest {
|
|
1699
|
+
width: 99%;
|
|
1700
|
+
}
|
|
1701
|
+
.preloader-value-led .content-container .skeleton .skeleton-block.long {
|
|
1702
|
+
width: 95%;
|
|
1703
|
+
}
|
|
1704
|
+
.preloader-value-led .content-container .skeleton .skeleton-block.long-1 {
|
|
1705
|
+
width: 90%;
|
|
1706
|
+
}
|
|
1707
|
+
.preloader-value-led .content-container .skeleton .skeleton-block.long-2 {
|
|
1708
|
+
width: 87%;
|
|
1709
|
+
}
|
|
1710
|
+
.preloader-value-led .content-container .skeleton .skeleton-block.long-3 {
|
|
1711
|
+
width: 60%;
|
|
1712
|
+
}
|
|
1713
|
+
.preloader-value-led .content-container .skeleton .skeleton-block.long-4 {
|
|
1714
|
+
width: 70%;
|
|
1715
|
+
}
|
|
1716
|
+
.preloader-value-led .content-container .skeleton .skeleton-block.smallest {
|
|
1717
|
+
width: 10%;
|
|
1718
|
+
}
|
|
1719
|
+
.preloader-value-led .content-container .skeleton .skeleton-block.thinnnest {
|
|
1720
|
+
height: 19px;
|
|
1721
|
+
}
|
|
1722
|
+
|
|
1581
1723
|
@keyframes pulse {
|
|
1582
1724
|
0% {
|
|
1583
1725
|
opacity: 0.5;
|
|
@@ -54,6 +54,12 @@ export class PtcPreloaderSection {
|
|
|
54
54
|
case 'on-demand-video-listing': {
|
|
55
55
|
return (h("div", { class: "preloader-wrapper skeleton-on-demand" }, h("div", { class: "ptc-container-lg" }, h("div", { class: "skeleton" }, h("div", { class: "on-demand-vl" }, h("div", { class: "is-grid block grid-top" }, h("div", { class: "is-col-6 is-placed-left" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thin medium-1 left" }))), h("div", { class: "is-col-6 is-placed-right" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thick medium-1 right" })))), h("div", { class: "is-grid block" }, h("div", { class: "is-col-12 is-placed-left" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thick short left" }), h("div", { class: "skeleton-block thin wide-sm-1 left" }), h("div", { class: "skeleton-block thin wide-md left" }), h("div", { class: "skeleton-block thin wide-md-1 left" }), h("div", { class: "skeleton-block thin wide-md left" }), h("div", { class: "skeleton-block thin wide-sm-2 left" }), h("div", { class: "skeleton-block thin smallest left" })))), h("div", { class: "grid-medium" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thin short left" })), h("div", { class: "grid-vl has-col-gap-sm" }, h("div", { class: "block hide-bl" }, h("div", { class: "skeleton-block block-8 " }), h("div", { class: "skeleton-block thin long left" }), h("div", { class: "skeleton-block thin left" })), h("div", { class: "block hide-xs" }, h("div", { class: "skeleton-block block-8 " }), h("div", { class: "skeleton-block thin long left" }), h("div", { class: "skeleton-block thin left" })), h("div", { class: "block hide-sm" }, h("div", { class: "skeleton-block block-8 " }), h("div", { class: "skeleton-block thin long left" }), h("div", { class: "skeleton-block thin left" })), h("div", { class: "block hide-lg" }, h("div", { class: "skeleton-block block-8 " }), h("div", { class: "skeleton-block thin long left" }), h("div", { class: "skeleton-block thin left" })), h("div", { class: "block hide-xl" }, h("div", { class: "skeleton-block block-8 " }), h("div", { class: "skeleton-block thin long left" }), h("div", { class: "skeleton-block thin left" })))), h("div", { class: "grid-medium-2" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thin short left" })), h("div", { class: "grid-vl has-col-gap-sm" }, h("div", { class: "block hide-bl" }, h("div", { class: "skeleton-block block-9 " })), h("div", { class: "block hide-xs" }, h("div", { class: "skeleton-block block-9 " })), h("div", { class: "block hide-sm" }, h("div", { class: "skeleton-block block-9 " })), h("div", { class: "block hide-lg" }, h("div", { class: "skeleton-block block-9 " })), h("div", { class: "block hide-xl" }, h("div", { class: "skeleton-block block-9 " })))), h("div", { class: "grid-bottom-1" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thin short left" })), h("div", { class: "is-grid has-col-gap-sm" }, h("div", { class: "is-col-12-xs is-col-6-sm" }, h("div", { class: "block" }, h("div", { class: "skeleton-block block-10 hide-bl" }))), h("div", { class: "is-col-12-xs is-col-6-sm" }, h("div", { class: "block" }, h("div", { class: "skeleton-block block-10 hide-sm" }))))), h("div", { class: "grid-bottom-2" }, h("div", { class: "is-grid" }, h("div", { class: "is-col-12" }, h("div", { class: "block" }, h("div", { class: "skeleton-block block-11" }))))), h("div", { class: "grid-bottom" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thin short left" })), h("div", { class: "grid-vl has-col-gap-sm" }, h("div", { class: "block hide-bl" }, h("div", { class: "skeleton-block block-8 " }), h("div", { class: "skeleton-block thin long left" }), h("div", { class: "skeleton-block thin left" })), h("div", { class: "block hide-xs" }, h("div", { class: "skeleton-block block-8 " }), h("div", { class: "skeleton-block thin long left" }), h("div", { class: "skeleton-block thin left" })), h("div", { class: "block hide-sm" }, h("div", { class: "skeleton-block block-8 " }), h("div", { class: "skeleton-block thin long left" }), h("div", { class: "skeleton-block thin left" })), h("div", { class: "block hide-lg" }, h("div", { class: "skeleton-block block-8 " }), h("div", { class: "skeleton-block thin long left" }), h("div", { class: "skeleton-block thin left" })), h("div", { class: "block hide-xl" }, h("div", { class: "skeleton-block block-8 " }), h("div", { class: "skeleton-block thin long left" }), h("div", { class: "skeleton-block thin left" })))))))));
|
|
56
56
|
}
|
|
57
|
+
case 'white-paper': {
|
|
58
|
+
return (h("div", { class: "preloader-wrapper" }, h("div", { class: "preloader-white-paper" }, h("div", { class: "hero-image" }), h("div", { class: "ptc-container content-container" }, h("div", { class: "content-container-child" }, h("div", { class: "skeleton" }, h("div", { class: "is-grid block grid-top" }, h("div", { class: "is-col-6 is-placed-left" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block bold medium left" }))), h("div", { class: "is-col-6 is-placed-right" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block extra-bold narrow right" })))), h("div", { class: "is-grid block grid-top-2 has-no-row-gap has-no-col-gap" }, h("div", { class: "is-col-12" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thick" }))), h("div", { class: "is-col-6" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thick medium left" })))), h("div", { class: "" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block block-1" }))), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longer" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin long" }), h("div", { class: "skeleton-block thin wide" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longer" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin long" }), h("div", { class: "skeleton-block thin wide" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block thin longer" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin long" }), h("div", { class: "skeleton-block thin wide" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }))), h("div", { class: "related-items" }, h("div", { class: "is-grid" }, h("div", { class: "is-col-12" }, h("div", { class: "title" }, h("div", { class: "skeleton-block thick long" }))), h("div", { class: "is-col-12 is-col-4-md" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block block-2" }))), h("div", { class: "is-col-12 is-col-4-md" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block block-2" }))), h("div", { class: "is-col-12 is-col-4-md" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block block-2" }))))), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" })))));
|
|
59
|
+
}
|
|
60
|
+
case 'value-led': {
|
|
61
|
+
return (h("div", { class: "preloader-wrapper" }, h("div", { class: "preloader-value-led" }, h("div", { class: "hero-image" }), h("div", { class: "ptc-container content-container" }, h("div", { class: "content-container-child" }, h("div", { class: "is-grid has-col-gap-md" }, h("div", { class: "is-col-3-lg" }, h("div", { class: "skeleton container-child-1" }, h("div", { class: "is-grid block grid-top" }, h("div", { class: "is-col-12 is-placed-left" }, Array.from({ length: 8 }).map(() => (h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thinnest" }), h("div", { class: "skeleton-block thinnest long-4" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" })))))))), h("div", { class: "is-col-12 is-col-9-lg" }, h("div", { class: "skeleton container-child-2" }, h("div", { class: "is-grid block grid-top" }, h("div", { class: "is-col-12 is-placed-left" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thin smallest left" }), h("div", { class: "skeleton-block thick long-1" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block bold long-2" }), h("div", { class: "skeleton-block bold long-1" }), h("div", { class: "skeleton-block bold long-3" })))), h("div", { class: "grid-top-1" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block block-1" }))), h("div", { class: "skeleton-block bold" }), h("div", { class: "skeleton-block bold long-2" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block thinnnest longer" }), h("div", { class: "skeleton-block thinnnest longer" }), h("div", { class: "skeleton-block thinnnest longest" }), h("div", { class: "skeleton-block thinnnest long" }), h("div", { class: "skeleton-block thinnnest long-4" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block bold" }), h("div", { class: "skeleton-block bold long-2" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block thinnnest longer" }), h("div", { class: "skeleton-block thinnnest longer" }), h("div", { class: "skeleton-block thinnnest longest" }), h("div", { class: "skeleton-block thinnnest long" }), h("div", { class: "skeleton-block thinnnest long-4" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block thinnnest longer" }), h("div", { class: "skeleton-block thinnnest longer" }), h("div", { class: "skeleton-block thinnnest longest" }), h("div", { class: "skeleton-block thinnnest long" }), h("div", { class: "skeleton-block thinnnest long-4" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }))))), h("div", { class: "related-items" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" })))));
|
|
62
|
+
}
|
|
57
63
|
default:
|
|
58
64
|
return (h("div", { class: "ptc-section-standard preload-min-height" }, h("div", { class: "ptc-container" }, h("max-width-container", { "max-width": "960", breakpoint: 1200 }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-header" }, h("div", { class: "skeleton-block bold" }), h("div", { class: "skeleton-block wide bold" }), h("ptc-spacer", { breakpoint: "small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "x-large" }), h("div", { class: "skeleton-block medium" }), h("div", { class: "skeleton-block narrow" }), h("div", { class: "skeleton-block short" })), h("div", { class: "skeleton-image" }), h("div", { class: "skeleton-text" }, h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block long" }), h("div", { class: "skeleton-block narrow" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block medium" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block long" }), h("div", { class: "skeleton-block medium" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block long" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block medium" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block wide" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block short bold" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block wide" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block medium" })))))));
|
|
59
65
|
}
|
|
@@ -69,7 +69,7 @@ export class PtcReadmore {
|
|
|
69
69
|
}
|
|
70
70
|
render() {
|
|
71
71
|
const classMap = this.getCssClassMap();
|
|
72
|
-
return (h(Host, { class: this.display }, h("div", { class: classMap }, h("input", { type: "checkbox", id: "expanded", onClick: (e) => this.handleClick(e), tabIndex: -1 }), !!this.visibleLines || !!this.visibleLinesCustom ? h("p", { class: `read-more-text ${this.visibleLines}`, style: { WebkitLineClamp: `${this.visibleLinesCustom}` } }, h("slot", null)) : null, h("label", { htmlFor: "expanded", role: "button", class: `${this.zIndex + ' ' + this.readMorePosition} read-more-cta-label` }, h("span", null, this.moreText)))));
|
|
72
|
+
return (h(Host, { class: this.display }, h("div", { class: classMap }, h("input", { type: "checkbox", id: "expanded", onClick: (e) => this.handleClick(e), tabIndex: -1 }), !!this.visibleLines || !!this.visibleLinesCustom ? h("p", { class: `read-more-text ${this.visibleLines}`, style: { WebkitLineClamp: `${this.visibleLinesCustom}` } }, h("slot", null)) : null, h("label", { htmlFor: "expanded", role: "button", class: `${this.zIndex + ' ' + this.readMorePosition} read-more-cta-label mf-listen` }, h("span", null, this.moreText)))));
|
|
73
73
|
}
|
|
74
74
|
getCssClassMap() {
|
|
75
75
|
return {
|