@quidgest/ui 0.16.19 → 0.16.20
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/manifest/components.json +1 -0
- package/dist/ui.css +49 -10
- package/dist/ui.esm.js +1497 -1465
- package/dist/ui.js +9 -9
- package/dist/ui.min.css +1 -1
- package/dist/ui.min.js +695 -692
- package/dist/ui.scss +53 -15
- package/esm/components/QAvatar/QAvatar.d.ts +23 -0
- package/esm/components/QAvatar/QAvatar.d.ts.map +1 -0
- package/esm/components/QAvatar/QAvatar.vue.js +49 -0
- package/esm/components/QAvatar/QAvatar.vue2.js +4 -0
- package/esm/components/QAvatar/index.d.ts +31 -0
- package/esm/components/QAvatar/index.d.ts.map +1 -0
- package/esm/components/QAvatar/index.js +6 -0
- package/esm/components/QAvatar/types.d.ts +30 -0
- package/esm/components/QAvatar/types.d.ts.map +1 -0
- package/esm/components/index.d.ts +1 -0
- package/esm/components/index.d.ts.map +1 -1
- package/esm/components/index.js +100 -98
- package/esm/index.d.ts +1 -0
- package/package.json +1 -1
package/dist/ui.css
CHANGED
|
@@ -405,6 +405,45 @@ a:focus {
|
|
|
405
405
|
height: fit-content;
|
|
406
406
|
}
|
|
407
407
|
|
|
408
|
+
.q-avatar {
|
|
409
|
+
--q-avatar-size: 48px;
|
|
410
|
+
display: flex;
|
|
411
|
+
align-items: center;
|
|
412
|
+
justify-content: center;
|
|
413
|
+
overflow: hidden;
|
|
414
|
+
box-sizing: border-box;
|
|
415
|
+
font-size: 1rem;
|
|
416
|
+
width: var(--q-avatar-size);
|
|
417
|
+
height: var(--q-avatar-size);
|
|
418
|
+
border-radius: 50%; /* Default shape: circle */
|
|
419
|
+
background-color: var(--q-avatar-color, var(--q-theme-neutral-light));
|
|
420
|
+
color: var(--q-avatar-text-color);
|
|
421
|
+
}
|
|
422
|
+
.q-avatar-img {
|
|
423
|
+
display: block;
|
|
424
|
+
width: 100%;
|
|
425
|
+
height: 100%;
|
|
426
|
+
-o-object-fit: cover;
|
|
427
|
+
object-fit: cover;
|
|
428
|
+
}
|
|
429
|
+
.q-avatar-initials {
|
|
430
|
+
font-size: 1em;
|
|
431
|
+
font-weight: bold;
|
|
432
|
+
text-align: center;
|
|
433
|
+
-webkit-user-select: none;
|
|
434
|
+
-moz-user-select: none;
|
|
435
|
+
user-select: none;
|
|
436
|
+
}
|
|
437
|
+
.q-avatar--small {
|
|
438
|
+
--q-avatar-size: 32px;
|
|
439
|
+
}
|
|
440
|
+
.q-avatar--large {
|
|
441
|
+
--q-avatar-size: 64px;
|
|
442
|
+
}
|
|
443
|
+
.q-avatar--square {
|
|
444
|
+
border-radius: 0;
|
|
445
|
+
}
|
|
446
|
+
|
|
408
447
|
.q-badge {
|
|
409
448
|
display: inline-flex;
|
|
410
449
|
border-width: 1px;
|
|
@@ -2977,27 +3016,27 @@ a:focus {
|
|
|
2977
3016
|
}
|
|
2978
3017
|
|
|
2979
3018
|
/* Breakpoint max-widths */
|
|
2980
|
-
@media (width
|
|
3019
|
+
@media (min-width: 576px) {
|
|
2981
3020
|
.q-container:not(.q-container--fluid) {
|
|
2982
3021
|
max-width: 540px;
|
|
2983
3022
|
}
|
|
2984
3023
|
}
|
|
2985
|
-
@media (width
|
|
3024
|
+
@media (min-width: 768px) {
|
|
2986
3025
|
.q-container:not(.q-container--fluid) {
|
|
2987
3026
|
max-width: 720px;
|
|
2988
3027
|
}
|
|
2989
3028
|
}
|
|
2990
|
-
@media (width
|
|
3029
|
+
@media (min-width: 992px) {
|
|
2991
3030
|
.q-container:not(.q-container--fluid) {
|
|
2992
3031
|
max-width: 960px;
|
|
2993
3032
|
}
|
|
2994
3033
|
}
|
|
2995
|
-
@media (width
|
|
3034
|
+
@media (min-width: 1200px) {
|
|
2996
3035
|
.q-container:not(.q-container--fluid) {
|
|
2997
3036
|
max-width: 1140px;
|
|
2998
3037
|
}
|
|
2999
3038
|
}
|
|
3000
|
-
@media (width
|
|
3039
|
+
@media (min-width: 1400px) {
|
|
3001
3040
|
.q-container:not(.q-container--fluid) {
|
|
3002
3041
|
max-width: 1320px;
|
|
3003
3042
|
}
|
|
@@ -3134,7 +3173,7 @@ a:focus {
|
|
|
3134
3173
|
max-width: 100%;
|
|
3135
3174
|
}
|
|
3136
3175
|
|
|
3137
|
-
@media (width
|
|
3176
|
+
@media (min-width: 576px) {
|
|
3138
3177
|
.q-col-sm-1 {
|
|
3139
3178
|
flex: 0 0 8.3333333333%;
|
|
3140
3179
|
max-width: 8.3333333333%;
|
|
@@ -3184,7 +3223,7 @@ a:focus {
|
|
|
3184
3223
|
max-width: 100%;
|
|
3185
3224
|
}
|
|
3186
3225
|
}
|
|
3187
|
-
@media (width
|
|
3226
|
+
@media (min-width: 768px) {
|
|
3188
3227
|
.q-col-md-1 {
|
|
3189
3228
|
flex: 0 0 8.3333333333%;
|
|
3190
3229
|
max-width: 8.3333333333%;
|
|
@@ -3234,7 +3273,7 @@ a:focus {
|
|
|
3234
3273
|
max-width: 100%;
|
|
3235
3274
|
}
|
|
3236
3275
|
}
|
|
3237
|
-
@media (width
|
|
3276
|
+
@media (min-width: 992px) {
|
|
3238
3277
|
.q-col-lg-1 {
|
|
3239
3278
|
flex: 0 0 8.3333333333%;
|
|
3240
3279
|
max-width: 8.3333333333%;
|
|
@@ -3284,7 +3323,7 @@ a:focus {
|
|
|
3284
3323
|
max-width: 100%;
|
|
3285
3324
|
}
|
|
3286
3325
|
}
|
|
3287
|
-
@media (width
|
|
3326
|
+
@media (min-width: 1200px) {
|
|
3288
3327
|
.q-col-xl-1 {
|
|
3289
3328
|
flex: 0 0 8.3333333333%;
|
|
3290
3329
|
max-width: 8.3333333333%;
|
|
@@ -3334,7 +3373,7 @@ a:focus {
|
|
|
3334
3373
|
max-width: 100%;
|
|
3335
3374
|
}
|
|
3336
3375
|
}
|
|
3337
|
-
@media (width
|
|
3376
|
+
@media (min-width: 1400px) {
|
|
3338
3377
|
.q-col-xxl-1 {
|
|
3339
3378
|
flex: 0 0 8.3333333333%;
|
|
3340
3379
|
max-width: 8.3333333333%;
|