@everymatrix/general-player-login-form 0.0.225 → 0.0.227

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": "0.0.225",
3
+ "version": "0.0.227",
4
4
  "main": "dist/general-player-login-form.js",
5
5
  "svelte": "src/index.ts",
6
6
  "scripts": {
@@ -36,5 +36,5 @@
36
36
  "publishConfig": {
37
37
  "access": "public"
38
38
  },
39
- "gitHead": "f58cef61f569c3d9b496becafc3ab9e93cb5eca7"
39
+ "gitHead": "87c5d90286e7d4214a1e8f9ec974787cb1fd71a6"
40
40
  }
@@ -227,9 +227,9 @@
227
227
  <label for="Password">{$_('loginForm.loginPassword')}:<span class="FormRequired">*</span></label>
228
228
  <input bind:value={userPassword} on:keyup={validatePassword} type="password" id="Password" bind:this={passwordVisibilityToggle} />
229
229
  {#if isPasswordVisible}
230
- <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:#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>
230
+ <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(--emfe-w-color-contrast, #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>
231
231
  {:else}
232
- <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:#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>
232
+ <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(--emfe-w-color-contrast, #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>
233
233
  {/if}
234
234
  {#if invalidPassword}
235
235
  <p class="InvalidInput">{$_('loginForm.loginPasswordError')}</p>
@@ -272,7 +272,7 @@
272
272
  padding: ttp(3.125);
273
273
  }
274
274
  .FormLeftSide {
275
- background: #F9F8F8;
275
+ background: var(--emfe-w-color-gray-50, #F9F8F8);
276
276
  }
277
277
  .FormRightSide {
278
278
  background-size: cover;
@@ -280,7 +280,7 @@
280
280
  background-repeat: no-repeat;
281
281
  }
282
282
  .FormHeaderTitle {
283
- color: #000000;
283
+ color: var(--emfe-w-color-black, #000000);
284
284
  font-size: 20px;
285
285
  font-weight: 300;
286
286
  padding: 0;
@@ -291,16 +291,16 @@
291
291
  position: relative;
292
292
  }
293
293
  .FormRequired {
294
- color: #FD2839;
294
+ color: var(--emfe-w-color-secondary, #FD2839);
295
295
  }
296
296
  .FormHeaderSubtitle {
297
- color: #58586B;
297
+ color: var(--emfe-w-color-gray-300, #58586B);
298
298
  font-size: ttp(0.875);
299
299
  font-weight: 300;
300
300
  margin: ttp(0.3125) 0 0 0;
301
301
  }
302
302
  .FormRegisterCallToAction {
303
- color: #D0046C;
303
+ color: var(--emfe-w-color-primary, #D0046C);
304
304
  font-size: ttp(0.875);
305
305
  font-weight: 400;
306
306
  text-decoration: none;
@@ -310,7 +310,7 @@
310
310
  padding-top: ttp(1.25);
311
311
  }
312
312
  .UserContainer, .PasswordContainer, .CaptchaContainer {
313
- color: #58586B;
313
+ color: var(--emfe-w-color-gray-300, #58586B);
314
314
  display: flex;
315
315
  flex-direction: column;
316
316
  padding-bottom: ttp(1.25);
@@ -323,7 +323,7 @@
323
323
  input {
324
324
  width: 100%;
325
325
  height: ttp(2.75);
326
- border: 1px solid #D1D1D1;
326
+ border: 1px solid var(--emfe-w-color-gray-100, #E6E6E6);
327
327
  border-radius: ttp(0.3125);
328
328
  padding: ttp(0.3125);
329
329
  font-size: ttp(0.875);
@@ -334,9 +334,9 @@
334
334
  }
335
335
  &.InvalidField {
336
336
  input {
337
- border: 1px solid #D0046C;
338
- background: #FBECF4;
339
- color: #D0046C;
337
+ border: 1px solid var(--emfe-w-color-primary, #D0046C);
338
+ background: var(--emfe-w-color-primary-50, #FBECF4);
339
+ color: var(--emfe-w-color-primary, #D0046C);
340
340
  }
341
341
  }
342
342
  }
@@ -352,17 +352,17 @@
352
352
  bottom: 45px;
353
353
  &.InvalidToggle {
354
354
  path, circle, rect {
355
- fill: #D0046C;
355
+ fill: var(--emfe-w-color-primary, #D0046C);
356
356
  }
357
357
  }
358
358
  path, circle, rect {
359
- fill: #58586B;
359
+ fill: var(--emfe-w-color-gray-300, #58586B);
360
360
  }
361
361
  }
362
362
  .SignInButton {
363
- color: #fff;
364
- background: #D0046C;
365
- border: 1px solid #D0046C;
363
+ color: var(--emfe-w-color-white, #FFFFFF);
364
+ background: var(--emfe-w-color-primary, #D0046C);
365
+ border: 1px solid var(--emfe-w-color-primary, #D0046C);
366
366
  border-radius: ttp(0.3125);
367
367
  width: 100%;
368
368
  height: ttp(3.75);
@@ -371,7 +371,7 @@
371
371
  font-size: ttp(1.125);
372
372
  cursor: pointer;
373
373
  &[disabled] {
374
- background: #c1c1c1;
374
+ background: var(--emfe-w-color-gray-100, #E6E6E6);
375
375
  border: 1px solid #c1c1c1;
376
376
  cursor: not-allowed;
377
377
  }
@@ -381,7 +381,7 @@
381
381
  background: transparent;
382
382
  font-size: ttp(0.875);
383
383
  font-weight: 300;
384
- color: #D0046C;
384
+ color: var(--emfe-w-color-primary, #D0046C);
385
385
  margin-top: ttp(0.9375);
386
386
  cursor: pointer;
387
387
  }
@@ -390,7 +390,7 @@
390
390
  }
391
391
 
392
392
  .InvalidInput {
393
- color: #D0046C;
393
+ color: var(--emfe-w-color-primary, #D0046C);
394
394
  font-size: ttp(0.625);
395
395
  position: absolute;
396
396
  top: 55px;
@@ -400,7 +400,7 @@
400
400
  .ErrorMessage {
401
401
  margin: 0 0 15px 0;
402
402
  font-size: 12px;
403
- color: #D0046C;
403
+ color: var(--emfe-w-color-primary, #D0046C);
404
404
  }
405
405
  .FormMobileContainer {
406
406
  height:100%;
@@ -432,8 +432,8 @@
432
432
  height: ttp(4);
433
433
  margin: ttp(0.5);
434
434
  border-radius: 50%;
435
- border: ttp(0.375) solid #D0046C;
436
- border-color: #D0046C transparent #D0046C transparent;
435
+ border: ttp(0.375) solid var(--emfe-w-color-primary, #D0046C);
436
+ border-color: var(--emfe-w-color-primary, #D0046C) transparent var(--emfe-w-color-primary, #D0046C) transparent;
437
437
  animation: Loader 1.2s linear infinite;
438
438
  }
439
439