@everymatrix/general-player-login-form 1.36.1 → 1.37.0
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/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@everymatrix/general-player-login-form",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.37.0",
|
|
4
4
|
"main": "dist/general-player-login-form.js",
|
|
5
5
|
"svelte": "src/index.ts",
|
|
6
6
|
"scripts": {
|
|
@@ -35,5 +35,5 @@
|
|
|
35
35
|
"publishConfig": {
|
|
36
36
|
"access": "public"
|
|
37
37
|
},
|
|
38
|
-
"gitHead": "
|
|
38
|
+
"gitHead": "23b14632ab842e43bf71843de47000e6dd141751"
|
|
39
39
|
}
|
|
@@ -394,9 +394,9 @@
|
|
|
394
394
|
<label for="current-password">{$_('loginPassword')}:<span class="FormRequired">*</span></label>
|
|
395
395
|
<input bind:value={userPassword} on:input={validatePassword} type="password" name="current-password" id="current-password" bind:this={passwordVisibilityToggle} autocomplete={savecredentials ? "current-password" : "off"} aria-describedby="password-constraints" required/>
|
|
396
396
|
{#if isPasswordVisible}
|
|
397
|
-
<svg on:click={() => hidePassword()} class="TogglePasswordVisibility" xmlns="http://www.w3.org/2000/svg" width="18.844" height="12.887" viewBox="0 0 18.844 12.887"><defs><style>.a{fill:var(--
|
|
397
|
+
<svg on:click={() => hidePassword()} class="TogglePasswordVisibility" xmlns="http://www.w3.org/2000/svg" width="18.844" height="12.887" viewBox="0 0 18.844 12.887"><defs><style>.a{fill:var(--emw--registration-typography, var(--emw--color-background, #07072A));}</style></defs><g transform="translate(-110.856 -23.242)"><circle class="a" cx="0.05" cy="0.05" r="0.05" transform="translate(121.017 31.148)"/><g transform="translate(117.499 27.37)"><path class="a" d="M147.413,43.174a2.774,2.774,0,0,0-3.229-3.943Z" transform="translate(-142.164 -39.123)"/><path class="a" d="M137.031,43.1a2.778,2.778,0,0,0,3.447,4.209Z" transform="translate(-136.413 -42.068)"/></g><g transform="translate(110.856 24.899)"><path class="a" d="M122.538,42.061a7.043,7.043,0,0,1-2.325.53,10.373,10.373,0,0,1-4.393-1.482,36.509,36.509,0,0,1-3.873-2.391.13.13,0,0,1,0-.208,44.141,44.141,0,0,1,3.873-2.651c.394-.233.768-.437,1.13-.622l-.686-.838c-.322.167-.651.347-.99.55a37.989,37.989,0,0,0-3.977,2.729,1.21,1.21,0,0,0-.442.962,1.1,1.1,0,0,0,.494.936,34.416,34.416,0,0,0,3.977,2.469,11.468,11.468,0,0,0,4.886,1.611,8.427,8.427,0,0,0,3.039-.725Z" transform="translate(-110.856 -33.157)"/><path class="a" d="M149.119,34.14a45.875,45.875,0,0,0-4.055-2.729,20.541,20.541,0,0,0-2.547-1.248,5.6,5.6,0,0,0-4.79-.017l.7.856a5.254,5.254,0,0,1,1.672-.346,10.072,10.072,0,0,1,4.445,1.663,34.132,34.132,0,0,1,3.925,2.651.13.13,0,0,1,0,.208,40.2,40.2,0,0,1-3.925,2.391c-.179.092-.352.176-.525.26l.684.835c.1-.054.2-.1.309-.159a36.356,36.356,0,0,0,4.055-2.469,1.067,1.067,0,0,0,.52-.936A1.159,1.159,0,0,0,149.119,34.14Z" transform="translate(-130.743 -29.617)"/></g><rect class="a" width="0.972" height="15.861" rx="0.486" transform="translate(114.827 23.858) rotate(-39.315)"/></g></svg>
|
|
398
398
|
{:else}
|
|
399
|
-
<svg on:click={() => showPassword()} class="TogglePasswordVisibility" xmlns="http://www.w3.org/2000/svg" width="18.843" height="10.5" viewBox="0 0 18.843 10.5"><defs><style>.a{fill:var(--
|
|
399
|
+
<svg on:click={() => showPassword()} class="TogglePasswordVisibility" xmlns="http://www.w3.org/2000/svg" width="18.843" height="10.5" viewBox="0 0 18.843 10.5"><defs><style>.a{fill:var(--emw--registration-typography, var(--emw--color-background, #07072A));}</style></defs><g transform="translate(-14.185 -27.832)"><path class="a" d="M23.541,38.332a11.467,11.467,0,0,1-4.886-1.611,34.413,34.413,0,0,1-3.976-2.469,1.1,1.1,0,0,1-.494-.936,1.21,1.21,0,0,1,.442-.962A37.986,37.986,0,0,1,18.6,29.625a16.06,16.06,0,0,1,2.521-1.248,6.862,6.862,0,0,1,2.417-.546,6.862,6.862,0,0,1,2.417.546,20.541,20.541,0,0,1,2.547,1.248,45.872,45.872,0,0,1,4.054,2.729,1.159,1.159,0,0,1,.468.962,1.067,1.067,0,0,1-.52.936,36.353,36.353,0,0,1-4.054,2.469A11.2,11.2,0,0,1,23.541,38.332Zm0-9.46a9.813,9.813,0,0,0-4.392,1.663,44.138,44.138,0,0,0-3.873,2.651.13.13,0,0,0,0,.208,36.5,36.5,0,0,0,3.873,2.391,10.372,10.372,0,0,0,4.392,1.481,11.051,11.051,0,0,0,4.444-1.481,40.2,40.2,0,0,0,3.925-2.391.13.13,0,0,0,0-.208h0a34.132,34.132,0,0,0-3.925-2.651A10.072,10.072,0,0,0,23.541,28.872Z" transform="translate(0)"/><circle class="a" cx="2.779" cy="2.779" r="2.779" transform="translate(20.827 30.303)"/></g></svg>
|
|
400
400
|
{/if}
|
|
401
401
|
{#if invalidPassword && simplepasswordvalidation !== 'true'}
|
|
402
402
|
<p class="InvalidInput">{$_('loginPasswordError')}</p>
|
|
@@ -421,8 +421,13 @@
|
|
|
421
421
|
<style lang="scss">
|
|
422
422
|
.grecaptcha-badge { opacity:0;}
|
|
423
423
|
|
|
424
|
+
input, select {
|
|
425
|
+
font-family: inherit;
|
|
426
|
+
}
|
|
427
|
+
|
|
424
428
|
.PlayerLoginFormWrapper {
|
|
425
429
|
height: 100%;
|
|
430
|
+
border-radius: var(--emw--border-radius-medium, 15px);
|
|
426
431
|
}
|
|
427
432
|
|
|
428
433
|
.FormContainer {
|
|
@@ -430,13 +435,13 @@
|
|
|
430
435
|
}
|
|
431
436
|
|
|
432
437
|
.FormLogin {
|
|
433
|
-
background: var(--
|
|
438
|
+
background: var(--emw--registration-color-bg, var(--emw--color-gray-50, #F9F8F8));
|
|
434
439
|
padding: 50px;
|
|
435
440
|
}
|
|
436
441
|
.FormHeaderTitle {
|
|
437
|
-
color: var(--
|
|
438
|
-
font-size: 20px;
|
|
439
|
-
font-weight: 300;
|
|
442
|
+
color: var(--emw--registration-contrast, var(--emw--color-typography-cotrast, #444444));
|
|
443
|
+
font-size: var(--emw--font-size-large, 20px);
|
|
444
|
+
font-weight: var(--emw--font-weight-light, 300);
|
|
440
445
|
padding: 0;
|
|
441
446
|
text-transform: uppercase;
|
|
442
447
|
margin: 0;
|
|
@@ -445,18 +450,18 @@
|
|
|
445
450
|
position: relative;
|
|
446
451
|
}
|
|
447
452
|
.FormRequired {
|
|
448
|
-
color: var(--
|
|
453
|
+
color: var(--emw--color-error, var(--emw--color-error, #ed0909));
|
|
449
454
|
}
|
|
450
455
|
.FormHeaderSubtitle {
|
|
451
|
-
color: var(--
|
|
452
|
-
font-size: 14px;
|
|
453
|
-
font-weight: 300;
|
|
456
|
+
color: var(--emw--registration-contrast, var(--emw--color-typography-cotrast, #444444));
|
|
457
|
+
font-size: var(--emw--font-size-small, 14px);
|
|
458
|
+
font-weight: var(--emw--font-weight-light, 300);
|
|
454
459
|
margin: 5px 0 0 0;
|
|
455
460
|
}
|
|
456
461
|
.FormRegisterCallToAction {
|
|
457
|
-
color: var(--
|
|
458
|
-
font-size: 14px;
|
|
459
|
-
font-weight: 400;
|
|
462
|
+
color: var(--emw--registration-color-primary, var(--emw--color-primary, #22B04E));
|
|
463
|
+
font-size: var(--emw--font-size-small, 14px);
|
|
464
|
+
font-weight: var(--emw--font-weight-normal, 400);
|
|
460
465
|
text-decoration: none;
|
|
461
466
|
cursor: pointer;
|
|
462
467
|
}
|
|
@@ -464,30 +469,36 @@
|
|
|
464
469
|
padding-top: 20px;
|
|
465
470
|
}
|
|
466
471
|
.UserContainer, .PasswordContainer, .CaptchaContainer {
|
|
467
|
-
color: var(--
|
|
472
|
+
color: var(--emw--registration-contrast, var(--emw--color-typography-cotrast, #444444));
|
|
468
473
|
display: flex;
|
|
469
474
|
flex-direction: column;
|
|
470
475
|
position: relative;
|
|
471
476
|
label {
|
|
472
|
-
font-size: 14px;
|
|
473
|
-
font-weight: 300;
|
|
477
|
+
font-size: var(--emw--font-size-small, 14px);
|
|
478
|
+
font-weight: var(--emw--font-weight-light, 300);
|
|
474
479
|
padding-bottom: 5px;
|
|
475
480
|
}
|
|
476
481
|
input {
|
|
477
482
|
width: 100%;
|
|
478
483
|
height: 44px;
|
|
479
|
-
border:
|
|
480
|
-
border
|
|
481
|
-
box-sizing:border-box;
|
|
484
|
+
border-radius: 15px;
|
|
485
|
+
border: 1px solid var(--emw--registration-contrast, var(--emw--color-typography-cotrast, #444444));
|
|
486
|
+
box-sizing: border-box;
|
|
482
487
|
padding: 5px 15px;
|
|
483
|
-
font-size: 16px;
|
|
488
|
+
font-size: var(--emw--font-size-medium, 16px);
|
|
484
489
|
line-height: 18px;
|
|
490
|
+
|
|
491
|
+
&:focus {
|
|
492
|
+
border: 2px solid var(--emw--registration-color-primary, var(--emw--color-primary, #22B04E));
|
|
493
|
+
outline: none;
|
|
494
|
+
}
|
|
485
495
|
}
|
|
486
496
|
&.InvalidField {
|
|
487
497
|
input {
|
|
488
|
-
border: 1px solid var(--
|
|
489
|
-
background: var(--
|
|
490
|
-
|
|
498
|
+
border: 1px solid var(--emw--color-error, var(--emw--color-error, #ed0909));
|
|
499
|
+
background: var(--emw--color-pale, #FBECF4);
|
|
500
|
+
outline: none;
|
|
501
|
+
color: var(--emw--registration-contrast, var(--emw--color-typography-cotrast, #444444));
|
|
491
502
|
}
|
|
492
503
|
}
|
|
493
504
|
}
|
|
@@ -504,36 +515,37 @@
|
|
|
504
515
|
bottom: 55px;
|
|
505
516
|
&.InvalidToggle {
|
|
506
517
|
path, circle, rect {
|
|
507
|
-
fill: var(--
|
|
518
|
+
fill: var(--emw--color-error, var(--emw--color-error, #ed0909));
|
|
508
519
|
}
|
|
509
520
|
}
|
|
510
521
|
path, circle, rect {
|
|
511
|
-
fill: var(--
|
|
522
|
+
fill: var(--emw--registration-contrast, var(--emw--color-typography-cotrast, #444444));
|
|
512
523
|
}
|
|
513
524
|
}
|
|
514
525
|
.SignInButton {
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
border:
|
|
518
|
-
|
|
526
|
+
background-image: linear-gradient(to bottom, color-mix(in srgb, var(--emw--color-primary, #22B04E) 80%, black 20%), var(--emw--color-primary, #22B04E), color-mix(in srgb, var(--emw--color-primary, #22B04E) 80%, white 30%));
|
|
527
|
+
border: 2px solid var(--emw--button-border-color, #0E5924);
|
|
528
|
+
border-radius: var(--emw--button-border-radius, 50px);
|
|
529
|
+
color: var(--emw--button-typography, var(--emw--button-text-color, #FFFFFF));
|
|
530
|
+
font-family: var(--emw--button-typography);
|
|
519
531
|
width: 100%;
|
|
520
532
|
height: 60px;
|
|
521
533
|
padding: 0;
|
|
522
534
|
text-transform: uppercase;
|
|
523
|
-
font-size:
|
|
535
|
+
font-size: var(--emw--font-size-medium, 16px);
|
|
524
536
|
cursor: pointer;
|
|
525
537
|
&[disabled] {
|
|
526
|
-
background: var(--
|
|
527
|
-
border: 1px solid var(--
|
|
538
|
+
background: var(--emw--color-gray-100, #E6E6E6);
|
|
539
|
+
border: 1px solid var(--emw--color-gray-150, #828282);
|
|
528
540
|
cursor: not-allowed;
|
|
529
541
|
}
|
|
530
542
|
}
|
|
531
543
|
.ForgotPasswordButton {
|
|
532
544
|
border: 0;
|
|
533
545
|
background: transparent;
|
|
534
|
-
font-size: 14px;
|
|
535
|
-
font-weight: 300;
|
|
536
|
-
color: var(--
|
|
546
|
+
font-size: var(--emw--font-size-small, 14px);
|
|
547
|
+
font-weight: var(--emw--font-weight-light, 300);
|
|
548
|
+
color: var(--emw--registration-color-primary, var(--emw--color-primary, #22B04E));
|
|
537
549
|
margin-top: 15px;
|
|
538
550
|
cursor: pointer;
|
|
539
551
|
}
|
|
@@ -542,7 +554,7 @@
|
|
|
542
554
|
}
|
|
543
555
|
|
|
544
556
|
.InvalidInput {
|
|
545
|
-
color: var(--
|
|
557
|
+
color: var(--emw--color-error, var(--emw--color-error, #ed0909));
|
|
546
558
|
font-size: 10px;
|
|
547
559
|
position: absolute;
|
|
548
560
|
top: 55px;
|
|
@@ -551,8 +563,8 @@
|
|
|
551
563
|
}
|
|
552
564
|
.ErrorMessage {
|
|
553
565
|
margin: 0 0 15px 0;
|
|
554
|
-
font-size: 12px;
|
|
555
|
-
color: var(--
|
|
566
|
+
font-size: var(--emw--font-size-x-small, 12px);
|
|
567
|
+
color: var(--emw--color-error, var(--emw--color-error, #ed0909));
|
|
556
568
|
}
|
|
557
569
|
.FormMobileContainer {
|
|
558
570
|
height:100%;
|
|
@@ -564,11 +576,9 @@
|
|
|
564
576
|
.PasswordContainer input,
|
|
565
577
|
.CaptchaContainer {
|
|
566
578
|
max-width: unset;
|
|
579
|
+
border-radius: var(--emw--border-radius-medium, 15px);
|
|
567
580
|
}
|
|
568
|
-
|
|
569
|
-
// margin: 0;
|
|
570
|
-
// height: 100%;
|
|
571
|
-
// }
|
|
581
|
+
|
|
572
582
|
}
|
|
573
583
|
|
|
574
584
|
.ModalLoaderWrapper {
|
|
@@ -590,8 +600,8 @@
|
|
|
590
600
|
height: 64px;
|
|
591
601
|
margin: 8px;
|
|
592
602
|
border-radius: 50%;
|
|
593
|
-
border: 6px solid var(--
|
|
594
|
-
border-color: var(--
|
|
603
|
+
border: 6px solid var(--emw--registration-color-primary, var(--emw--color-primary, #22B04E));
|
|
604
|
+
border-color: var(--emw--registration-color-primary, var(--emw--color-primary, #22B04E)) transparent var(--emw--registration-color-primary, var(--emw--color-primary, #22B04E)) transparent;
|
|
595
605
|
animation: Loader 1.2s linear infinite;
|
|
596
606
|
}
|
|
597
607
|
|