@rtsee/ngx 0.0.111 → 0.0.112

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.
@@ -0,0 +1,263 @@
1
+ @import "../common-variables";
2
+
3
+ .rtsee-event-widget {
4
+ background: linear-gradient(
5
+ 135deg,
6
+ rgba(28, 28, 42, 0.9) 0%,
7
+ rgba(18, 18, 30, 0.95) 100%
8
+ );
9
+ border: 1px solid rgba(255, 255, 255, 0.08);
10
+ border-radius: $rts-default-border-radius;
11
+ padding: 10px 12px;
12
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
13
+ transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
14
+ color: $rts-rates-text-primary;
15
+ display: flex;
16
+ flex-direction: column;
17
+ gap: 8px;
18
+
19
+ &:hover {
20
+ border-color: rgba(162, 155, 254, 0.3);
21
+ box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
22
+ transform: translateY(-1px);
23
+ }
24
+
25
+ .widget-header {
26
+ display: flex;
27
+ align-items: center;
28
+ justify-content: space-between;
29
+ gap: 8px;
30
+
31
+ .widget-badge {
32
+ display: inline-flex;
33
+ align-items: center;
34
+ gap: 5px;
35
+ padding: 3px 8px;
36
+ border-radius: 12px;
37
+ font-size: 11px;
38
+ font-weight: 600;
39
+ letter-spacing: 0.3px;
40
+ text-transform: uppercase;
41
+
42
+ .widget-badge-icon {
43
+ font-size: 14px;
44
+ line-height: 1;
45
+ }
46
+
47
+ &.opened-badge {
48
+ background: rgba(108, 92, 231, 0.2);
49
+ color: #a29bfe;
50
+ border: 1px solid rgba(108, 92, 231, 0.35);
51
+ }
52
+
53
+ &.reading-badge {
54
+ background: rgba(59, 130, 247, 0.2);
55
+ color: #60a5fa;
56
+ border: 1px solid rgba(59, 130, 247, 0.35);
57
+ }
58
+
59
+ &.slide-badge {
60
+ background: rgba(46, 204, 113, 0.2);
61
+ color: #2ecc71;
62
+ border: 1px solid rgba(46, 204, 113, 0.35);
63
+ }
64
+ }
65
+
66
+ .widget-timer {
67
+ display: inline-flex;
68
+ align-items: center;
69
+ gap: 4px;
70
+ padding: 2px 7px;
71
+ border-radius: 10px;
72
+ font-size: 11px;
73
+ font-weight: 600;
74
+ font-family: monospace, monospace;
75
+ background: rgba(255, 255, 255, 0.05);
76
+ color: $rts-rates-text-muted;
77
+ border: 1px solid rgba(255, 255, 255, 0.06);
78
+
79
+ .widget-timer-icon {
80
+ font-size: 13px;
81
+ line-height: 1;
82
+ }
83
+
84
+ &.live {
85
+ background: rgba(46, 204, 113, 0.15);
86
+ color: #2ecc71;
87
+ border-color: rgba(46, 204, 113, 0.4);
88
+ box-shadow: 0 0 8px rgba(46, 204, 113, 0.25);
89
+ animation: pulseLive 2s infinite ease-in-out;
90
+ }
91
+ }
92
+ }
93
+
94
+ .widget-body {
95
+ display: flex;
96
+ align-items: center;
97
+ gap: 10px;
98
+
99
+ .widget-media {
100
+ flex-shrink: 0;
101
+ width: 44px;
102
+ height: 44px;
103
+ border-radius: 6px;
104
+ overflow: hidden;
105
+ background: rgba(0, 0, 0, 0.3);
106
+ border: 1px solid rgba(255, 255, 255, 0.1);
107
+ display: flex;
108
+ align-items: center;
109
+ justify-content: center;
110
+
111
+ .widget-thumbnail-image {
112
+ width: 100%;
113
+ height: 100%;
114
+ object-fit: cover;
115
+ }
116
+
117
+ .widget-thumbnail-placeholder {
118
+ width: 100%;
119
+ height: 100%;
120
+ display: flex;
121
+ align-items: center;
122
+ justify-content: center;
123
+ background: linear-gradient(
124
+ 135deg,
125
+ rgba(108, 92, 231, 0.3) 0%,
126
+ rgba(59, 130, 247, 0.2) 100%
127
+ );
128
+ color: #a29bfe;
129
+
130
+ &.reading-placeholder {
131
+ background: linear-gradient(
132
+ 135deg,
133
+ rgba(59, 130, 247, 0.3) 0%,
134
+ rgba(46, 204, 113, 0.2) 100%
135
+ );
136
+ color: #60a5fa;
137
+ }
138
+
139
+ &.slide-placeholder {
140
+ background: linear-gradient(
141
+ 135deg,
142
+ rgba(46, 204, 113, 0.3) 0%,
143
+ rgba(108, 92, 231, 0.2) 100%
144
+ );
145
+ color: #2ecc71;
146
+ }
147
+
148
+ .material-icons-outlined {
149
+ font-size: 22px;
150
+ }
151
+ }
152
+ }
153
+
154
+ .widget-info {
155
+ flex: 1;
156
+ min-width: 0;
157
+ display: flex;
158
+ flex-direction: column;
159
+ gap: 2px;
160
+
161
+ .widget-title-link {
162
+ display: inline-flex;
163
+ align-items: center;
164
+ gap: 4px;
165
+ color: $rts-rates-text-primary;
166
+ text-decoration: none;
167
+ font-weight: 600;
168
+ font-size: 13px;
169
+ line-height: 1.3;
170
+ transition: color 0.15s ease;
171
+
172
+ &:hover {
173
+ color: #a29bfe;
174
+
175
+ .external-icon {
176
+ transform: translateX(1px) translateY(-1px);
177
+ }
178
+ }
179
+
180
+ .widget-title {
181
+ white-space: nowrap;
182
+ overflow: hidden;
183
+ text-overflow: ellipsis;
184
+ }
185
+
186
+ .external-icon {
187
+ font-size: 13px;
188
+ color: #a29bfe;
189
+ flex-shrink: 0;
190
+ transition: transform 0.15s ease;
191
+ }
192
+ }
193
+
194
+ .widget-title {
195
+ font-weight: 600;
196
+ font-size: 13px;
197
+ line-height: 1.3;
198
+ color: $rts-rates-text-primary;
199
+ white-space: nowrap;
200
+ overflow: hidden;
201
+ text-overflow: ellipsis;
202
+ }
203
+
204
+ .widget-subtitle {
205
+ font-size: 11px;
206
+ color: $rts-rates-text-muted;
207
+ }
208
+
209
+ .widget-description {
210
+ margin: 0;
211
+ font-size: 11px;
212
+ color: $rts-rates-text-secondary;
213
+ white-space: nowrap;
214
+ overflow: hidden;
215
+ text-overflow: ellipsis;
216
+ line-height: 1.2;
217
+ }
218
+
219
+ .widget-story-link {
220
+ display: inline-flex;
221
+ align-items: center;
222
+ gap: 3px;
223
+ color: $rts-rates-text-secondary;
224
+ text-decoration: none;
225
+ font-size: 11px;
226
+
227
+ &:hover {
228
+ color: #a29bfe;
229
+ }
230
+
231
+ .widget-story-name {
232
+ white-space: nowrap;
233
+ overflow: hidden;
234
+ text-overflow: ellipsis;
235
+ }
236
+
237
+ .external-icon {
238
+ font-size: 11px;
239
+ }
240
+ }
241
+
242
+ .widget-story-name {
243
+ font-size: 11px;
244
+ color: $rts-rates-text-secondary;
245
+ white-space: nowrap;
246
+ overflow: hidden;
247
+ text-overflow: ellipsis;
248
+ }
249
+ }
250
+ }
251
+ }
252
+
253
+ @keyframes pulseLive {
254
+ 0% {
255
+ box-shadow: 0 0 0 0 rgba(46, 204, 113, 0.4);
256
+ }
257
+ 70% {
258
+ box-shadow: 0 0 0 6px rgba(46, 204, 113, 0);
259
+ }
260
+ 100% {
261
+ box-shadow: 0 0 0 0 rgba(46, 204, 113, 0);
262
+ }
263
+ }
@@ -2,38 +2,95 @@
2
2
 
