@ptcwebops/ptcw-design 2.2.7 → 2.2.9

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.
@@ -1,17 +0,0 @@
1
- import { r as registerInstance, h } from './index-22a84644.js';
2
-
3
- const ptcLottieCss = ":host{display:block;width:100%;height:auto}";
4
-
5
- const PtcLottie = class {
6
- constructor(hostRef) {
7
- registerInstance(this, hostRef);
8
- this.jsonSrc = undefined;
9
- this.speed = 1;
10
- }
11
- render() {
12
- return (h("lottie-player", { autoplay: true, loop: true, src: this.jsonSrc, speed: this.speed }));
13
- }
14
- };
15
- PtcLottie.style = ptcLottieCss;
16
-
17
- export { PtcLottie as ptc_lottie };
@@ -1,187 +0,0 @@
1
-
2
- :host {
3
- /**
4
- * @prop --lottie-player-toolbar-height: Toolbar height
5
- **/
6
- --lottie-player-toolbar-height: 35px;
7
- /**
8
- * @prop --lottie-player-toolbar-background-color: Toolbar background color
9
- **/
10
- --lottie-player-toolbar-background-color: transparent;
11
- /**
12
- * @prop --lottie-player-toolbar-icon-color: Toolbar icon color
13
- **/
14
- --lottie-player-toolbar-icon-color: #999;
15
- /**
16
- * @prop --lottie-player-toolbar-icon-hover-color: Toolbar icon hover color
17
- **/
18
- --lottie-player-toolbar-icon-hover-color: #222;
19
- /**
20
- * @prop --lottie-player-toolbar-icon-active-color: Toolbar icon active color
21
- **/
22
- --lottie-player-toolbar-icon-active-color: #555;
23
- /**
24
- * @prop --lottie-player-seeker-track-color: Seeker track color
25
- **/
26
- --lottie-player-seeker-track-color: #CCC;
27
- /**
28
- * @prop --lottie-player-seeker-thumb-color: Seeker thumb color
29
- **/
30
- --lottie-player-seeker-thumb-color: rgba(0, 107, 120, 0.8);
31
-
32
- display: block;
33
- width: 100%;
34
- height: 100%;
35
- }
36
-
37
- .main {
38
- box-sizing: border-box;
39
- display: inline-grid;
40
- grid-auto-columns: auto;
41
- grid-template-rows: auto;
42
- position: relative;
43
- height: inherit;
44
- width: inherit;
45
- }
46
-
47
- .main.controls {
48
- grid-template-rows: 1fr var(--lottie-player-toolbar-height);
49
- }
50
-
51
- .animation {
52
- overflow: hidden;
53
- height: calc(1fr - var(--lottie-player-toolbar-height));
54
- }
55
-
56
- .toolbar {
57
- display: grid;
58
- grid-template-columns: 32px 32px 1fr 32px 32px;
59
- align-items: center;
60
- justify-items: center;
61
- background-color: var(--lottie-player-toolbar-background-color);
62
- }
63
-
64
- .toolbar button {
65
- cursor: pointer;
66
- fill: var(--lottie-player-toolbar-icon-color);
67
- display: flex;
68
- background: none;
69
- border: 0;
70
- padding: 0;
71
- outline: none;
72
- height: 100%;
73
- }
74
-
75
- .toolbar button:hover {
76
- fill: var(--lottie-player-toolbar-icon-hover-color);
77
- }
78
-
79
- .toolbar button.active {
80
- fill: var(--lottie-player-toolbar-icon-active-color);
81
- }
82
-
83
- .toolbar button.disabled svg {
84
- display: none;
85
- }
86
-
87
- .toolbar a {
88
- filter: grayscale(100%);
89
- display: flex;
90
- transition: filter .5s, opacity 0.5s;
91
- opacity: 0.4;
92
- height: 100%;
93
- align-items: center;
94
- }
95
-
96
- .toolbar a:hover {
97
- filter: none;
98
- display: flex;
99
- opacity: 1;
100
- }
101
-
102
- .seeker {
103
- -webkit-appearance: none;
104
- width: 95%;
105
- outline: none;
106
- }
107
-
108
- .seeker::-webkit-slider-runnable-track {
109
- width: 100%;
110
- height: 5px;
111
- cursor: pointer;
112
- background: var(--lottie-player-seeker-track-color);
113
- border-radius: 3px;
114
- }
115
-
116
- .seeker::-webkit-slider-thumb {
117
- height: 15px;
118
- width: 15px;
119
- border-radius: 50%;
120
- background: var(--lottie-player-seeker-thumb-color);
121
- cursor: pointer;
122
- -webkit-appearance: none;
123
- margin-top: -5px;
124
- }
125
-
126
- .seeker:focus::-webkit-slider-runnable-track {
127
- background: #999;
128
- }
129
-
130
- .seeker::-moz-range-track {
131
- width: 100%;
132
- height: 5px;
133
- cursor: pointer;
134
- background: var(--lottie-player-seeker-track-color);
135
- border-radius: 3px;
136
- }
137
-
138
- .seeker::-moz-range-thumb {
139
- height: 15px;
140
- width: 15px;
141
- border-radius: 50%;
142
- background: var(--lottie-player-seeker-thumb-color);
143
- cursor: pointer;
144
- }
145
-
146
- .seeker::-ms-track {
147
- width: 100%;
148
- height: 5px;
149
- cursor: pointer;
150
- background: transparent;
151
- border-color: transparent;
152
- color: transparent;
153
- }
154
-
155
- .seeker::-ms-fill-lower {
156
- background: var(--lottie-player-seeker-track-color);
157
- border-radius: 3px;
158
- }
159
-
160
- .seeker::-ms-fill-upper {
161
- background: var(--lottie-player-seeker-track-color);
162
- border-radius: 3px;
163
- }
164
-
165
- .seeker::-ms-thumb {
166
- border: 0;
167
- height: 15px;
168
- width: 15px;
169
- border-radius: 50%;
170
- background: var(--lottie-player-seeker-thumb-color);
171
- cursor: pointer;
172
- }
173
-
174
- .seeker:focus::-ms-fill-lower {
175
- background: var(--lottie-player-seeker-track-color);
176
- }
177
-
178
- .seeker:focus::-ms-fill-upper {
179
- background: var(--lottie-player-seeker-track-color);
180
- }
181
-
182
- .error {
183
- display: flex;
184
- justify-content: center;
185
- height: 100%;
186
- align-items: center;
187
- }
@@ -1 +0,0 @@
1
- import{r as t,h as s}from"./p-ce0e4c5c.js";const o=class{constructor(s){t(this,s),this.jsonSrc=void 0,this.speed=1}render(){return s("lottie-player",{autoplay:!0,loop:!0,src:this.jsonSrc,speed:this.speed})}};o.style=":host{display:block;width:100%;height:auto}";export{o as ptc_lottie}