pxt-core 7.3.7 → 7.3.11

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,303 @@
1
+ .user-profile {
2
+ display: flex;
3
+ flex-direction: row;
4
+ height: 100%;
5
+
6
+ --header-text-color: #000000;
7
+ --profile-portrait-border-color: #ffffff;
8
+ --profile-username-color: #999999;
9
+ --background-color: #fef3e0;
10
+ --avatar-initials-background-color: #028B9B;
11
+ --avatar-initials-text-color: #ffffff;
12
+ --user-pane-border-color: #e4dbca;
13
+ --notification-background-color: #ffffff;
14
+ --notification-icon-background-color: #ffffff;
15
+ --notification-icon-color: #000000;
16
+ --badge-list-subtitle-color: #aba9a5;
17
+ }
18
+
19
+ .profile-user-pane {
20
+ display: flex;
21
+ flex-direction: column;
22
+ width: 25%;
23
+ padding: 1rem;
24
+ border-right: solid 1px var(--user-pane-border-color);
25
+ height: 100%;
26
+ min-width: 20rem;
27
+ }
28
+
29
+ .profile-portrait {
30
+ border-radius: 50%;
31
+ overflow: hidden;
32
+ height: 12rem;
33
+ width: 12rem;
34
+ position: relative;
35
+ border: solid var(--profile-portrait-border-color) 2px;
36
+ align-self: center;
37
+ margin-bottom: 1.5rem;
38
+ }
39
+
40
+ .profile-portrait img {
41
+ width: 110%;
42
+ height: 110%;
43
+ position: absolute;
44
+ left: -5%;
45
+ top: -5%;
46
+ }
47
+
48
+ .profile-user-details {
49
+ text-align: center;
50
+ margin-bottom: 3rem;
51
+ }
52
+
53
+ .profile-display-name {
54
+ font-size: 1.5rem;
55
+ color: var(--header-text-color);
56
+ text-transform: uppercase;
57
+ font-weight: 900;
58
+ margin-bottom: 0.5rem;
59
+ }
60
+
61
+ .profile-username {
62
+ font-size: 1rem;
63
+ color: var(--profile-username-color);
64
+ }
65
+
66
+ .profile-spacer {
67
+ flex-grow: 1;
68
+ }
69
+
70
+ .profile-actions {
71
+ display: flex;
72
+ flex-direction: row;
73
+ align-items: center;
74
+ justify-content: space-between;
75
+ }
76
+
77
+ .profile-actions a {
78
+ flex-grow: 1;
79
+ font-size: 14px;
80
+ }
81
+
82
+ .profile-actions .ui.button {
83
+ width: 50%;
84
+ }
85
+
86
+ .profile-actions .ui.button i.icon {
87
+ margin-right: 1.5rem !important;
88
+ }
89
+
90
+ .profile-notification {
91
+ width: 100%;
92
+ border: solid 1px black;
93
+ position: relative;
94
+ border-radius: 1rem;
95
+ padding: 1rem;
96
+ padding-top: 2rem;
97
+ background: var(--notification-background-color);
98
+ display: flex;
99
+ flex-direction: column;
100
+ }
101
+
102
+ .profile-notification .profile-notification-title {
103
+ font-weight: 900;
104
+ text-align: center;
105
+ margin-bottom: 1rem;
106
+ }
107
+
108
+ .profile-notification .profile-notification-message {
109
+ margin-bottom: 1rem;
110
+ }
111
+
112
+
113
+ .profile-notification .profile-notification-icon {
114
+ width: 3.25rem;
115
+ height: 3.25rem;
116
+ border: solid 1px black;
117
+ border-radius: 50%;
118
+ position: absolute;
119
+ top: -1.625rem;
120
+ left: calc(50% - 1.625rem);
121
+ color: var(--notification-icon-color);
122
+ background: var(--notification-icon-background-color);
123
+ }
124
+
125
+ .profile-notification .profile-notification-icon i.circular.icon {
126
+ box-shadow: none;
127
+ }
128
+
129
+ .profile-badge-subtitle {
130
+ font-style: italic;
131
+ color: var(--badge-list-subtitle-color);
132
+ }
133
+
134
+ .profile-badge-list {
135
+ flex-grow: 1;
136
+ height: 100%;
137
+ display: flex;
138
+ flex-direction: column;
139
+ padding: 1rem;
140
+ }
141
+
142
+ .profile-badges-scroller {
143
+ flex-grow: 1;
144
+ overflow-y: auto;
145
+ overflow-x: hidden;
146
+ position: relative;
147
+ z-index: 1;
148
+ }
149
+
150
+ .profile-badges, .profile-badges-background {
151
+ background-repeat: repeat;
152
+ min-height: 100%;
153
+ background-size: 20%;
154
+ display: grid;
155
+ grid-template-columns: repeat(5, 1fr);
156
+ grid-auto-rows: 12rem;
157
+ align-items: center;
158
+ }
159
+
160
+ .profile-badges-background {
161
+ z-index: -1;
162
+ }
163
+
164
+ .profile-badges .profile-badge, .profile-badges-background .profile-badge {
165
+ position: relative;
166
+ aspect-ratio: 1;
167
+ background-color: var(--background-color);
168
+ }
169
+
170
+
171
+ .profile-badges .profile-badge img, .profile-badges-background .profile-badge img {
172
+ height: 100%;
173
+ width: 100%;
174
+ display: inline;
175
+ position: absolute;
176
+ object-fit: contain;
177
+ }
178
+
179
+
180
+ .profile-badge.disabled img {
181
+ filter: grayscale(1);
182
+ opacity: 0.5;
183
+ }
184
+
185
+ .profile-badge.disabled i.ui.icon {
186
+ line-height: 1;
187
+ vertical-align: middle;
188
+ font-size: 4em;
189
+ width: 100%;
190
+ z-index: 1;
191
+ position: absolute;
192
+ }
193
+
194
+ .placeholder-badge {
195
+ background-image: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Ccircle cx='5' cy='5' fill='black' r='3' opacity='0.1' /%3E%3C/svg%3E");
196
+ background-repeat: no-repeat;
197
+ background-position: center;
198
+ opacity: 0.3;
199
+ aspect-ratio: 1;
200
+ }
201
+
202
+ .profile-badges-background-container {
203
+ position: absolute;
204
+ top: 0;
205
+ left: 0;
206
+ height: 100%;
207
+ width: 100%;
208
+ overflow: hidden;
209
+ }
210
+
211
+ .profile-badge-title {
212
+ text-transform: uppercase;
213
+ font-weight: 900;
214
+ font-size: 1.5rem;
215
+ margin-right: 1rem;
216
+ color: var(--header-text-color);
217
+ }
218
+
219
+ .profile-badge-header {
220
+ margin-left: 1rem;
221
+ margin-bottom: 1rem;
222
+ }
223
+
224
+ .profile-badge-info-item {
225
+ margin-top: 1rem;
226
+ display: flex;
227
+ }
228
+
229
+ .profile-badge-info-header {
230
+ text-transform: uppercase;
231
+ font-weight: 900;
232
+ width: 20%;
233
+ color: var(--header-text-color);
234
+ }
235
+
236
+ .profile-badge-info-image .profile-badge {
237
+ text-align: center;
238
+ }
239
+
240
+ .profile-badge-info-image .profile-badge img {
241
+ display: inline;
242
+ height: 15rem;
243
+ object-fit: contain;
244
+ }
245
+
246
+ .profile-badge {
247
+ display: flex;
248
+ flex-direction: column;
249
+ justify-content: center;
250
+ align-content: center;
251
+ position: relative;
252
+ }
253
+
254
+ .profile-badge-and-title {
255
+ display: flex;
256
+ flex-direction: column;
257
+ max-height: 100%;
258
+ background-color: var(--background-color);
259
+ z-index: 2;
260
+ overflow: hidden;
261
+ }
262
+
263
+ .profile-badge-and-title .profile-badge {
264
+ margin-bottom: 1rem;
265
+ flex-shrink: 1000;
266
+ }
267
+
268
+ .profile-badge-name {
269
+ font-size: 1rem;
270
+ text-overflow: ellipsis;
271
+ white-space: nowrap;
272
+ width: 100%;
273
+ margin-right: 0;
274
+ text-align: center;
275
+ color: var(--header-text-color);
276
+ }
277
+
278
+ .profile-initials-portrait {
279
+ font-size: 8rem;
280
+ text-align: center;
281
+ display: flex;
282
+ align-items: center;
283
+ justify-content: center;
284
+ height: 100%;
285
+ color: var(--avatar-initials-text-color);
286
+ background-color: var(--avatar-initials-background-color);
287
+ }
288
+
289
+ @media only screen and (max-width: 1200px) and (min-width: 992px) {
290
+ .profile-badges, .profile-badges-background {
291
+ background-size: 25%;
292
+ grid-template-columns: repeat(4, 1fr);
293
+ grid-auto-rows: 12rem;
294
+ }
295
+ }
296
+
297
+ @media only screen and (max-width: 991px) {
298
+ .profile-badges, .profile-badges-background {
299
+ background-size: 33%;
300
+ grid-template-columns: repeat(3, 1fr);
301
+ grid-auto-rows: 12rem;
302
+ }
303
+ }