3
3
  .rtsee-events-dashboard-session {
4
4
  position: relative;
5
- border-radius: $rts-default-border-radius;
6
- padding: $rts-offset-sm;
7
- background-color: $rts-state-bg-color;
5
+ border-radius: 12px;
6
+ padding: 12px 14px;
7
+ background: rgba(18, 18, 28, 0.95);
8
+ border: 1px solid rgba(255, 255, 255, 0.07);
9
+ box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
10
+ display: flex;
11
+ flex-direction: column;
12
+ gap: 10px;
8
13
 
9
14
  .rtsee-events-dashboard-session-header {
10
- height: $rts-user-avatar-d-sm;
11
- padding-right: $rts-user-avatar-d-sm + $rts-offset-sm;
15
+ display: flex;
16
+ align-items: center;
17
+ justify-content: space-between;
18
+ gap: 8px;
19
+ padding-bottom: 8px;
20
+ border-bottom: 1px solid rgba(255, 255, 255, 0.05);
12
21
 
13
- .rtsee-events-dashboard-session-client-info {
14
- font-size: 16px;
15
- margin: 0;
16
- color: $rts-font-color-dark;
17
- }
22
+ .rtsee-events-dashboard-session-header-client {
23
+ flex: 1;
24
+ min-width: 0;
25
+
26
+ .rtsee-events-dashboard-session-client-info {
27
+ font-size: 13px;
28
+ font-weight: 600;
29
+ margin: 0;
30
+ color: $rts-rates-text-primary;
31
+ white-space: nowrap;
32
+ overflow: hidden;
33
+ text-overflow: ellipsis;
34
+ }
18
35
 
19
- .rtsee-events-dashboard-session-os-info {
20
- font-size: 14px;
21
- margin: 0;
22
- color: $rts-font-color-light;
36
+ .rtsee-events-dashboard-session-os-info {
37
+ font-size: 11px;
38
+ margin: 2px 0 0 0;
39
+ color: $rts-rates-text-muted;
40
+ white-space: nowrap;
41
+ overflow: hidden;
42
+ text-overflow: ellipsis;
43
+ }
23
44
  }
24
45
 
25
46
  .rtsee-events-dashboard-session-device-info {
26
- position: absolute;
27
- right: 0;
28
- top: 0;
29
- width: $rts-user-avatar-d-sm;
30
- height: $rts-user-avatar-d-sm;
31
- line-height: $rts-user-avatar-d-sm;
32
- text-align: center;
47
+ width: 30px;
48
+ height: 30px;
49
+ display: flex;
50
+ align-items: center;
51
+ justify-content: center;
52
+ border-radius: 8px;
53
+ background: rgba(255, 255, 255, 0.04);
54
+ color: $rts-rates-text-secondary;
55
+ flex-shrink: 0;
33
56
 
34
57
  .rtsee-events-dashboard-session-device-info-icon {
35
- font-size: 24px;
36
- vertical-align: middle;
58
+ font-size: 18px;
59
+ }
60
+ }
61
+
62
+ .rtsee-events-dashboard-session-duration {
63
+ display: inline-flex;
64
+ align-items: center;
65
+ gap: 5px;
66
+ padding: 3px 8px;
67
+ border-radius: 12px;
68
+ font-size: 11px;
69
+ font-weight: 600;
70
+ font-family: monospace, monospace;
71
+ background: rgba(255, 255, 255, 0.05);
72
+ color: $rts-rates-text-secondary;
73
+ border: 1px solid rgba(255, 255, 255, 0.08);
74
+ flex-shrink: 0;
75
+
76
+ .rtsee-events-dashboard-session-duration-icon {
77
+ font-size: 14px;
78
+ line-height: 1;
79
+ }
80
+
81
+ .rtsee-events-dashboard-session-duration-text {
82
+ letter-spacing: 0.5px;
83
+ }
84
+
85
+ &.is-active {
86
+ background: rgba(46, 204, 113, 0.15);
87
+ color: #2ecc71;
88
+ border-color: rgba(46, 204, 113, 0.4);
89
+ box-shadow: 0 0 10px rgba(46, 204, 113, 0.25);
90
+
91
+ .rtsee-events-dashboard-session-duration-icon {
92
+ animation: spinPulse 2s infinite linear;
93
+ }
37
94
  }
38
95
  }
39
96
  }
@@ -42,13 +99,50 @@
42
99
  list-style-type: none;
43
100
  padding-left: 0;
44
101
  margin: 0;
102
+ display: flex;
103
+ flex-direction: column;
104
+ gap: 8px;
45
105
 
46
106
  .rtsee-events-dashboard-session-event {
47
- margin-bottom: $rts-offset-sm;
107
+ margin-bottom: 0;
108
+ }
109
+ }
48
110
 
49
- &:last-of-type {
50
- margin-bottom: 0;
111
+ .rtsee-events-dashboard-session-footer {
112
+ display: flex;
113
+ justify-content: center;
114
+ padding-top: 4px;
115
+
116
+ .rtsee-events-dashboard-session-more-btn {
117
+ width: 100%;
118
+ padding: 6px 12px;
119
+ background: rgba(255, 255, 255, 0.04);
120
+ border: 1px solid rgba(255, 255, 255, 0.08);
121
+ border-radius: 8px;
122
+ color: $rts-rates-text-secondary;
123
+ font-size: 12px;
124
+ font-weight: 500;
125
+ cursor: pointer;
126
+ transition: all 0.2s ease;
127
+
128
+ &:hover {
129
+ background: rgba(108, 92, 231, 0.2);
130
+ border-color: rgba(162, 155, 254, 0.4);
131
+ color: #ffffff;
132
+ }
133
+
134
+ &:active {
135
+ transform: scale(0.99);
51
136
  }
52
137
  }
53
138
  }
54
139
  }
140
+
141
+ @keyframes spinPulse {
142
+ 0% {
143
+ transform: rotate(0deg);
144
+ }
145
+ 100% {
146
+ transform: rotate(360deg);
147
+ }
148
+ }
@@ -1,17 +1,86 @@
1
1
  @import "../common-variables";
2
+ @import "./variables";
2
3
 
3
4
  .rtsee-events-dashboard {
4
- background-color: $rts-main-bg-color-light;
5
- padding: $rts-offset-sm;
6
- border-radius: $rts-default-border-radius;
5
+ min-height: 100%;
6
+ color: $rts-rates-text-primary;
7
+ background-color: #000;
7
8
 
8
9
  .rtsee-events-dashboard-client-thumbnails {
10
+ display: flex;
11
+ flex-direction: column;
12
+ gap: $rts-offset-md;
13
+
9
14
  .rtsee-events-dashboard-client-thumbnail-wrapper {
10
- margin-bottom: $rts-offset-md;
15
+ margin-bottom: 0;
16
+ }
17
+ }
18
+
19
+ .rtsee-events-dashboard-load-more {
20
+ display: flex;
21
+ justify-content: center;
22
+ margin-top: $rts-offset-lg;
23
+ padding-bottom: $rts-offset-md;
24
+
25
+ .rtsee-events-dashboard-load-more-btn {
26
+ display: inline-flex;
27
+ align-items: center;
28
+ gap: 8px;
29
+ padding: 10px 24px;
30
+ background: linear-gradient(
31
+ 135deg,
32
+ rgba(108, 92, 231, 0.25) 0%,
33
+ rgba(59, 130, 247, 0.25) 100%
34
+ );
35
+ border: 1px solid rgba(162, 155, 254, 0.35);
36
+ border-radius: 24px;
37
+ color: #ffffff;
38
+ font-size: 14px;
39
+ font-weight: 600;
40
+ letter-spacing: 0.2px;
41
+ cursor: pointer;
42
+ backdrop-filter: blur(10px);
43
+ transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
44
+ box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
45
+
46
+ &:hover:not(:disabled) {
47
+ background: linear-gradient(
48
+ 135deg,
49
+ rgba(108, 92, 231, 0.45) 0%,
50
+ rgba(59, 130, 247, 0.45) 100%
51
+ );
52
+ border-color: rgba(162, 155, 254, 0.6);
53
+ box-shadow: 0 6px 20px rgba(108, 92, 231, 0.35);
54
+ transform: translateY(-1px);
55
+ }
56
+
57
+ &:active:not(:disabled) {
58
+ transform: translateY(0);
59
+ }
11
60
 
12
- &:last-of-type {
13
- margin-bottom: 0;
61
+ &:disabled {
62
+ opacity: 0.6;
63
+ cursor: not-allowed;
64
+ }
65
+
66
+ .spin-icon {
67
+ animation: spin 1s linear infinite;
68
+ font-size: 18px;
14
69
  }
15
70
  }
16
71
  }
72
+
73
+ @media screen and (min-width: $rtsu-break-md) {
74
+ padding: $rts-offset-md;
75
+ //border-radius: $rts-rounded-border-radius;
76
+ }
77
+ }
78
+
79
+ @keyframes spin {
80
+ from {
81
+ transform: rotate(0deg);
82
+ }
83
+ to {
84
+ transform: rotate(360deg);
85
+ }
17
86
  }
@@ -3,4 +3,4 @@
3
3
  @import "./client-thumbnail";
4
4
  @import "./events-dashboard-session";
5
5
  @import "./event-thumbnail";
6
-
6
+ @import "./event-widgets";
@@ -0,0 +1,10 @@
1
+ // ═══════════════════════════════════════════════════════════════════
2
+ // EVENTS MANAGER — Local Variables
3
+ // Imports the rts-common system and defines messenger-specific tokens
4
+ // ═══════════════════════════════════════════════════════════════════
5
+
6
+ @import "../rts-common/variables-colors";
7
+ @import "../rts-common/variables-spacing";
8
+ @import "../rts-common/variables-typography";
9
+ @import "../rts-common/variables-layout";
10
+ @import "../rts-common/variables-effects";
package/package.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "0.0.111",
2
+ "version": "0.0.112",
3
3
  "name": "@rtsee/ngx",
4
4
  "module": "./dist/ngx/fesm2022/rtsee-ngx.mjs",
5
5
  "types": "./dist/ngx/index.d.ts",
@@ -40,15 +40,15 @@
40
40
  "@angular/platform-browser-dynamic": "^20.1.2",
41
41
  "@angular/router": "^20.1.2",
42
42
  "@primeuix/themes": "^1.2.3",
43
- "@rtsee/common": "^0.0.82",
44
- "@rtsee/conference": "^0.0.83",
45
- "@rtsee/core": "^0.0.126",
46
- "@rtsee/events-dashboard": "^0.0.116",
47
- "@rtsee/factory": "^0.0.125",
48
- "@rtsee/messenger": "^0.0.116",
49
- "@rtsee/presentation": "^0.0.115",
50
- "@rtsee/signaling-client": "^0.0.129",
51
- "@rtsee/utilities-ui": "^0.0.47",
43
+ "@rtsee/common": "^0.0.83",
44
+ "@rtsee/conference": "^0.0.84",
45
+ "@rtsee/core": "^0.0.127",
46
+ "@rtsee/events-dashboard": "^0.0.117",
47
+ "@rtsee/factory": "^0.0.126",
48
+ "@rtsee/messenger": "^0.0.117",
49
+ "@rtsee/presentation": "^0.0.116",
50
+ "@rtsee/signaling-client": "^0.0.130",
51
+ "@rtsee/utilities-ui": "^0.0.48",
52
52
  "@stripe/stripe-js": "^8.6.1",
53
53
  "@types/gtag.js": "^0.0.20",
54
54
  "@types/node": "~24.0.14",
@@ -71,5 +71,5 @@
71
71
  "publishConfig": {
72
72
  "access": "public"
73
73
  },
74
- "gitHead": "228020e0affb192a6bdabc0c34422eb0aa67bb23"
74
+ "gitHead": "ad8f6ddbd40db595856c7c039e49cfef87743ef4"
75
75
  }